Beforely

Beforely is a before and after slider for Framer. Pick two images in the properties panel and visitors drag the handle to compare them.

Four ways to move the handle: drag, hover, click to switch sides, or an automatic sweep that pauses while a visitor uses it.

• Left and right or top and bottom, and where the handle starts

• An effect on the before side: black and white, sepia, blur, faded or darker

• Circle, square, pill, arrows-only or line-only handle, with color, line width and knob size

• Labels with your own text, font, colors and position, shown always, on hover or never

• Corner radius and image fit

Fast and accessible: the handle is a real slider for keyboards and screen readers, and visitors who ask for reduced motion get no automatic movement.

After you buy you get the component URL to paste into your project, plus the source file. One payment covers all your projects and client sites. Questions: feedback@appholdings.org