Edit any live page like Figma, chat to tweak it, then export it to Figma as editable layers — or file a documented GitHub issue.
Users
14
+4 in 30 days
Rating
1.0 / 5
unchanged in 30 days
Ratings
1
0 in 30 days
Store rank
#171K
#143K among extensions
Version
0.1.0
updated 15 Jul 2026
Users
monthly, 3 months
Latest, 17 Oct 2026:14 usersMove the mouse over the chart for any month
Ratings count
monthly, 3 months
Latest, 17 Oct 2026:1 ratingsMove the mouse over the chart for any month
The Chrome Web Store rounds user counts down to the leading digit, so the user line moves in steps. The ratings count is exact and is the better signal of real adoption.
About DesignLoop: HTML to Figma & Live Page Editor
DesignLoop turns the page you are looking at into a design canvas — and closes the loop between design and code.
Select any element on any live page and edit it the way you would in Figma: a familiar edit panel for spacing, typography and color, applied instantly to the real page. Or just describe the change in plain language — "tighter padding, darker text" — and chat your way through tweaks to the whole page, live, until it looks right. By default the AI is Chrome's built-in on-device model, so it runs entirely on your machine.
DesignLoop can also read the design system a page is already built from — its colors, type, spacing, radii and shadows — name it, snap the page's near-duplicate values back onto it, and export it as CSS variables, a Tailwind theme or W3C tokens.
When it looks right, hand it off. Export the element to Figma as real, editable layers — frames, text, vectors, images, auto-layout — not a flat screenshot. Or push the whole session to GitHub as one documented issue: your transcript, an annotated screenshot, the before/after, a machine-readable style diff, the exact XPath and CSS selectors, sanitized HTML, captured console errors, and an environment table. Design, page, and repo stay connected in a single workflow.
Privacy by default. DesignLoop has no backend and no analytics. On default settings nothing leaves your browser: the default model runs on-device and voice transcription is off. Two more powerful cloud models are available, but they are opt-in and run on an API key you supply yourself — the extension calls the provider directly, never a server of ours, because there isn't one. When you push an issue it goes straight from your browser to your repo using your own token. Input values and secret-shaped attributes are redacted from captured HTML before you ever see the draft — and you review every draft before it sends.
Requires Chrome 116 or later. Live editing with the on-device model uses Chrome's built-in Prompt API (Chrome 138+); without it, that feature accepts raw CSS instead.
Growth
Window
Users
Change
Ratings
Rating
7 days
0
+0.0%
0
0.00
30 days
+4
+40.0%
0
0.00
Chrome Web Store search rankings
Where DesignLoop: HTML to Figma & Live Page Editor appears when people search the store, with the 30 day change