Smoke Simulation
Watch a GPU-simulated smoke plume billow and curl in real time. Drag to push the smoke around, then tune buoyancy, density, and turbulence.
Space for a burst, P to pause.Why Use This Smoke Simulation?
A GPU-powered smoke playground that billows, curls, and rises entirely in your browser
The fluid solver runs on your GPU through WebGL fragment shaders, delivering smooth 60 fps smoke without taxing the CPU.
A built-in buoyancy force lifts the smoke so it billows upward and curls naturally, just like a real plume catching the air.
Dial in thick, lingering smoke or thin, fast-fading wisps. Tune density dissipation, curl, splat radius, and force in real time.
Full mouse and multi-touch support. Swirl smoke on your phone, tablet, or desktop — the canvas adapts to any screen size.
No server, no uploads, no tracking. The whole simulation runs in your browser — it even keeps working offline once loaded.
Works on Chrome, Firefox, Safari, and Edge. Prefers WebGL 2 and automatically falls back to WebGL 1 on older hardware.
How the Smoke Simulation Works
This smoke simulation solves a simplified version of the Navier-Stokes equations entirely on your GPU using WebGL shaders. A source at the base continuously injects dye and an upward buoyancy force, so the smoke rises, billows, and curls on its own. Dragging across the canvas adds extra velocity, letting you push and shape the plume in real time.
Each frame the solver steps through advection, pressure projection via Jacobi iteration, and vorticity confinement. The vorticity step (the Curl control) reintroduces the small-scale swirling detail that makes smoke look turbulent and alive, rather than a smooth, lifeless blob.
Two dissipation parameters shape the look. Density dissipation controls how quickly the smoke fades — raise it for thin, wispy trails or lower it for thick, lingering clouds. Velocity dissipation governs how long the motion persists, so lower values let the plume drift farther before settling.
The simulation prefers WebGL 2 for native half-float textures but gracefully falls back to WebGL 1 with the OES_texture_half_float extension. That means it runs on virtually every modern browser on desktop and mobile — no plugins, no installs, and no data leaves your device.
Frequently Asked Questions
Related Simulations
Explore more real-time, GPU-powered simulations that run in your browser