BeforeAfter Reveal

Interactive Before/After Comparison

Create stunning side-by-side image comparisons with a draggable slider that reveals transformations in real time. Perfect for UI redesigns, photo editing, branding projects, renovations, and portfolio showcases.

Features

• Horizontal & vertical comparison modes

• Smooth draggable divider interaction

• Custom divider color, width & shadow

• Optional animated circular handle

• Adjustable initial slider position

• Multiple cursor interaction styles

• Smooth follow animation support

• Fully responsive on all screen sizes

• Click anywhere to reposition divider

• Double-click to reset position

• Easy image upload via Framer properties

• No coding required

Perfect For

• UI/UX case studies

• Photo retouching showcases

• Brand redesign presentations

• Before/after transformations

• Product comparisons

• Portfolio websites

• Creative agencies & freelancers

Customization

Easily customize every visual element directly inside Framer, including images, orientation, divider styles, handle appearance, cursor behavior, and animations to match your brand perfectly.