3.7 Icons

In the Figmaster - Lessons Figma file, open the 3.7 Icons page.

Introduction

In this chapter, you will need to recreate the whole Icons page by yourself. Then, I will also show you how to link to a page in Figma. It will be helpful when, for example, your fellow developers want to jump from the documentation page to the main components page quickly. The Icons page is already done for you because I'm sure you've mastered preparing the documentation page and adding the table.

Step 1. Recreating the page

Open the Figmaster Design System and recreate the Icons documentation page by yourself.

Step 2. Linking to a page in Figma

  1. In the Pages panel on the left in the Figma UI, find the 1.7 Icons page.
  2. Right-click on it and press Copy link to page.
  3. In the Header, inside the Icons page, select the View main components text inside the button.
  4. Having the text selected, press CTRL + V to paste the link.

Great job! Now, you will be able to go directly to the 1.7 Icons page by clicking on this link and selecting the Go to page.

Repeat the action for Click here to see all icons used in the project text in Content > Group frame.

Step 3. Linking to an external website

  1. Select the Phosphor Icons text inside the paragraph in Content > Group frame.
  2. Press CTRL + K on your keyboard to open the link popup.
  3. Paste in this link: https://phosphoricons.com/

Great work! Let's move on!

PreviousNext