Skip to content

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

Concept scene: Star Motes — open in library →
DarkModeBetaby Motif Studiopublished 2026-09-10

Dark-mode-first page — same brief, delivered for the dark

vibe: dim-first, glow-disciplined, night-calm

starter4 blocks, 1 stack700 tokens to run (estimate)
prompt.txt — copy-paste ready
A prompt-form experiment: take a standard product-landing brief and deliver it dark-first — the dark surface is the design, not the afterthought.
• Dark hero: the page opens on deep charcoal, not white — the hero image tuned for dark (dimmer, cooler, no blown highlights) and the type at true dark-mode contrast (not pure white, which glows at night).
• Glow discipline: accent colours are used once and sparingly — one glow per screen, a shared shadow token, nothing neon; in dark mode, restraint is what reads as quality.
• Contrast audit: a small audit strip showing the page's real contrast ratios (text 12.1:1, muted 7.2:1, accent-on-dark 4.8:1) because dark mode fails quietly on contrast.
• Day toggle: a working light-mode toggle as a courtesy, with the honest note that the dark version is the one that was designed.
• Palette: three greys, one disciplined accent, and nothing else — the brief's own constraint list applied.
Stacks shipped:HTMLBlocks:Dark heroGlow disciplineContrast auditDay toggle
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
  • On Codex the first build failed — Accent glow overflowed on one card; fixed with a shared shadow token.