Dune Wind

About Dune Wind

A desert you can steer the wind across, drawn live in WebGL. Five ranges of dunes fade into the haze, each with a sharp crest and a shadowed slip face; sand streams off the crests and dust drifts past. Move the cursor and the wind swings round to blow towards it, with a gust when you sweep fast. Switch it to Scroll and the sun sets behind the dunes until the stars come out. Your headline, text and button sit in the sky above.

Features

• A real-time desert in WebGL: five ranges of dunes, haze, sun and sky.

• Real dune shapes: long windward slopes, sharp crests, shadowed slip faces, ripples.

• Sand streams off the crests and dust drifts past on the wind.

• The wind turns to follow the cursor, and a fast sweep throws a gust.

• Scroll mode: the sun sets behind the dunes and the stars come out.

• Auto mode blows in slow gusts from the prevailing side; Still holds a breeze.

• Eyebrow, title, subtitle and a button in the sky, centred or aligned left.

• Sky, sun, sand, shadow and haze colours, sun position, horizon and dune height.

• Reduced motion, a CSS frame in Framer's canvas and a no-WebGL fallback.

• One standalone React + TypeScript file, 31 property controls.

Created by LUNAUT Studio.