PrototypeBridge — HTML to a connected Figma prototype

About this plugin

Converts a running interface into a connected Figma prototype. Drop in an HTML export and get real frames, real auto-layout and real prototype interactions, with the screens already wired to each other.What makes this different?Other code-to-Figma tools give you frames. You still draw every connection by hand.This one explores your interface the way a person would, finds the screens, and writes the navigation between them as real Figma prototype interactions.It works on single-page apps, where screens are JavaScript state rather than separate URLs. There are no links to follow, so there is nothing for a crawler to crawl.Press Present when it lands and click through it.How do I use it?Export your interface as a self-contained HTML file, or a zip with index.html at the root.Open PrototypeBridge and choose the file.Watch it find the screens. Nothing is written to your file yet.Press the button. The frames land on the page you already have open, in a named section.What lands on the canvas?A frame per screen, with auto-layout, editable text and real image layers.Prototype interactions between them: navigation, overlays, back and close.Repeated elements promoted to component sets, keyed by what actually varies.A start frame, so Present works straight away.A page that is a sheet of screens laid side by side converts as one screen, not as one frame per screen.Fonts loaded from the web cannot be fetched during conversion, so text is measured in a substitute. Bring the folder or zip and it is inlined.What files can it read?A self-contained .html file.A .zip with index.html at the root.A folder, using Choose a folder.If your page loads its stylesheet or fonts from a CDN, bring the folder or zip and it will inline them.What will it not do?Canvas, freehand drawing, drag-positioned elements and infinite scroll do not convert, and never will.A page that renders unstyled will convert unstyled. It tells you which files were missing.It is a projection, not a copy - lossy by design.What does it cost?Free. No account, no sign-in, no limit on runs.What about my files?Your page is converted on your machine and never uploaded.The plugin sends anonymous counts only: how many screens a capture produced, how long it took, and which warnings fired.Never the page, its text, its file name, or who you are.You can turn it off in the panel, i use these metrics only to improve the solution.SecurityTo report a security issue, email [email protected] with "security" in the subject. I will acknowledge within five working days.Made by Zacharia Curtis