Liquid Falls, Spreads, and Dries — Droppy, a Coffee Ring Physics Simulator
You have probably noticed that dried coffee spills leave a dark ring at the edge rather than a uniform stain. That phenomenon — the coffee ring effect — is what Droppy simulates in your browser.
Tap to Start the Physics
Click or tap the canvas and a drop lands, spreads, and dries through four automatic stages:
- Collision spread — the impact launches an instant burst outward
- Capillary absorption — paper fibers slowly pull liquid inward
- Surface tension — a restoring force pulls the boundary back toward circular
- Coffee-ring drying — evaporation pushes solute to the perimeter, leaving a concentrated ring
The boundary shape is computed in real time using 180 polar-coordinate nodes. 2D Perlin noise adds fiber-level irregularity so no two drops look exactly alike.
Auto Drip Mode
Hit ▶ Auto Drip and drops fall every 1.5 seconds with randomized color, size, and volume. Leave it running and the canvas fills up on its own.
🔀 Random Drop mode shifts all parameters every 2 seconds while continuing to drop — or tap anywhere yourself to place drops at specific spots.
Tune the Physics
Open the settings drawer to adjust nine physics parameters with sliders.
- Crank the diameter up and a single drop becomes a spreading puddle
- Lower the surface tension and the shape turns irregular and amoeba-like
- Raise fiber roughness and the result resembles ink bleeding into washi paper
Different combinations evoke completely different materials — ink, watercolor, dye, or lacquer. Save a configuration you like as a profile for later.
Generate Seamless Tile Textures
Enable ⊞ Tile mode and the edges of the canvas connect seamlessly. The result can be exported as a PNG with 🖼 Save image — ready to use as a wallpaper or background texture.