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

Ochrefield

Painted ambient-loop SaaS hero

One full-screen hero, no scroll: a bright, hand-painted landscape keeps gently moving in an endless loop (clouds drifting, small things floating, grass swaying) while a classic centred SaaS pitch sits in the open sky above the horizon: a frosted social-proof pill with stacked avatars, a heavy two-line headline whose second line is in the accent colour, a two-line lede and one dark CTA, under a light nav with a logo tile, four links and a dark button.

  • Layout: one 100svh block, overflow hidden. A full-bleed canvas frame sequence (cover fit, horizon kept in the lower third). The nav and the copy share a centred container (~1080px). Nav: a rounded logo tile with a tiny glyph + bold brand name on the left, four plain links centred, a small dark rounded button on the right. Copy block centred at ~45% height: pill, headline, lede, CTA, all centre-aligned.
  • The scene is a light, airy hand-painted illustration (storybook / cel-shaded animation look), not a photo: a wide open sky takes the top 55–60% of the frame with a calm empty area in the centre for the copy, and the landscape (hills, rocks, buildings, plants) fills the bottom third. Big soft clouds and the tallest props sit near the left and right edges so they frame the copy instead of fighting it.
  • Motion is ambient and slow, never the star: clouds drift one way, small floating things (balloons, birds, kites, leaves) rise or glide, plants sway. The camera never moves. The clip plays as canvas frames in an eased ping-pong: the position runs 0 → last frame → 0 with a cosine ease (≈7s each way), so the scene drifts, slows to a stop and drifts back like a slow breath, and the two nearest frames are cross-blended so the turnarounds never hold or stutter. (A tail-to-head dissolve loop is the alternative for pure drift such as water or smoke, but it ghosts any distinct floating object.)
  • Typography: one geometric/grotesque sans for everything. Headline 800 weight, ~5vw, line-height ~1.04, tight tracking (−0.035em), line one in near-black ink, line two in the accent (a two-stop accent gradient clipped to the text). Lede 500 weight, ~17px, muted ink, two lines. Dark text sits directly on the bright sky; a very soft radial light pool behind the copy and a faint top haze for the nav keep it readable without a visible box.
  • Social-proof pill: frosted cream (72% white + backdrop blur, 1px white border, soft shadow), three overlapping 24px avatar circles (initials on gradients, cream ring) + one short line of proof. CTA: dark rounded rectangle (12px radius), cream label, soft drop shadow.
  • Interactive elements (hover/focus only, nothing draggable, no custom cursor): nav links get an accent 2px underline that wipes in from the left and out to the right; both dark buttons lift 2px, deepen their shadow and a light sheen sweeps across, pressing scales them to 0.97; the pill brightens and its avatars fan out slightly. Every control has an accent focus ring. The hero is user-select: none, so dragging across it never selects text.
  • Intro: themed loader (a tiny line-drawn hill with a sun rising behind it, brand name, 0–100% counter, 2px progress bar on a sky-to-sand gradient). Frame 0 is drawn and the intro start state is set before the loader fades; as it lifts, the loop starts, the two headline lines slide up out of overflow masks one after the other, the pill drops in, then lede, CTA and nav rise/fade in. An inline head script adds .js-intro so none of these paint before their beat.
  • Mobile: native 9:16 crop of the clip (its own frame set), nav links hidden (logo + button stay), headline ~9.4vw wrapping to 3–4 lines, the lede's forced break removed, copy block raised to ~40%. Reduced motion: no intro, no loop, three key frames crossfading every 6s.
  • Palette (example): sky teal #cfe3e6 to peach, sand #f6e7d6, cream #fff8ef, ink #1f1a17, terracotta accent #c4552c → amber #d9822f. Type (example): Manrope 500/600/700/800.
The full prompt unlocks when you copy it

Fill these in to make it yours