Watter ripple effect

water ripple distortion effect

Turn any image into an interactive water surface. As visitors move their cursor, the image distorts with realistic ripple waves — creating a memorable, immersive experience without writing a single line of code.

Just drop the component in, pick your image, and customize.

What you can control: → Image — use Framer's native image picker → Fit Mode — Cover, Contain, or Fill, just like a regular image → Ripple Size — how wide each splash spreads → Ripple Strength — how intense the distortion feels → Damping — how quickly ripples fade out → Refraction — how much the image bends under the waves

Works great for hero sections, portfolio showcases, photography sites, agency landing pages, or anywhere you want to add a layer of interactivity to your visuals.