Kaida Wavy
High-performance WebGL2-based wave animation system with procedural mesh gradients, multi-wave rendering, and post-processing effects. Built with developer experience in mind.
name: calm liquid
speed: 15
frequency: 20
grain: 5
color: #00c6ff
name: soft aurora
speed: 25
frequency: 35
blur: 100
grain: 15
color: #8b5cf6
name: neon cyber
speed: 80
frequency: 70
grain: 40
color: #ff0055
name: deep ocean
speed: 30
frequency: 45
grain: 20
color: #0066ff
sync-waves: false
name: emerald glass
speed: 8
frequency: 60
height: 50
blur: 50
pixels: 35
grain: 0
color: #10b981
name: pixel forest
speed: 20
frequency: 20
height: 25
blur: 20
pixels: 90
grain: 0
color: #84cc16
name: matrix
speed: 35
frequency: 60
height: 30
blur: 8
pixels: 50
grain: 30
color: #00e65c
Most animated backgrounds are painful.
Wavy is different.
Large video files
Performance issues
Static gradients not so cool
Expensive custom WebGL dev
GPU-accelerated WebGL2 rendering
Procedural mesh gradients
Tiny integration surface
Easy customization
Production-ready
Sign up to access more cool tools.
Kaida helps create design systems that power some of the fastest-growing products.