Procedural Generation - WebGL / WebGPU Community — Showcase, Tutorials, Examples & More | WebGL / WebGPU Community

Martin Laxenaire's Portfolio Is a WebGPU Game Built on His Own Engine

Martin Laxenaire turned his portfolio into a playable WebGPU experience powered by gpu-curtains, his own 3D engine. Procedural particles, boids, and invoice-sized spheres unlock as you interact. Full source code and a Codrops breakdown included.

Mar 22, 2026

Spacetime in Your Browser: A General Relativity Sandbox Built with BabylonJS

Drop planets onto a deformable spacetime grid and watch gravity warp the mesh in real time. Built with BabylonJS and Ammo.js physics, Hitesh Sahu's simulation turns the rubber-sheet analogy into something you can actually play with. Collision sounds included.

Mar 8, 2026

BOIDS: A Parametric Playground for Emergent Flocking Behavior

BOIDS simulates flocking through three local rules: separation, alignment, cohesion. No central control. Every parameter is exposed. Click to attract, right-click to scatter. Built in p5.js with texture support and video export.

Mar 6, 2026

Bear 71: An Immersive Documentary Where a Grizzly Bear Becomes a Data Point

A grizzly bear's tracked territory rendered as surveillance grid. The NFB and Jam3 built a WebGL environment where Banff National Park looks like a living dashboard and coexistence feels like a systems problem.

Mar 5, 2026

San Rita: A Studio Site Disguised as a Topographic Map

San Rita ditches the agency portfolio grid for something stranger: a navigable topographic landscape where projects sit like waypoints on a trail system. Some paths are open, some are closed for restoration. It's weird, deliberate, and worth inspecting.

Feb 26, 2026

Igloo Inc: Crystal Growth Algorithms, Shader-Driven UI, and Volume Data

Abeto built the Igloo Inc site entirely in WebGL, from procedurally grown ice crystals to shader-driven UI text. The particle footer alone, powered by custom VDB-to-browser volume data, is worth the scroll.

Feb 19, 2026

In The Clouds: Tallest Buildings as 40-Meter Blocks

The world's tallest buildings rendered as stacked 40-meter blocks in Three.js. One block equals four floors. Pure client-side WebGL with procedural geometry. No map tiles, just height data and math.

Feb 12, 2026

PLAIN: Generate Low-Poly 3D Terrain Graphics in Your Browser

PLAIN creates low-poly 3D plane graphics using vertex geometry and simplex noise. Displace a grid into terrain. Animate the surface. Control camera, color, shape. Export stills or loops. Built in p5.js.

Feb 6, 2026

ATMOS: A Scroll-Driven Flight Through Procedural Skies

A tiny plane follows a spline through high-poly clouds and shifting gradients. Troika renders the text. A fake DoF blur keeps it cheap. LEEROY made the whole thing load without a progress bar.

Jan 29, 2026

FLAKE: Distance-Driven Pattern Generation With Custom Shapes

FLAKE uses distance-from-center to control scale, color, and rotation across a grid of shapes. Use images as masks. Export to vector or video.

Jan 17, 2026

Aurelia: Fully Procedural Jellyfish with WebGPU

A real-time procedural jellyfish built with Three.js WebGPURenderer. Bell contractions, verlet tentacles, and iridescent shaders are all generated on the fly in TSL. No baked textures, just pure GPU compute.

Jan 8, 2026

Holiday Snow Globe

Michael Modena's holiday snow globe uses WebGPU compute shaders to create volumetric snow that actually fills the dome with mesh-based particles generating proper normals. Plus a Porsche GT3 drifts inside. It's a Christmas card that doubles as a lighting and compute shader stress test.

Dec 23, 2025

Messenger

Messenger is a beautifully crafted WebGL delivery game. Set on a tiny cel-shaded planet, it runs flawlessly across browsers. Explore the charming world, complete deliveries, and discover hidden surprises.

Dec 22, 2025