The project preview and technical description remain available below. To run the simulation, use a browser and graphics device with WebGPU enabled. Check WebGPU support.
A preview of VibeSand. The simulation uses GPU compute shaders to update sand, water, and lighting.
GPU-Powered Voxel Playground
Performance Tip: Use 'Render Scale' in UI if slow
VibeSand is a WebGPU voxel engine. It simulates millions of particles entirely on your GPU. Watch sand form natural piles, water fill basins and flow over edges, and sculpt the world in real time, all illuminated by dynamic lights.
Things to Try:
Sculpt a stone bowl or pyramid; observe how sand tumbles down slopes and water cascades, lit by the falling lights. Water voxels now have a subtle internal shimmer and appear more luminous.
Create stair-step patterns; watch particles navigate edges, sliding and collecting in corners.
Drop blobs of sand into water; see how particles sift, settle, and displace the water.
Use the "Destroy" tool to punch a hole in the floor beneath water or sand; watch it drain.
Crank up the Sim Steps slider, then use the Water tool to create fast-moving waves.
Experiment with the Max Ray Steps slider (capped at 384) to see how it affects visuals and performance.
Build dams; see how water pressure affects flow when you release it.
Key Features
Dynamic Particles & Lighting: Sand slides and tumbles naturally. Water spreads via a 2-cell pressure check, tumbles over edges, and features an enhanced surface shimmer and internal brightness. The scene is illuminated by a "rain" of dynamic, colorful point lights.
Full GPU Pipeline: Physics, tool targeting, lighting, and rendering all run as GPU shaders for maximum performance.
Instant Voxel Tools: Sculpt with sand, stone, water, or erase. Clear visual previews guide your actions.
Single-Pass Ubershader: A DDA raymarching fragment shader renders everything in one go: voxels, dynamic lighting, procedural sky, tool highlights, and water shimmer.
Controls
Left Click: Use selected tool.
Right Click + Drag: Orbit camera.
Middle Mouse / Space + Left Click + Drag: Pan camera.
Mouse Wheel: Zoom.
Under the Hood
Bit-Packed Voxels: Each voxel's state (type, color variant, physics status, RGB light) is stored in a single u32.
Single-Buffer Physics: Simulation uses one data buffer. An "updated" flag per voxel ensures stability during multi-step physics iterations.
Multi-Pass Compute Architecture:
Targeting: A GPU compute shader raycasts to find the cursor's 3D position. No CPU readback is involved. Its raymarch loop respects the Max Ray Steps.
Physics Simulation: Particle interactions like gravity, sliding, tumbling, and fluid spread are processed in-place on the single buffer.
Tool Application: Voxel data is modified by tools after all physics steps for the frame are complete.
Dynamic Lighting: Light contributions from a configurable number of moving point sources (the "light rain") are calculated and packed into each voxel's u32.
Optimized Ubershader Rendering: The DDA raymarcher, implemented as a single comprehensive fragment shader, renders the scene. It uses a precise ray start bias to prevent visual artifacts, respects the Max Ray Steps, and integrates all visual elements including enhanced water rendering in one pass.
Future Ideas & Roadmap
Reactive Elements: Gunpowder that ignites from fire, with potential for small explosions.
Interactive Light Sources:
Lights attached to dynamic events like Bombs, Blasters, and Meteors.
Option for the mouse cursor/tool to act as a controllable light source.
Performance Enhancements:
Automatic resolution scaling based on target FPS.
Further compute shader optimizations.
Destructive Events: Tools like Bombs, Blasters, and Meteors (beyond just their lighting).
DDA Voxel Renderer. Right-click to orbit, Middle-mouse/Space+Left-click to pan.
About · More by Tront
VibeSand by Tront
VibeSand is a falling-sand simulation running on WebGPU compute shaders: two million voxels, all updating every frame at 60fps. Sand piles, water flows, and the whole grid is stepped on the GPU rather than the CPU.
One page, no install, needs a desktop browser with WebGPU. Built by Tront (Trent Sterling) as one of a run of small GPU experiments that led to the larger crowd and physics projects.
More from Tront
VibeWater: 2D water compute shader with 3D vertex displacement, a WebGPU demo.
VibeDuders: 100,000 duders on the GPU: boids movement, active enemies, all attackable.
BALLPIT: GPU contact physics testbed: 20,000 XPBD particles in WebGPU compute with solid map collision.