Firefly night forest with moon and pond (WebGL)
A cinematic night forest for a glamping brand: layered pines, mist, moonbeams, a big moon and hundreds of blinking fireflies reflected in a still pond.
Live — built from this exact promptOpen live demo
prompt.md
Course onlyBuild a single, self-contained index.html: a dark landing hero for a [BUSINESS TYPE, e.g. glamping retreat] with a live night forest full of fireflies. Brand: [BRAND NAME] — [WHAT YOU OFFER, ONE SENTENCE] Headline: [LINE 1] / [LINE 2 with an italic, glowing word] Palette: [e.g. moonlit blue-black #04070d, warm firefly amber #ffc46b, cream text #fbf4e6] Technical rules - One file. Plain WebGL, no libraries. Google Fonts allowed (e.g. DM Serif Display + Manrope + 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
- ✓Four parallax rows of procedural pines drawn in one shader
- ✓A pond that re-paints the scene mirrored, with ripples and glitter
- ✓Hundreds of blinking firefly sprites with their own reflections
- ✓A glass booking bar and an example forecast card over the scene
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.
