Paste HTML and CSS, preview live, and export H2D JSON to import editable Figma layers via our companion plugin.
More free utilities you might find useful
Quick answers to common questions
H2D (HTML-to-Design) is ToolReign's JSON format describing Figma-compatible layers — frames, text, images, and layout — generated from HTML.
No. Rendering and conversion run entirely in your browser. Your markup never leaves your device.
Generate H2D JSON here, copy it, then use the ToolReign H2D Figma plugin and choose Paste H2D JSON to create editable layers.
Static HTML with common elements (div, headings, paragraphs, buttons, images, SVG) and basic CSS including flexbox, colors, borders, and shadows.
Not in v1. Flexbox layouts map better to Figma auto-layout. Grid-heavy pages may need manual adjustment after import.
URL fetching requires the Figma plugin due to browser security. Use our URL to Figma page for that workflow.
Match your target design width — 375 for mobile, 768 for tablet, 1280 for desktop. Layer positions are relative to that width.
Yes. 100% free with no signup required.
Your data is processed entirely in your browser. Nothing is sent to any server.