Add dynamic, fluid wave borders to images! Customize thickness, intensity, and speed for a modern, animated look. Boost UI engagement effortlessly.
Made with Workshop
Build your own component with AI
Dear Framer Designer,Elevate your Framer designs with WavyBorderShader, a powerful component that transforms static image edges into smooth, fluid, and endlessly looping wave animations. Perfect for adding a modern, subtle kinetic energy to galleries, hero images, and profile elements.
Fluid Wave Animation: Apply a continuous, dynamic wavy border effect to any image component.
Comprehensive Controls: Easily fine-tune the look and feel using intuitive Framer properties:
Thickness & Blur: Control the amplitude of the wave and the softness of the border.
Intensity & Time Scale: Adjust the overall energy and the animation speed.
Phase Offsets & Noise: Introduce unique variations and control the wave timing.
Performance-Optimized: Utilizes GLSL shaders for smooth performance even during complex animations.
Responsive Mode: Toggle Responsive to ensure the wave frequency adapts beautifully to different aspect ratios and screen sizes.
Trigger Options: Set the animation to start In View (when scrolled into sight) or immediately.
Color & Edges: Customize Border and Background colors, and choose whether the effect applies to All Edges or selectively.
Stop using boring, static image containers. Start using motion to captivate your audience and bring your designs to life!