Measured 26 October 2026 · all six tools
Locofy vs Weld
One Figma file, two builds, measured with the same checks. Locofy turns Figma designs into front-end code. We exported the free Positivus template’s Home frame as HTML and Tailwind, built it with Locofy’s own setup, and measured it next to Weld’s build of the same frame.
Design: Positivus Landing Page Design by Olga Averchenko, CC BY 4.0. Home frame, 1440px wide.
Where it’s strong
- Proper page structure: 28 sections, 27 h2 and 21 h3 headings, with a header, main and footer.
- It writes breakpoints: 355 width-based classes.
- Type at 1440px is close to the design: font sizes match on 67 of 67 texts.
What you get out of the box
The things a client site needs that nobody should have to add by hand afterwards. Each line is checked in the page’s own code.
| Out of the box | Weld | Locofy |
|---|---|---|
| Writes no copy of its own | Yes: none added | No: 20 words added |
| Header, nav, main and footer landmarks | No: no main | No: no nav |
| One h1, no skipped heading levels | –not measured | –not measured |
| Every form field labelled | –not measured | –not measured |
| Alt text on every image | No: 51 of 76 | Yes: 60 of 60 |
| Sharp images on retina screens (2×) | –not measured | –not measured |
| Page language set | Yes: yes | No: no |
| Images shipped with the page | Yes: in the download | Yes: in the download |
| No sideways scroll, 320 to 1440px | Yes: none at any width | No: up to 1,120 px |
The numbers
| Tool | Font sizes match the design texts, at 1440px |
Spacing within 4px gaps between texts |
Sideways scroll | Words not in the design | Images with alt text | Images served from | ||
|---|---|---|---|---|---|---|---|---|
| phone 390px |
laptop 1024px |
laptop 1240px |
||||||
| Weld | 67 of 67 | 65 of 66 | none | none | none | none | 51 of 76 | its own folder |
| Locofy | 67 of 67 | 40 of 66 | 1,050 px | 641 px | 425 px | 20 | 60 of 60 | its own folder |
How closely it follows the design
Spacing drifts more than type: 40 of 66 gaps are within 4px of the design, with a typical miss of 2.1px. Weld: 65 of 66.
The hero at 1440px. Drag the handle: Locofy’s page on the left, the design on the right.
At other widths
The same sections on a laptop (1240px) and a phone (390px).
For all its breakpoints, the page scrolls sideways at every width we tested: 1,050px on a 390px phone, 425px on a 1240px laptop, and 225px even at the design’s own 1440px.
Weld’s page has no sideways scroll at any width we tested, from 320 to 1440px.
Laptop, 1240px
Phone, 390px
It doesn’t open as delivered
The export is Tailwind source code that has to be installed and built before a browser can show it, and its own start command fails, because the code refers to four image files the export doesn’t include. We built it with Locofy’s own setup so we could measure it; every step is listed under How this was run.
Even built, 6 images on the page fail to load.
Pictures in the wrong places
Where the design’s hero has its megaphone, Locofy’s shows the smiling-star illustration from the ‘Let’s make things happen’ panel further down. Five of the six service cards lost their own pictures too, most of them to the same repeated star, and the star in the logo became an arrow.
Our text and spacing checks can’t see a wrong picture, which is why we look at every page by eye too.
Testimonials and alt text
In the testimonials, the speech-bubble tails are among the images that fail to load, and the row starts at the first card instead of the design’s centred view with a quote cut off at each edge.
Every one of its 60 images has an empty alt, which tells screen readers to skip it.
Its HTML also carries the placeholder text ‘Label’ 18 times, a word that isn’t in the design.
- Speech bubble: design artwork (image), 606 px wide
- Bubble tail: in the artwork
- First view: centred, neighbours cut
- Arrows: image file
- Dots: one image
- 1 different quote
- Speech bubble: design artwork (image), 606 px wide
- Bubble tail: in the artwork
- First view: first card at left
- Arrows: none found
- Dots: one image
- 1 different quote
- First view: centred, neighbours cut
- Arrows: image file
- Dots: 3 separate dots, follow the slide
- 1 different quote
Try Weld’s page yourself
This is the page Weld built from the same file, live. Resize it and watch it reflow.
Drag the frame’s bottom-right corner to resize it, or open the page on its own and resize your browser.
How this was run
Locofy
- Run on
- 26 October 2026
- Output used
- Two exports: 'Positivus Landing Page Design (Community).zip' (13:14) and an extracted export (14:44, measured). They differ only in class order and tailwind.config.js.
What we changed so we could open and measure it
- Locofy exports Tailwind v4 source files, which a browser cannot use directly. We compiled them with Locofy's own setup (its package.json: Parcel + @tailwindcss/postcss; dependencies resolved 2026-10-26) and linked the compiled stylesheet in place of global.css.
- Its HTML links images as /public/... (site-root paths). We changed them to ./public/... so the page works from any folder. Same files, same names.
- One exported image is named just ".svg" (an unnamed Figma layer). Many web servers send that without an image type, so we copied it to public/unnamed-layer.svg.
- The export references 4 file(s) it does not include (Content-Description.svg, Polygon-1.svg, Shape-Element.svg, Shape-Structure.svg). They stay missing in the measured page. Parcel will not finish while they are missing, so the build step alone used empty placeholders.
Weld
- Output used
- the zip a Weld user downloads, unchanged
- Built
- 26 October 2026
- Generator version
- 6de49e4
Measured exactly as delivered: nothing changed.
Download both outputs
- Weld output zip, 373 KB, sha256
11d0bf2965cd7dba… - Locofy output zip, 325 KB, sha256
4d6e3be827d29db8… - All measurements (results.json) CC BY 4.0: reuse them with a link back
The other tools on the same file
| Tool | Font sizes match the design texts, at 1440px |
Spacing within 4px gaps between texts |
Sideways scroll | Words not in the design | Images with alt text | Images served from | ||
|---|---|---|---|---|---|---|---|---|
| phone 390px |
laptop 1024px |
laptop 1240px |
||||||
| Weld | 67 of 67 | 65 of 66 | none | none | none | none | 51 of 76 | its own folder |
| Figma MCP + Claude Code | 35 of 66 | 32 of 65 | none | none | none | 219 | 43 of 43 | its own folder |
| Anima | 67 of 67 | 58 of 66 | 1,050 px | 416 px | 200 px | none | 0 of 59 | c.animaapp.com |
| Codia | 68 of 68 | 56 of 67 | 1,058 px | 424 px | 208 px | none | no <img> tags | static.codia.ai |
| Locofy | 67 of 67 | 40 of 66 | 1,050 px | 641 px | 425 px | 20 | 60 of 60 | its own folder |
| FigmaToCode | 2 of 68 | 35 of 67 | 28,191 px | 27,557 px | 27,341 px | 178 | no <img> tags | its own folder |
| CopyWeb | Could not produce a page to measure. | |||||||
Want your own file measured like this?
Weld’s beta is opening soon. Register and we’ll email you once, when you can upload a file and get the finished page with these checks run on it.