Clouds
Procedural cumulus, shader-generated each frame.
Showcase
A sky generated, every frame
Procedural cloud backdrops on a web page used to mean a looping video — pre-rendered footage of real clouds, shipped as MP4 and streamed to the visitor. That works, but it's a fixed asset: same clouds every time the page loads, and no real "live sky" feeling. The alternative — real volumetric clouds raymarched per pixel — produces stunning visuals but costs an enormous per-pixel budget. Beautiful in a tech demo, unshippable as a background.
This sits in the middle. The cloud shapes are generated in real time from a multi-octave noise field, projected onto the sky via a perspective trick — the same d.xz/d.y formula used in flight simulators since the eighties. A second noise layer simulates the self-shadow that gives cumulus their luminous tops and shadowed undersides. The HDRI sky behind it provides atmospheric depth.
The technique trades the dimensional truth of a raymarched volume for something cheaper that still reads convincingly as a cloudy sky — and crucially, fast enough to actually use. Real-time generated, no baked assets, runs on integrated graphics. The kind of thing you could put behind your hero copy without your CPU fan spinning up.
Want to bring WebGL to your site?
Let's talk about what it would take.