GRIT
A cinematic site for six strength and conditioning clubs, told as one day
Unlock at launch
Join the waitlist for access to this piece. Already a member? Sign in
You're signed in as a member: copy the full prompts, or switch the film to the live preview.
What's inside
- Prompts
- HTML · 185 lines / React · 245 lines
- Media
- Background film · Background image
- Hosting
- cdn.orbital.supply, already in the prompt
- Fonts
- Sofia Sans Extra Condensed + Onest · Google Fonts
- HTML
- One file · gsap 3.15.0
- React
- React 19.3.0 · gsap 3.15.0 · @gsap/react 2.1.2 · Tailwind 4.3.3 · Vite 8.3.2 · TypeScript 6.0.3
- Motion
- film-entrance, line-mask, nav-morph, scroll-velocity-stretch
Tested & documented
15 October 2026
- Reproduced in Claude
- Rebuilt blind from the prompt: React and HTML
- Checked at 375, 768, 1440, 1920 px
- Spec linter: 0 errors, no generator links
How to use it
Claude
Paste the HTML prompt into a new chat. You get one index.html to serve over HTTP or publish anywhere.
Vite + React
Open an empty Vite + React project and paste the React prompt. It lists the exact packages; the asset URLs are already inside.
The prompt
Excerpt / 245 lines in the full prompt
# Build: "GRIT — built in the hard part" — a cinematic one-page site for six strength and conditioning clubs, told as one day from 06:00 to 22:00
## 0. Brief
GRIT (fictional) runs six strength and conditioning clubs. Dark and cinematic: every scene is a night club lit by ultramarine LED strips, chalk type, one big condensed line per scene. The brand device is the gym interval timer: the CTA carries the time of the next session, a card counts down to it, the booking ends on a pass that keeps counting, and section labels are hours of the day. Wow moments: a looping boxer film behind the title; four giant words that stretch with scroll speed; a pinned 3D spiral of twelve club photos that turns, names the club facing you and folds into a deck beside the club list.The full prompt unlocks at launch.