Design

URL to Figma

Import any public website into editable Figma layers using the ToolReign H2D Figma plugin — no backend, no uploads to ToolReign.

URL import runs in the Figma plugin

Browsers block ToolReign from fetching arbitrary websites (CORS). Our Figma plugin fetches HTML directly and converts it to editable layers — no ToolReign backend, no uploads.

Note: URL import uses the initial HTML response (no JavaScript execution). SPAs and login walls may import incompletely — use HTML to Figma to paste rendered HTML instead.

Website URL

Copy this URL, then paste it into the Figma plugin URL field.

Install the ToolReign H2D plugin

In Figma: Plugins → Development → Import plugin from manifest → select figma-plugin/toolreign-h2d/manifest.json from this repo (or use the published Community plugin when available).

Enter a public URL

Open the plugin in Figma, switch to the URL tab, paste a website address (e.g. https://example.com), and click Import. Fetching happens inside Figma — nothing is sent to ToolReign servers.

Edit in Figma

Layers appear on your current page as frames, text, and images. Adjust auto-layout, colors, and typography like any Figma design.

Figma Community Plugins Paste HTML instead

Sideload from repo

Run npm run build:figma-plugin
In Figma desktop: Plugins → Development → Import plugin from manifest
Select figma-plugin/toolreign-h2d/manifest.json

Full instructions: /figma-plugin/toolreign-h2d/README.md

Related Tools

More free utilities you might find useful

Frequently Asked Questions

Quick answers to common questions

Why can't ToolReign fetch URLs directly?+

Browsers block cross-origin requests (CORS). Our Figma plugin fetches HTML from inside Figma without sending data to ToolReign.

Is the website sent to ToolReign?+

No. The URL is entered in the Figma plugin, which fetches and converts HTML locally in your Figma session.

How do I install the plugin?+

Sideload from this repo (figma-plugin/toolreign-h2d/manifest.json) via Figma → Plugins → Development → Import plugin from manifest.

What sites work best?+

Static HTML sites and marketing pages with server-rendered content import most accurately.

Do SPAs and React apps work?+

Partially. URL import fetches initial HTML without running JavaScript. For SPAs, paste rendered HTML using the HTML to Figma tool instead.

Can I import login-protected pages?+

Not via URL in v1. Copy HTML from DevTools after logging in and use HTML to Figma.

Is the plugin free?+

Yes. The ToolReign H2D plugin is free to use.

What about fonts and images?+

Web fonts fall back to Inter in Figma if not installed. Images from the page are embedded where possible.