Add stunning ripple hover effects to your images with this Framer component – smooth, modern, and easy to use.
Make it with Workshop
Build your own component with AI
🖼️ Image Ripple – Framer Component
Bring your images to life with an interactive ripple hover effect designed to add depth, motion, and a modern touch to your Framer projects.
This fully customizable component lets you create fluid, water-like distortion on hover, perfect for portfolios, landing pages, or any project that needs a subtle yet stunning visual interaction.
🔧 Features & Controls
Replaceable Image
Adjustable Ripple Size (Width & Height)
Distortion Strength, Radius & Falloff
Mouse Offset Control
Liquid Line Density
Ripple Strength & Speed
Water Density & Motion Dampening
No code required. Just drag, drop, and tweak!
✅ Perfect For
Hero sections
Product showcases
Creative portfolios
Interactive galleries
💡 How to Use
Drop the component into your Framer canvas, upload your image, and adjust the sliders to fine-tune the effect. It’s that simple.
📦 What’s Included
1 Framer Component (.tsx or drag-and-drop)
Fully responsive and interactive
Easy customization via control panel
🔖 Tags
Framer Component, Ripple Effect, Hover Animation, Interactive Image, UI Animation, Modern Web Design, Template Add-on