Voronoi
An animated cellular pattern with soft edges, colored cells, gaps, and glow.
Customize
Steps Per Color
3
Distortion
0.4
Gap
0.04
Glow
0
Speed
0.5
Scale
0.5
Rotation
0
API reference
The wrapper adds playback and runtime safeguards while preserving the
complete Paper Voronoi API. This includes its cell, gap, glow, color, motion,
sizing, pixel-ratio, and styling props. See the
Paper Voronoi reference for the full
prop table and accepted ranges.
| Prop | Type | Default | Description |
|---|---|---|---|
playback | "auto" | "always" | "paused" | "auto" | Controls motion policy. Auto pauses for reduced motion and while the shader is outside the viewport. |
colors | string[] | ["#ff8247", "#ffe53d"] | Supplies up to five cell colors. The wrapper provides a warm curated palette when omitted. |
colorGlow | string | "#ffffff" | Sets the cell glow color. |
colorGap | string | "#2e0000" | Sets the color of the gaps between cells. |
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. vivid-layer supplies the React adapter, playback policy, documentation, and Registry packaging; it does not vendor or modify Paper's shader source.