Ripple Image Slider is a premium WebGL-powered image slider and carousel for Framer that transforms your image gallery into an immersive, fluid experience. Unlike ordinary carousels or basic image sliders, Ripple brings your slides to life with a real-time water ripple and liquify effect that reacts to your cursor — making every interaction feel alive.
Slide transitions use a radial ripple wave shader that expands outward from the center of the image gallery, blending between slides with a customizable wave frequency, power, and crossfade curve. Whether you trigger transitions by click, scroll wheel, or swipe gesture, the animation feels cinematic and polished — on both desktop and mobile.
Perfect for: Portfolios, agency websites, product showcases, landing pages, and any project that needs a standout hero image slider or fullscreen carousel that stops visitors from scrolling past.
Key Features:
Real-time WebGL liquid slider and fluid cursor distortion
Heightfield water physics — true ripple simulation, not a CSS trick
Cinematic radial wave transitions between gallery slides
Click, scroll wheel, and swipe gesture support
Per-slide CORS image fallback with smooth crossfade
Character-by-character animated text reveal on each slide
Fully customizable fonts, colors, counters, and hint overlays
Works as a fullscreen hero slider or embedded image carousel
SSR-safe with static renderer support
Clean WebGL resource cleanup on unmount — no GPU memory leaks
Munzir Kareem
