Layerwave adds production-ready realtime WebGL effects to your Framer site — interactive distortion and refraction that normally need shaders development.
Browse the effect gallery, preview it live, pick an art-directed preset, and click Add to Canvas. The component is installed into your project automatically — you never paste code or copy a URL. Every parameter stays editable from Framer's property panel afterwards.
Included • Liquid Media — an image or video deformed by cursor movement, with velocity-driven flow, chromatic aberration and idle motion. 6 presets. • Glass Lens — a refractive glass surface with shaped silhouettes, dispersion, frost, contour and highlights. 5 presets.
Built for production • Pauses when off-screen or when the tab is hidden • Lazy media loading, capped device pixel ratio, automatic quality tiers • Respects prefers-reduced-motion, with an optional mobile off switch • Full GPU cleanup — no leaks when instances are added and removed
Effects render on the canvas as static media so the editor stays fast; flip Canvas Preview on any instance to art-direct it live. Glass Lens refracts the media you give it. Requires WebGL2.
Try it live here → https://layerwave.netlify.app/
Layerwave adds production-ready realtime WebGL effects to your Framer site — interactive distortion and refraction that normally need shaders development.
Browse the effect gallery, preview it live, pick an art-directed preset, and click Add to Canvas. The component is installed into your project automatically — you never paste code or copy a URL. Every parameter stays editable from Framer's property panel afterwards.
Included • Liquid Media — an image or video deformed by cursor movement, with velocity-driven flow, chromatic aberration and idle motion. 6 presets. • Glass Lens — a refractive glass surface with shaped silhouettes, dispersion, frost, contour and highlights. 5 presets.
Built for production • Pauses when off-screen or when the tab is hidden • Lazy media loading, capped device pixel ratio, automatic quality tiers • Respects prefers-reduced-motion, with an optional mobile off switch • Full GPU cleanup — no leaks when instances are added and removed
Effects render on the canvas as static media so the editor stays fast; flip Canvas Preview on any instance to art-direct it live. Glass Lens refracts the media you give it. Requires WebGL2.
Try it live here → https://layerwave.netlify.app/
