Show transformations, don't just tell them. A smooth, draggable before-and-after comparison slider built for Framer - perfect for renovations, design case studies, photo edits, fitness transformations, or product upgrades.
Features
Horizontal or vertical drag - pick the orientation that fits your layout, switchable with one click
Full-bleed image compare - drop in any two images and let visitors scrub between them with mouse or touch
Custom labels - add "Before/After" text (or anything else) with independent color controls for each pill, so they match your brand
Typography control - set font, weight, size, and line height right from the Framer panel, no code
Auto-fading labels - labels gracefully fade out as the handle approaches their edge, keeping the UI clean
Buttery-smooth interaction - direct DOM updates during drag mean zero flicker and zero lag, even on large images
Touch-optimized - built-in scroll-locking while dragging, so it works cleanly on mobile
Show transformations, don't just tell them. A smooth, draggable before-and-after comparison slider built for Framer - perfect for renovations, design case studies, photo edits, fitness transformations, or product upgrades.
Features
Horizontal or vertical drag - pick the orientation that fits your layout, switchable with one click
Full-bleed image compare - drop in any two images and let visitors scrub between them with mouse or touch
Custom labels - add "Before/After" text (or anything else) with independent color controls for each pill, so they match your brand
Typography control - set font, weight, size, and line height right from the Framer panel, no code
Auto-fading labels - labels gracefully fade out as the handle approaches their edge, keeping the UI clean
Buttery-smooth interaction - direct DOM updates during drag mean zero flicker and zero lag, even on large images
Touch-optimized - built-in scroll-locking while dragging, so it works cleanly on mobile
