In Figma, you can create hyperlinks within text elements to link to external websites or internal Figma locations.
Creating a hyperlink in Figma is a straightforward process, primarily involving text elements. You can link specific words or phrases to external URLs or even internal Figma destinations like pages or frames.
Steps to Link Text in Figma
To turn a word or phrase within a text layer into a clickable hyperlink:
- Select the Text Tool (T) or double-click on an existing text layer to enter editing mode.
- Highlight the specific word or phrase you want to hyperlink.
- With the text highlighted, locate the Link icon (resembling a chain link) in the text properties panel, usually found in the right-hand sidebar or the context menu that appears near the selected text.
- Click the Link icon. A field will appear where you can paste or type the destination URL (e.g.,
https://www.example.com
). - Press the return key. As mentioned in the reference, pressing the return key finalizes the hyperlink creation on that word.
Once created, the hyperlinked text will typically appear underlined, though this styling can sometimes be adjusted.
What Can You Link To?
Figma allows you to create links to various destinations, enhancing interactivity and navigation within your designs or prototypes:
- External Websites: Link text directly to any URL on the web. This is common for including website references or calls to action.
- Internal Figma Locations: The reference highlights that you can also link to:
- Pages: Link to a specific page within the same Figma file.
- Frames: Link to a particular frame on any page in the same file.
- Projects: You can even link to entire Figma projects. (Getting links for these internal locations typically involves using Figma's "Copy link to selection" feature and pasting that link into the hyperlink field).
Creating links is essential for building interactive prototypes or simply adding external references directly within your design files.