Fluid
A thousand particles obeying SPH physics in a tilting glass tank.
Showcase
A thousand particles, behaving like water
Real fluid simulation used to live in render farms. Water in animated films was minutes per frame, not seconds — the moving-water shot in Antz took a render farm to produce. The web equivalent was a Photoshop ripple, a looping video of an aquarium, or a sprite trick that read as water if you didn't look too hard.
This one is real. A thousand particles, each carrying a position, a velocity, a density, and a pressure. Every frame the simulation looks at each particle's neighbours within a smoothing radius, computes the local density, derives a pressure from how much that density deviates from rest, and turns the pressure gradient into a force that pushes neighbours apart. Viscosity damps the chaos. Gravity does the rest. The tank tilts on a slow time-based oscillation by default — on a phone where you grant motion access, the tilt follows the device. Drag inside the tank with the cursor to stir.
Smoothed-Particle Hydrodynamics. The technique came out of astrophysics in the late seventies, for simulating gas clouds collapsing into stars. It took thirty years to make its way back down to earth. It now runs at sixty frames a second on a laptop, in JavaScript, in a browser tab.
Tuning
Want to bring WebGL to your site?
Let's talk about what it would take.