Notion and Figma
Notion is an all-in-one workspace for your notes, tasks, wikis, and databases.
Blocks allow you to add different types of content to your Notion pages. From bullet points to images, to embeds and code snippets.
The Figma block lets you embed a live view of a public Figma file on any Notion page. This allows you to:
- Embed Figma files inside your meeting notes or design specs.
- Share your designs with teammates who may not use Figma.
- Collect design feedback from collaborators.
Note: Figma embeds only work in browser-based applications. You can only use file and prototype embeds when using Notion in the browser, not in their native applications.
Embed a Figma file in Notion
You can embed any file or prototype, regardless of the file's link sharing settings. Collaborators can interact with Figma Live Embeds based on:
- Their team or Organization permissions
- The file's link sharing permissions
In Figma
- Open the file you want to embed in Notion.
- To link to a specific frame in the Figma file, select the frame you'd like to embed.
- Click the Share button in the toolbar.
- Check the box to Link to selected frame (Optional)
- Update your Link Sharing permissions to determine who can interact with the embed (Optional).
- Click Copy link.
In Notion
-
In Notion, navigate to the page where you'd like to embed your Figma file or prototype.
-
There are two ways to add a Figma Live Embed:
-
Paste the URL you just copied to your clipboard, select Embed Figma from the dropdown or press
return
/enter
. -
Type in the slash command /figma, then paste the file's URL into the embed block.
-
-
To resize the embed, hover your cursor over the embed and drag the black bars.
-
You can then interact with the file or prototype.
Remove a Figma embed
To remove an embedded Figma file from your Notion page, hover over the embed with your cursor, and click the ⋮⋮
that appears to the left, then click Delete.
Tip! Learn more about Notion embeds in their Help Center.