Designer’s Guide

Links

Figma supports different ways to create links. You can create links to URLs or links via prototype interactions. We will explain the different options here.

Create a link in text

Select the part of the text that needs to be a link.
image 1
You will be prompted to enter a URL. You can either: Enter an absolute page path (starting with “/”) corresponding to the section name of the page that you want to navigate to. Such as: “/my-page”. Enter a template with website domain, such as: “https:///my-page”. Enter an external URL, such as: “https://www.google.com”
image 2
Figma will replace “/my-page” with “https:///my-page”. This is normal, and figma.to.website will interpret it to properly link to the corresponding internal page.

Link via prototype: On click -> Navigate to

You can add a “Navigate to” interaction to a Section or a Frame of a page. figma.to.website will translate this to a link.
image 3
figma.to.website doesn’t support Transitions for navigation yet. All transitions will be “Instant” in the published website.

Link via prototype: On click -> Open link

You can also use an “Open link” interaction. figma.to.website will translate this to a link.
image 4
“Open in new tab” option is not currently available with Figma API, so it will have no effect.
Made
with