Droppy — Liquid Diffusion & Coffee Ring Physics Simulator
A physics simulator where liquid drops fall, spread, and dry into coffee rings on a canvas. Real-time simulation of capillary absorption, surface tension, and paper-fiber irregularity via Perlin noise.
Tap or click the canvas to drop liquid onto paper. Watch it spread, absorb, and dry into a coffee ring — all driven by real-time physics.
Features
- 4-stage physics — Collision spread → capillary absorption → surface tension → coffee-ring drying
- 180-node polar boundary — Smooth droplet shape computed in real time
- 2D Perlin noise — Simulates uneven water absorption across paper fibers
- Auto drip — Drops fall every 1.5 s with random color, size, and volume
- Random drop — Parameters shift every 2 s; tap repeatedly at any time
- Tile mode — Generates seamless tile textures from the canvas
- PNG export — Save the current canvas as an image
Physics Parameters
| Parameter | Description |
|---|---|
| Drop diameter | Initial size at impact (3–100 px) |
| Volume | Depth of capillary spread |
| Surface tension | Force pulling shape back to circular |
| Viscosity | Friction brake on flow |
| Capillary pull | Force drawing liquid inward from the boundary |
| Impact force | Initial spread strength right after landing |
| Fiber roughness | Irregularity of water absorption |
| Solute concentration | Darkness of the dried outer ring |
| Drying speed | Evaporation rate |
Color Palettes
| Tab | Contents |
|---|---|
| ① Ink | 24 curated colors inspired by inks, watercolors, and dyes (6×4 grid) |
| ② HSL | 12 hues × 3 lightness levels (deep / mid / light) + 6 grays = 42 colors (6×7 grid) |
Other Settings
- Paper type — Choose background from drawing paper, kraft paper, or notebook white
- Background image — Load any image behind the canvas (cover / fit / drag to reposition)
- Profile save — Store physics parameters and colors in localStorage; share via JSON export / import