Watch Configurator 3D

Built for Oreval, the sample brand inside the template

A watchmaker's product page where the watch is real-time 3D: turn it, scroll and it lifts apart into eight labelled layers, then swap case, dial and strap and watch it change with the price.

It builds, or it's free. If this prompt doesn't rebuild the site you saw in its live demo, email us within 14 days of buying for a full refund.

Watch Configurator preview: A watchmaker's product page where the watch is real-time 3D: turn it, scroll and it lifts apart into eight labelled layers, then swap case, dial and strap and watch it change with the price.
Open in a new tab

How it moves

The first screen is the watch big on light grey with the visitor's own time on its sage sunburst dial, "Meridian 39." bottom left and the price and Reserve bottom right; dragging turns it, and it coasts and springs home. Scrolling pins a section where the watch turns side-on and lifts apart into eight layers along its axis, crystal to caseback, each named on a hairline leader, with a slider under the copy that follows and drives the scroll. It closes beside a configurator whose pills open into swatches: rose gold, black DLC, four photographic dials and three straps change the 3D watch and the price live. A highlights gallery autoplays three photos; the watch turns over to show the movement and its swinging rotor while the specs count up; a full-bleed studio portrait settles as it passes; and the close shows the visitor's own configuration turning once on a soft shadow with its price and one Reserve button. All copy, options and image slots sit in one content file, the palette in one theme file.

What you get

  • A tested build prompt · 13.1k wordsPaste it into Claude Code, Cursor, Codex or Lovable and it builds the landing page section by section.
  • The working projectVite + React. npm install && npm run dev and it runs, no keys or accounts.
  • The assets and their promptsEvery image and loop, plus the exact prompts that made them, so you can make your own.

Inside the prompt

A one-product site for a watchmaker (the sample is the Oreval Meridian 39, an automatic watch built to order in Le Locle), in the format of a flagship product page: light grey ground, one grotesk, the product big. The watch is real-time 3D, modelled in three.js: a turned steel case with polished lugs, a knurled crown, a domed crystal, a photographic sunburst dial, dauphine hands set to the visitor's own time, and leather straps curving away as if round a wrist. One canvas sits behind the whole page and the watch eases from pose to pose as you scroll, so it is never a cut.

  1. What it is
  2. Style collection
  3. Build steps
  4. Assets
  5. Motion
  6. Make it yours
  7. Launch checklist
  8. Acceptance checks

More like this