Import any frame from Figma as an image. Uses the Figma API, so you can import private files too.
This component has two required options, the file URL and the Figma API access token.
Finding the file URL
This component is able to render a single frame selection in Figma as an image, given a link to that selection. Here’s how to find the proper URL:
On Figma desktop:
Click “Share” in the top right corner, then copy the file link with “Link to selected frame” checked.
On Figma web:
Make a frame selection. Info about the current selection should update automatically in the address bar.
Make sure that
node-id appears in the URL, somewhere near the end. To be more exact, it should be part of the query string.
Finding the Access Token
The easiest way to obtain an API key is through Figma’s developer documentation. Keep this token in a safe place!
Figma URL: a URL to a Figma file, query param
node-id=<STRING>. You can get this by clicking “Share” in the top right corner, then copying the file link with “Link to selected frame” checked.
Access Token: your Figma access token. If you don’t have one you can go to Figma’s developer documentation to generate an access token.
Scale: A number between 1 and 4, the image scaling factor. Defaults to 2x.
Format: The image file format—either .PNG, .SVG, or .JPG. Defaults to .PNG.
Force Reload: Disables caching of Figma API requests. Set this to False if you don’t know what this means.
Contact me on Twitter: @lilytried
Opening Package in Framer X...
Don’t have Framer X yet?Start your Free Trial