Before After Slider
The Before After Slider is a useful visual comparison component designed for creators, marketers, and designers who want to highlight transformations with elegance and control.
Whether you're comparing skin treatments, UI redesigns, home renovations, or photo edits, this component offers:
Image Input Controls for uploading both before and after visuals
Initial Slider Position setting to control the starting reveal
Draggable Handle with your choice of icons: arrows or chevrons
Customizable Icon Container — choose between round, square, or your own radius
Full styling options for icon color, padding, background, and component corner radius
Built-in fallback text if images aren't provided
Designed with flexibility in mind, this component is fully responsive, intuitive to use, and easy to integrate into any Framer project.
