Water
An animated water distortion filter with layered ripples, highlights, and caustics.
Customize
Highlights
0.07
Layering
0.5
Edges
0.8
Waves
0.3
Caustic
0.1
Size
1
Speed
1
Scale
0.8
API reference
The wrapper adds playback and runtime safeguards while preserving the
complete Paper Water API. See the
Paper Water reference for the full prop
table and accepted ranges.
| Prop | Type | Default | Description |
|---|---|---|---|
image | string | HTMLImageElement | undefined | Optionally supplies the image distorted by the water effect. |
playback | "auto" | "always" | "paused" | "auto" | Controls motion policy. Auto pauses for reduced motion and while the shader is outside the viewport. |
width / height | number | string | "100%" | Sets the canvas CSS dimensions. Size the parent element to establish the visible area. |
maxPixelCount | number | 2073600 | Caps the rendered pixel budget. Override only after measuring the target devices. |
Credits
The rendering engine is Paper Shaders, distributed under the Apache License 2.0. The example image is Scott Webb's Banff landscape, released under CC0. vivid-layer supplies the adapter, playback and loading policies, documentation, and Registry packaging.
