Dithered Waves
A mesmerizing WebGL wave animation with retro dithering. Fully customizable pixel size, color palette, distortion, and motion for stylish, dynamic backgrounds.
Make it with Workshop
Build your own component with AI
A mesmerizing WebGL wave animation with retro dithering. Fully customizable pixel size, color palette, distortion, and motion for stylish, dynamic backgrounds.
Make it with Workshop
Build your own component with AI
Bring a modern digital aesthetic to your website with a living, animated wave shader that blends organic motion with retro dither art. It’s perfect for hero sections, landing pages, tech visuals, or anywhere you want motion to feel intentional and futuristic.
The animation loops smoothly and reacts to the mouse with subtle distortions that feel alive. On mobile, it switches to a performance-safe motion mode for flawless visuals without lag.
Instantly gives sites a high-end, cyber-aesthetic motion layer
Works as a full background, hero backdrop, or ambient section texture
Drives attention without overpowering content
Requires zero setup — drop it in and publish
Wave controls — speed, direction, frequency, amplitude, and color
Pixel style — pixel size and palette depth for retro or modern looks
Interaction — enable/disable hover distortion and tune radius + strength
Distortion — optional organic deformation with adjustable intensity
Drop the component anywhere in your canvas
Resize it to fill your hero/section
Adjust colors + pixel density to match your brand
Publish — your site now has cinematic motion.
After pasting the component on the canvas, the component will work perfectly on playing, but it may appear heavily pixelated when sitting idle on the canvas. To fix this, just restart your project.
Copy the URL and paste it into your Framer project to import it.
