Webflow
Proven — everything measured was built here
Frost Design Group
frost-figma-to-web · v0.14.0
Plugin walkthrough
Figma to Web
A Figma screen in. A built Webflow page out.
Webflow
HTML
13 October 2026
Frost Design Group
01 · What it is
Orientation
What it is, and how you run it.
1440 · 980 · 480
Figma frames
frost-figma-to-web
v0.14.0
The plugin
Webflow or HTML
/start-conversion
It reads which stage the project is at, and starts there.
Once per project · /project-setup <name> · eight questions Asked together, in one message 1TargetWebflow or plain HTML 2ScopeOne page or several, and how many share a navbar and footer 3Design setAll screens ready, or arriving in waves 4FigmaThe file link, and one frame link per breakpoint 5DestinationThe Webflow site and page, or the output folder 6Class namespaceTwo to four letters 7May it write to FigmaAnnotations and pipeline lane moves need it 8Pipeline rowRow code and page title, if it sits on the board A question left blank stays a placeholder. Nothing is guessed. , then it creates the project folder What it writes into the folder CLAUDE.mdFacts, decisions, deviations and open state audit.mdFindings F1, F2, F3 on — each disposed at Stage 7 relationship-table.mdCopied from the template build-log.mdThe build narrative jobs/Empty — Stage 1 writes one folder per screen assets/Empty — Stage 0.5 exports and converts into it custom-code/Webflow target only; an output folder instead, for HTML .claude/settings.local.jsonPermissions, including the decision to let Figma be written Each is created only if it does not already exist. .
✦One page at a time
Frost Design Group
02 · Stages
The stages
Nine stages, in order.
Read the design
Decide
Build
Finish
0Audit the design fileGate
0.5Prepare every assetGate
1Annotate & split
2DecideStops for you
3Relationship tableGate
4Build the design system
5Build each section↻ 7-row gate
6Behaviours
7Fidelity pass
Where the screen moves on the pipeline board
Expects it inFor Design Conversion
Moves toConverting
Moves toReady for Devt
At the first writeDeveloping
Moves toFor Code and peer Review
Gatewon't continue until it passes↻repeats for every section◆waits for your answer
Stages 0, 2, 3 and 4 set up the whole project — later screens skip them and start at Stage 1.
Frost Design Group
03 · The gate
The gate
Every section passes seven checks.
1Values at the three widths
2A width in between
3No sideways scroll
4Text matches
5Images load, with alt text
6Lines break the same
7Render beside Figma
any row fails → fix → re-run all seven
✓ All seven pass — and only then does the next section start.
Frost Design Group
04 · Output
Conversion time
Where the time goes.
Frost
The live page
Homepage2h 03m/frost-main
Build 1h 46m, gate 4m, visual pass 10m. No rework recorded against it.
1 page · first project
86%14%
2h 03mper page
Mynt
Five live pages · six timed runs
IPO at a Glance1h 20m/mynt-v2/ipo-at-a-glance
Newsroom40m/mynt-v2/newsroom
Cookie Policy18m/mynt-v2/cookie-policy
Result Center1h 00m/mynt-v2/result-center
Homepage1h 04m/mynt-v2/home
Stage 6 behaviours — a pass on IPO at a Glance13m
The median is over all six runs, which is why the fastest reads 13m. A sixth page, IR Overview, is still in Converting — not timed, not counted, not linked.
5 pages · 6 runs
20%80%
50mmedian · 13m to 1h 20m
Golden Bull
The live page
Emerging Bull Award2h 18m/golden-bull
Build 1h 18m, visual pass 28m, rework 27m. Stages 0–4 predate the timer, so they are not in the total.
1 page · 21 publishes
57%23%20%
2h 18mper page · 27m of it rework
buildingproving it matchesrework, found after it was called done
Recorded by the plugin's own timer, one page at a time, excluding the one-time project setup. Golden Bull is the only page so far with rework recorded against it. Not a measured comparison against building by hand — that test has never been run.
Frost Design Group
05 · What it improves
Honest position
What it improves, and what it can’t.
What it improves
Text matches
Diffed against Figma. Lines must break on the same word.
AVIF · 2–4× · alt text
No raster reaches the build unconverted.
rem and em only
One root value scales the whole page.
Behaviour in Webflow
Custom code only where the target can't.
Design system first
116 variables and 23 components before any page.
Components + variants
Six with variants and props registered.
What isn’t proven yet
Plain HTML
Part-proven — one section only
React · Vue
Not targets — new work, not untested work
Next
CMS support
A helper library — Finsweet
Prove a second target
frost-figma-to-web v0.14.0 · timings from the Frost, Mynt and Golden Bull conversions