Sloshing water drawn in ASCII characters
| Name | Type | Default | Description |
|---|---|---|---|
width | string | number | "100%" | Container width |
height | string | number | "100%" | Container height |
className | string | "" | Additional CSS classes for styling |
children | ReactNode | undefined | Content rendered above the effect |
speed | number | 0.9 | Simulation timestep multiplier (0.1–3) |
cellSize | number | 15 | Character cell size in pixels (6–30) |
gravity | number | -25 | Gravity strength (negative = downward, 0 = zero-g) (-50–0) |
flipRatio | number | 0.3 | FLIP vs PIC blending ratio (0=PIC, 1=FLIP) |
pressureIters | number | 30 | Number of pressure solver iterations (5–80) |
separationIters | number | 3 | Number of particle separation passes (1–10) |
overRelaxation | number | 1.5 | Over-relaxation factor for pressure solve (1–2) |
fillHeight | number | 0.4 | Fill fraction of the tank (0–1) |
cursorRadius | number | 0.25 | Radius of mouse influence as fraction of short side (0–0.5) |
cursorForce | number | 66 | Strength of cursor push force (0–200) |
characters | string | " ·:-~=+*#%@" | Characters ordered by visual weight (light to heavy) |
color | string | "#ffffff" | Text color (hex) |
backgroundColor | string | "#000000" | Background color (hex) |
fontFamily | string | "monospace" | Font family for rendering |
opacity | number | 1 | Master opacity (0–1) |
autoWave | boolean | true | Auto-animate waves when cursor is idle |
widthstring | numberContainer width
"100%"heightstring | numberContainer height
"100%"classNamestringAdditional CSS classes for styling
""childrenReactNodeContent rendered above the effect
undefinedspeednumberSimulation timestep multiplier (0.1–3)
0.9cellSizenumberCharacter cell size in pixels (6–30)
15gravitynumberGravity strength (negative = downward, 0 = zero-g) (-50–0)
-25flipRationumberFLIP vs PIC blending ratio (0=PIC, 1=FLIP)
0.3pressureItersnumberNumber of pressure solver iterations (5–80)
30separationItersnumberNumber of particle separation passes (1–10)
3overRelaxationnumberOver-relaxation factor for pressure solve (1–2)
1.5fillHeightnumberFill fraction of the tank (0–1)
0.4cursorRadiusnumberRadius of mouse influence as fraction of short side (0–0.5)
0.25cursorForcenumberStrength of cursor push force (0–200)
66charactersstringCharacters ordered by visual weight (light to heavy)
" ·:-~=+*#%@"colorstringText color (hex)
"#ffffff"backgroundColorstringBackground color (hex)
"#000000"fontFamilystringFont family for rendering
"monospace"opacitynumberMaster opacity (0–1)
1autoWavebooleanAuto-animate waves when cursor is idle
true