Website to Figma: bring the whole site, not just the homepage

There are three ways to get many pages of one website to Figma, and they combine well.

Multiple links

Paste up to 10 URLs into the Multiple tab. The plugin processes them sequentially and places each page in its own row, so a Desktop, Tablet and Mobile capture of one page sits together and pages stack below each other.

Import linked pages

After an import, the plugin can list other pages of the same site that are linked from it. Pick the ones you want and they run as a Multiple import. Starting from the homepage, this usually covers the main navigation in a couple of rounds.

Site folder or .zip

If you have the static build, drag the folder into the Local file tab or upload a .zip of up to 30 MB, then choose which HTML pages to bring in. Files are opened from memory inside an isolated browser and deleted as soon as the import finishes.

Each page counts as one import, whatever the number of screens. On Free you have 10 imports per month; Pro and Team are unlimited within a fair-use allowance. See pricing for details.

A static set of frames is useful, but clients and stakeholders understand a site faster when they can click through it. HTML to Frames keeps the navigation you already have:

• Links between imported pages become Navigate interactions, so clicking Pricing on the homepage frame goes to the pricing frame.
• Other links keep an Open link action and open in the browser.
• Fixed and sticky headers stay in place while you scroll in Present mode.
• Horizontal scroll areas, such as carousels and tab strips, scroll sideways.

On Pro, elements with a hover look become component sets with Default and Hover variants and an on-hover interaction, so buttons and menu items react when you move over them.

This makes the imported site a baseline you can present as is. Walk through the current experience, mark problems with comments, then duplicate the frames and start the redesign next to the original. Because every frame stores its source URL, you can re-import any page later and compare the live site with the proposal. More on how pages are structured in HTML to frame.

Prototype connections are only created between pages that are part of the import, so adding pages with Import linked pages also extends the clickable flow.

For a design agency, the first week of a project often goes into recreating the client's existing site so there is something to redesign. Importing it removes most of that work and leaves the team with a file that is already organized.

A typical flow looks like this:

1. Before the pitch: import the client's key templates and turn on Styles & variables to see the color and type system actually in use.
2. During discovery: present the clickable import to the client and annotate pain points directly on the frames.
3. During the redesign: duplicate frames and change them in place; components extracted from repeated structures speed up global changes.
4. At handoff: re-import changed pages to confirm what shipped.

The Team plan gives five seats on a shared license key, at a launch price of $22 per month, with up to four screens per import. That suits a small studio where several designers import client sites in parallel.

Agencies handling client work also tend to ask about data. Pages are rendered in an isolated browser, results are delivered once and never written to disk. The full picture is on the security page.