Shader sunset over the ocean
A live sea at golden hour — rolling waves, a low sun, glowing clouds and a glittering sun path — behind a calm, editorial landing page.
Live — built from this exact promptOpen live demo
prompt.md
Course onlyBuild a single, self-contained index.html: a landing page for [ORGANISATION / PRODUCT] with a live, shader-rendered sunset over the ocean filling the screen. Mission: [ONE SENTENCE] Headline: [LINE 1] / [LINE 2, set in italic] Readings for the bottom strip: [4 LABELS + VALUES, e.g. Swell 1.4 m · Water 17.8 °C · Wind 12 kn · Debris watch Low] Technical rules - One file. Plain WebGL — one full-screen triangle and one fragment shader, no libraries or images. Google Fonts allowed (e.g. Fraunces + Inter + JetBrains Mono).
The full prompt comes with the course
All 55 prompts in the library are part of the Vibewrights course. Enrollment opens in January 2027 — join the waitlist to get the founding-member price.
See what's includedWhat you'll get
- ✓Sky, clouds and sea in one fragment shader
- ✓Waves from summed directional sine waves
- ✓Fresnel reflections and a glittering sun path
- ✓A serif layout with a glass strip of live readings
How to use it
- 1Replace everything in [BRACKETS] with your own product, copy and colors.
- 2Paste it into Claude Code, Cursor, Lovable or Bolt and open the page in Chrome.
- 3Compare with the live demo, then tune one thing at a time.
— From the course
You'll build this end-to-end in Module 3, with a step-by-step video walkthrough and AI feedback on your project.
