Dither Wave
dither-wave-tw
Customize
1
2
4
0.6
1
Props
| Name | Type | Default | Description |
|---|---|---|---|
| width | number | string | "100%" | Width of the component in pixels or CSS value |
| height | number | string | "100%" | Height of the component in pixels or CSS value |
| speed | number | 1.0 | Animation speed multiplier |
| intensity | number | 1.0 | Wave intensity/amplitude |
| scale | number | 6.0 | Scale of the wave pattern (higher = larger waves) |
| downScale | number | 0.5 | Downscale factor for dithering pattern (higher = coarser) |
| primaryColor | string | "#5227FF" | Primary color in the gradient |
| secondaryColor | string | "#5227FF" | Secondary color in the gradient |
| tertiaryColor | string | "#0a0a0a" | Tertiary color in the gradient |
| opacity | number | 1.0 | Overall opacity (0-1) |
| quality | "low" | "medium" | "high" | "medium" | Quality preset for performance/visual tradeoff |
| maxFPS | number | 60 | Maximum frames per second cap |
| pauseWhenOffscreen | boolean | true | Pause rendering when component is off-screen |
| className | string | "" | Additional CSS classes |
| children | React.ReactNode | undefined | Content to render on top of the effect |