How well does it score?

88% average fidelity over 4 recorded runs. Best model: Claude 4.6 Sonnet. Weakest recorded run: 86% on GLM-4.6 (CN).

Are failures included?

No build failures are recorded for this prompt, and the log says so rather than implying every model succeeded elsewhere.

Concept render — composed live from this prompt's palette & layout. Reproducible with the library, not a stock screenshot.

Concept scene: Aurora Veil — open in library →

HardwareBetaby Motif Studiopublished 2026-09-11

Hardware product page with sticky spec table and compare drawer

Q: What does the Hardware product page with sticky spec table and compare drawer prompt produce?

A hardware website with Hero, Sticky spec table, Exploded-view slot, Compare drawer, Buy CTA. The vibe target is "engineered, matte, precise" and the prompt body is printed in full on the page.

vibe: engineered, matte, precise

intermediate — 5 blocks, 2 stacksdesktop viewport≈ 100 lines generated (estimate)≈ 800 tokens to run (estimate)

prompt.txt — copy-paste ready

A spec page for people who read spec pages.
• Matte palette: graphite, silver text, one signal-orange accent for interactive only.
• Hero: product render slot, name, one-line differentiator, price, buy CTA.
• Sticky spec table: two-column body with the spec header sticking under the nav; group headers (Dimensions, Power, I/O); monospace values.
• Exploded-view slot: a static labelled-diagram placeholder with a caption crediting the schematic — honest about not being 3D.
• Compare drawer: 'compare with' opens a bottom drawer listing up to two sibling products, columns aligned to the spec table's rows.
• Buy CTA: stock state as text first, colour second.
• The table is a real table with a caption; compare state is announced.• Craft floor: Reduced motion is honoured with a static branch; all colours flow through CSS-variable tokens.

Palette tokens:#14161A#E6E8EA#F26430#3D4650#23272E

revised 2026-09-12 — Bank-3 batch 3: palette tokens, component links, viewport and the retry guard added under items #52/#55/#57/#74.

Remix this brief:

— Lighter: same brief on a white ground with one accent kept.
— Denser: halve the whitespace and add a second content column.
— Playful: keep the structure, swap the display face and let one section animate on view.

Stacks shipped:Next.jsReactBlocks:HeroSticky spec tableExploded-view slotCompare drawerBuy CTA

Components this brief typically renders:

Comparison Slider →Split Button Menu →Skeleton Profile Card →

Community:▶ Re-run this prompt ⤴ Submit a remix of it ★ Your saved listRe-runs are a labelled simulation; the run log on this page is the real record.

⚠ Before you run it, know this