![](https://framerusercontent.com/images/R1CdZkZKJu3seNDwH8OKKz4y0YY.webp)
Feb 1, 2024
![](https://framerusercontent.com/images/fePK9tc9hwOEFdU6x3V7pwbp6cU.png)
Madhuri Maram
Copy, paste, and publish.
Export your Figma designs by simply copying what's on the canvas and pasting it in Framer. The plugin takes care of adapting your design to Framer’s layout tools in real time, so you can focus solely on making a great website.
The Framer workflow is optimized for going from Figma to website with ease. The cool thing about this is that you don't have to convert your design to code — with Framer manually, you can paste your Figma file into Framer and publish it as-is. All layer names and groups are fully preserved.
Your layer structure and naming will all be carried over, so it is easy to pick up where you've left off. You can continue editing your website and make it more engaging, or you can simply hit the publish button.
Best Practices
Finish your design in Figma and construct the basics in Framer.
Try to import only the pieces you need like icons, images, SVGs, etc and assemble it in Framer.
Mobile design has to be reconstructed in Framer through stacking. So plan for that design in advance.
How to Paste
Install the Figma to HTML with Framer plugin
In Figma, select what you want to copy
Go to the
Figma menu
→Plugins
→Figma to HTML with Framer
In Framer, open a new or existing project
Paste on the canvas.
You can run the last plugin again with
⌥⌘P
.
What cannot be imported?
Interactive features
Image strokes
Corner smoothing
Components from Figma