2D Fluid Simulator

Drag on the canvas with your finger or mouse to draw gray walls. Water (or wind) constantly flows in from the left edge, so placing a wall splits the flow and creates vortices behind it. Try round versus angular walls and see how the vortices change.

Brighter areas mean faster flow, while dark areas are stagnant. Places with strong vorticity (curl), that is where the flow is rotating, are shown in different colors (green and purple in water mode, orange and light blue in wind mode), and the color indicates the direction of rotation. You can also view Speed or Vorticity alone with the view switch.

Place a single small round wall toward the left of the screen, raise the inflow speed a little, and lower the viscosity. A pattern of alternating vortices, like a Karman vortex street, will appear behind the wall. Wind mode keeps the vortices tighter and easier to observe.

It uses Jos Stam's Stable Fluids method: the screen is divided into a 96×96 grid, and the advection and diffusion of the velocity field plus a pressure correction (projection) are computed every frame. Everything is computed in plain JavaScript with no external libraries.

No. All simulation and rendering runs entirely within your browser. The obstacle shapes you draw and your interactions are never sent to or stored on any server.

Water mode uses a higher viscosity setting with a blue color scheme, while wind mode uses a lower viscosity setting with white and gray tones. Higher viscosity makes the flow smoother and calmer; lower viscosity produces finer, more turbulent vortices. You can also adjust the viscosity individually with the slider.

Switching the display to Speed only, raising the viscosity a little, or closing other tabs and apps may make it lighter. You can also stop the computation with the Pause button. On smartphones in power-saving mode it may run slower.