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.

Browse the libraryHow it works

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

Cinematic websites,one prompt away.

See the prompt behind BrocadeBrowse the library

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

Kindlewood

Cursor-follow mascot hero, editorial split layout

One full-screen hero, no scroll: a big, soft 3D mascot stands full-height on the left third of a seamless colour backdrop and turns its head and shoulders to look wherever the visitor's cursor goes (a canvas frame sequence, mirrored for the second side), while a calm editorial column sits on the right: a ruled mono kicker, a large serif headline with one italic accent phrase, a short paragraph, a solid and a ghost pill button and a three-figure stats row. A thin mono ticker drifts along the bottom edge.

  • Layout: one 100svh block, overflow hidden, no other sections, no page scroll, no footer. Full-bleed canvas behind everything. The mascot fills the full viewport height with its nose axis parked at ~27% of the width; the copy column starts at ~55% and is vertically centred. Nav on top: serif wordmark with a small glyph on the left, four spaced mono links in the centre, an outlined pill (cart/booking count) on the right.
  • Head turn from ONE clip: a single turn from facing the camera to a three-quarter view toward ONE side; the other side is the same frames drawn mirrored around the nose's x (mirrorAxis in frames.json). The front pose must be exactly symmetric so crossing the centre never pops. Resample the turn evenly by measured motion (frame-difference per frame) so the follow feels linear, not eased.
  • Off-centre placement on a 16:9 asset: the mascot is centred in the clip, then the frame is drawn at full viewport height shifted left. Fill the uncovered backdrop beside it by averaging the frame's outer column band into a soft vertical gradient and stretching it sideways, feathered over the last ~48px so there is no seam. Each frame supplies its own edge, so lighting stays continuous while the head turns.
  • Interaction inventory: (1) the mascot follows the pointer's X across the whole viewport, relative to its own head: pointer left of the head = look left, right of it = look right, over the face = front pose (small dead zone); it keeps looking at the last pointer position and eases back to the front when the pointer leaves the window. Lerp ~0.085 per frame, no snapping. (2) The normal system cursor stays (no custom cursor). (3) Nav links get a hairline underline that wipes in on hover; the pill and buttons fill on hover; the solid button's arrow nudges up-right. (4) The ticker drifts left at a constant slow speed forever and never pauses. (5) Touch: dragging anywhere on the hero steers the gaze (touch-action: none on the hero); with no input the mascot slowly looks left and right on a ~9s loop.
  • Intro (no flash): an inline <head> script adds .js-intro, CSS hides nav, kicker, headline lines, paragraph, buttons, stats and ticker before first paint; frames preload behind a themed loader (brand glyph, serif wordmark, hairline progress bar, mono counter); frame 0 is drawn before the loader fades; gsap.set applies the start state, then the guard lifts. As the loader fades the mascot glances left, right and home (~2.8s) while the nav drops in, the headline lines rise out of masks with a stagger, the paragraph, buttons and stats fade up and the ticker slides up from the bottom edge.
  • Typography: a high-contrast book serif for the wordmark, headline (~5.3vw, -0.02em, line-height 1.02) and stat figures; the accent phrase in the serif's bold italic in the accent colour; a mono at ~11.5px with 0.16em tracking for nav, kicker, buttons, stat labels and ticker; a neutral sans for the paragraph.
  • Palette: backdrop sampled from the asset; deep ink for text and the solid button; one warm accent for the italic phrase and the logo glyph; muted ink for labels; hairline dividers at ~22% ink.
  • Phones: stacked. Nav keeps wordmark + pill, copy sits at the top (stats hidden), the mascot is drawn bottom-anchored from a native wider-than-9:16 crop of the 2x clip, sized so its ears clear the buttons; the backdrop above it is the frame's top rows stretched upward. Reduced motion: no follow, no intro, no ticker motion; three poses (front, right, left) rendered with the same layout and crossfaded every 5s.
The full prompt unlocks when you copy it

Fill these in to make it yours