Take the deck home.
Three paste-ready prompts. No brackets to fill in — copy, drop into your AI builder, done.
Design a Scroll Stack website with a cinematic, neon music-video mood. Build the page as a vertical deck of opaque, flat-colored card sections on a midnight indigo background (#0B0A14) that pin in place on scroll and get fully covered by the next section sliding up over them with a hard drop-shadow seam — no transparency, no blur, no soft depth gradients anywhere. Use deep plum panels (#15131F), neon magenta (#FF3D8B) for the active/top card, neon cyan (#21D4E0) for the card directly underneath it, and warm off-white (#F4F1FA) text. Each section is one idea, one opaque card with a hard seam at its edge — never glassy, never blended.
Best for AI website builders — Lovable, v0, Bolt
Build a cinematic hero plate in a neon dressing-room mood: a looping background video (or, if no video, a dark neon-lit gradient scene) with cursor-driven foreground/background drift, a bold display headline, and a "scroll to press" cue at the bottom. Midnight indigo (#0B0A14) base, neon magenta (#FF3D8B) and cyan (#21D4E0) accents. This hero reacts to the cursor, not scroll — the press-and-cover mechanic only starts in the section below it.
Good for a focused first pass, or a chat-based assistant like ChatGPT/Claude
Restyle this page as a Scroll Stack: turn every section below the hero into a flat, fully opaque card on a midnight-indigo canvas with a hard drop-shadow seam — remove any soft gradients, transparency, or blur. Make each section pin in place briefly on scroll, then get covered edge-first by the next section sliding up over it. Use neon magenta for whichever card is currently on top and neon cyan for the card directly beneath it, with warm off-white text.
Paste alongside your existing site/code for an AI coding agent to apply
Paste any prompt as-is — no edits needed. Add your own brand, copy, or images on top if you want; the prompt already works without them.
Scroll Stack (pin-and-press card deck) guide for AI coding agents: - Palette: a cinematic neon-MV night — midnight indigo #0B0A14 background, deep plum #15131F panels, neon magenta #FF3D8B accent (the active/top card), neon cyan #21D4E0 accent2 (the card directly underneath), warm off-white #F4F1FA text, dusty lavender #9B93B5 muted. - Type: Unbounded (bold display, blocky/card-like), Inter (body). - Tool: position: sticky for plain-CSS builds, or GSAP ScrollTrigger's "pin" option for JS-driven, scrubbed sequences — both implement the same primitive. - The hero is a cinematic MV plate idiom (cursor-driven, autoplay video, not scroll-driven) — only the scroll mechanic in the sections below it carries the style. - Signature elements (sections AFTER the hero): every section is one flat, fully OPAQUE card — no transparency, no blur, no soft depth gradients, ever; a pinned section holds the viewport for a fixed scroll distance, then the next section slides up from the bottom edge and presses over it until fully occluded; a hard drop-shadow/neon-edge seam marks the exact line where the new card lands; one card, one idea — never mix two features on one pinned panel. - Motion: press — lay-down press, like a hand placing the next card flat on a pile. Nothing drifts or fades into translucency below the hero; things press into place and stay until the next press covers them. - Never: translucency, blur, glassy surfaces, or soft drifting depth gradients in the post-hero sections; more than one idea per pinned card; a transition that blends/dissolves instead of cutting hard at the seam.
Drop this into a project's instructions/skill file for a reusable reference, instead of a one-shot prompt.
The deck doesn't run out. Pick the next card.