What it is
The store runs the Horizon theme: a sticky two-row header, a scene rail of garments hanging from a catenary, a runway with six looks pinned to a wall, a shelf wall of shoes, a shader-driven slider and a bag drawer.
Rebuilding it is a test of whether an interface can be reproduced from its output alone — no theme files, no design handoff, just the rendered page and a ruler. The result is 18 static pages that open from any static server. Nothing is fetched from the store: fonts, photography and video sit in the folder, and the bag is localStorage.
The hard part
Geometry that only exists at runtime. The rail is a catenary sampled into a path, and each garment hangs at its own angle. Instead of eyeballing it, the build reads the live path's points and replays them under the same viewBox, so the curve, the tag anchors and the hover-widen transform agree at both widths.
Pages that scroll a div, not the window. The theme puts the scroll on .page-wrapper and hides the body overflow. Every scroll-linked measurement — the header shrink, the runway pins, the story progress — had to target the container instead of window, or the page silently stops responding to scroll.
Differences that are not bugs. Four templates ship no <h1>, five products share the same SEO title, and the home <h1> is the password page's hidden heading. "Fixing" them would have broken fidelity, so the clone reproduces them and records why in its README.
Evidence
-
Page heights, live vs clone Home 5669 → 5650. Runway 1410 → 1410. Shoe atelier 1057 → 1057. 404 1293 → 1293. Products and collection within a few px at both widths.
-
Band-by-band pixel diff Screenshots compared band by band against the live page: 1.0 to 4.0 mean error on the measured sections, out of 255.
-
Whole-site audit 18 pages at 1440 and 390: zero console errors, zero failed requests, zero broken images, every visible control labelled.
-
Click-path suite Search, add to bag, cart drawer, quantities, removal, mobile menu, story video, rail drag, runway bundle, carousel, sort, atelier detail.
-
Payload Photography recompressed from 36 MB to 8.4 MB at 46 dB PSNR before shipping. The whole demo, videos included, is 18 MB.
Stack
HTML, CSS custom properties and vanilla JavaScript, one stylesheet and one module per section. Playwright and Pillow for measurement, screenshot diffing and image work. No framework, no bundler, no runtime dependency.
Limits
This is a recreation, not a product. The brand, photography and copy belong to the original store, and the demo is published noindex as an engineering study. There is no checkout, account, order or backend — the bag lives in the browser and "check out" does nothing.
One section the theme renders with WebGL is reproduced with a CSS cross-fade: it matches the still frames but not the shader, and a handful of hidden accessibility layers differ from the store by a few pixels.