Renders a Figma frame into a website using SVGs.
This website was generated from this Figma file and it's updated every 5 minutes.
- Create a new project in Figma. Add a frame and put some stuff in it.
- Select the frame and copy the
FILE_IDandNODE_IDfrom the URL (hint:https://www.figma.com/file/FILE_ID/USERNAME?node-id=NODE_ID) - Go to your Figma profile and generate a new personal access token (you'll only need to do this once).
- Edit the hidden
.env.samplefile in this project and paste theFILE_ID,NODE_ID, and the token. - Rename
.env.sampleto.env. - Update the
SECRETwith a random string.
You are all set! Now:
- Visit
YOUR_GLITCH_URL.me/refresh/SECRETto import and your Figma frame / refresh the SVG. - Visit
YOUR_GLITCH_URL.meto see your beautiful frame rendered as an SVG.
Bonus points: use cron-job.org to ping the refresh URL every X minutes and have the SVG updated automatically while you sl 617E eep or walk your cute dog!
