Clovoso: cinematic website templates and the AI prompts behind them

Build a single-screen hero section for {{BRAND}}, {{NICHE}}.

Scroll-driven website templates, and the AI prompts that build them.

“Build a single-screen hero section for {{BRAND}}, {{NICHE}}.”

Cinematic websites,one prompt away.

Pick a title.Watch it move.

Each preview is a real site built from a single prompt. Choose one to put it on the screen.

Nimbus Aero

Fly-in landing hero + subject-over-wordmark

Open the prompt

The library

Every preview comes with the prompt that made it. Open one, copy it, and paste it into Claude, Cursor or v0.

39 templates. Lifetime access unlocks every Pro prompt.

Copy. Paste.Launch.

  1. Step 1

    Pick a prompt

  2. Step 2

    Paste it into your AI

  3. Step 3

    Launch it

Website prompt, Nimbus Aero

Build ONLY a single-screen cinematic HERO SECTION for {{BRAND}} ({{NICHE}}) in the "fly-in landing + subject-over-wordmark" style — one 100svh block, no other sections, no page scroll. It must drop into an existing page as-is. Stack: plain HTML/CSS/JS (or React) + GSAP 3, Google Fonts. The centerpiece is my clip `asset.mp4` ({{DURATION}}, 16:9): {{SUBJECT}} travels in from far away, grows toward camera and lands/settles dead-center in the foreground, then holds still.…

yourbrand.com

Want one built for you?

Our studio takes on a few client sites each month. Those builds never go into the library.

Start a project

Every prompt.Pick your plan.

Join 6,100+ builders shipping cinematic sites with Clovoso.

  • Every template, component, shader, section and UI screen
  • New prompts every Friday, for as long as Clovoso runs
  • Use them for yourself and for client work
  • FREE

    $0

    3 copies a day

    Free templates only

  • MONTHLY

    —/mo

    Unlimited copies

    Every template

  • ANNUAL

    —/yr

    Unlimited copies

    Every template

  • LIFETIME

    $299

    Unlimited, forever

    Every template

One email a week. Unsubscribe any time.

Hero SectionPro

Late Owl Roasters

Cursor-follow mascot hero + code gate

One full-screen hero, no scroll: a costumed mascot fills the right of the frame on a flat colour backdrop and turns its head to look at the visitor's cursor (a frame sequence on a canvas, picked by pointer position and eased), while a huge stacked headline, filter chips, a vertical nav rail and a pill-shaped code-entry gate sit on the left. A ring cursor with a trailing dot drives it all.

  • Layout: one 100svh block with overflow hidden. Full-bleed canvas behind everything; the subject sits on the right ~55% of the frame against a seamless flat backdrop, the left ~45% is empty backdrop that carries the UI.
  • Cursor-follow: the clip is a single locked-off head turn (rest pose looking at the camera → full turn toward the UI side). Pointer X relative to the subject's head picks the frame (left of the head = turn toward it, right = rest pose), eased with a ~0.09 lerp per frame. After ~3s without movement the head settles back to the rest pose. On load it does one slow look-around before the pointer takes over.
  • Asset tip: if your clip snaps the head turn into a few frames, keep the rest pose, the turn and the held profile, and motion-interpolate the turn (e.g. ffmpeg minterpolate 4x) so the eased lerp has enough in-between frames; record the frame indices in frames.json as look.center / look.left / look.right.
  • Touch: dragging anywhere on the hero steers the head the same way; with no touch input it runs a slow automatic look-away-and-back loop. The custom cursor is hidden on touch.
  • Custom cursor (fine pointers only): a 46px outline ring that follows the pointer with a 0.2 lerp, and an 8px solid dot that sits on the real pointer, so it leads the ring while moving and stays clamped inside it (max 14px offset); it re-centres when the pointer stops. The ring grows to 66px with a soft fill over links, chips, buttons and the input, shrinks while the button is pressed, and fades out when the pointer leaves the window. Never hidden while the pointer is on the page.
  • Top-left kicker: a small solid dot that blinks on a steady 1.6s step, then the brand · drop name in spaced mono caps.
  • Headline: three stacked lines in a heavy, tightly tracked display grotesk, ~10vw, the middle line indented with a small brand glyph after it; lines rise from masks on load.
  • Filter chips: two rows of outlined pill chips in mono caps; exactly one is filled (ink background, light text). Click moves the filled state (single select, aria-pressed); hover darkens the outline.
  • Code gate (bottom-left): a mono caps label with a round '?' button whose tooltip opens on hover/click above it (and flips inward if it would clip); a light pill field showing N slot dots that fill with masked bullets as you type, a blinking underline on the next slot, a SHOW/HIDE text toggle that reveals the characters, and a dark pill GO button in the display face. Wrong code: the field shakes and an aria-live line explains; right code: the field inverts to dark and the line confirms the unlock. Under it a small mono disclaimer line.
  • Right edge: a vertical pill rail (light fill) with 5 nav links in rotated mono caps; hover widens their tracking. On phones it collapses to a MENU pill top-right.
  • Interaction hygiene: the hero is user-select:none (the input stays selectable), canvas aria-hidden, every control keyboard-focusable with a visible outline, Escape closes the tooltip.
  • Mobile (≤760px): native 9:16 frame crop centred on the subject, drawn bottom-anchored at ~80% height so the head sits under the headline (the gap above is filled by stretching the frame's top row of backdrop), chips hidden, the gate full-width at the bottom over a darkening scrim.
  • Reduced motion: no canvas, no follow, no custom cursor; three key poses (rest, half turn, full turn) crossfade every ~4.5s; blink and shake animations off.
  • Palette (example): backdrop terracotta #b35a2c, ink #22140c, cream #f4e8d6, moon accent #f6d9a8. Type (example): Bricolage Grotesque 800 for display, JetBrains Mono for labels.
The full prompt unlocks when you copy it

Fill these in to make it yours