Golden-hour wind farm hero (WebGL shader)
Golden-hour hills, swaying grass and spinning wind turbines at every distance, all in one fragment shader behind a bright clean-energy landing page.
Live — built from this exact promptOpen live demo
prompt.md
Course onlyBuild a single, self-contained index.html: a bright, optimistic landing page for [ENERGY / CLIMATE PRODUCT] with live, shader-rendered golden-hour hills full of spinning wind turbines behind it. Brand: [BRAND NAME] — [WHAT IT DOES IN ONE SENTENCE] Headline: [LINE 1, light] / [LINE 2, bold] Live card: [CARD TITLE, e.g. Ridge Line 4] with [MAIN READING, e.g. MW] and 3 small stats Palette: [e.g. navy ink #18203a on a pale blue-to-gold sky, sun orange #f0a24a] Technical rules
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
- ✓Layered hills with aerial haze and mouse parallax
- ✓Wind turbines drawn as 2D distance shapes
- ✓Wind-bent grass, drifting clouds and a sun flare
- ✓A frosted example output card with a live sparkline
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.
