Before and After Image Slider

May 27, 2024

Image Before & After
Image Before & After

The Framer Before and after image slider component allows you to display two images side by side, with the ability to reveal or hide portions of each image through an slider.

To implement the Framer Before and after image slider component, follow these steps:

  1. Drag and drop the "Before and after image slider" component from the component list onto your canvas.

  2. Configure the following properties:

    • Left Image: Upload the image you want to represent the "before" state.

    • Right Image: Upload the image you want to represent the "after" state.

    • Radius: Adjust the border radius of the component.

With these settings, the Framer Before and after image slider component will create an interactive slider that allows your users to transition between the two images, revealing or hide portions of each image as desired.