Responsive website to Figma: desktop and mobile at once
One saved page, rendered at each width you tick. Media queries apply per viewport, so a row that stacks on mobile imports as a vertical Auto Layout frame there. Breakpoints sit side by side.
Read the guide →
How to get a Webflow, Framer or WordPress site into Figma
Three builders, one method: they all publish ordinary rendered pages. Let the page finish loading, save it as a single file, drop it on the plugin. CMS lists become components, the palette becomes variables.
Read the guide →
How to import a live website into Figma as editable layers
Save the page as a self-contained file, drop it on the plugin, pick your viewports. Works on production, staging, localhost and anything behind a login — because you save the page your browser is already looking at.
Read the guide →
Turn AI-generated HTML into editable Figma layers
Output from v0, Lovable, Bolt or Claude converts cleanly — repeated blocks become components, the palette becomes variables. First, the runtime-CSS trap that makes most generated pages import completely unstyled.
Read the guide →
How to bring Pencil (.pen) designs into Figma as editable layers
Pencil keeps your design in the repo as a .pen file, but sooner or later someone outside your editor needs to see it. Export the node as HTML and CSS, then import it with html2figma. No screenshots, no rebuilding.
Read the guide →