Image Comparator

✨ Image Comparator — A fully-featured before/after slider for Framer. Drop it on your canvas, set your two images, and choose how your users interact with the comparison.

Interaction Modes

5 Interaction Modes available — each built for a different use case:

• Drag — classic slider, follows the cursor or finger

• Hover — reveals on mouse position, no click needed

• Toggle — click to switch between the two images

• Reveal — auto-reveals with a cinematic transition on click or hover

• Scrub — position is driven by the scroll position on the page

Many options

4 Split Directions — Horizontal, Vertical, Diagonal TL→BR, Diagonal BL→TR

7 Reveal Transitions — Fade, Flip Horizontal, Flip Vertical, Zoom, Slide Left, Slide Right, Blur

Auto-play — configurable animation duration, easing (Ease In-Out, Ease Out, Linear, Spring), and pause between cycles

Full visual control — handle shape (Circle, Square, or line only), color, size, line thickness, corner radius, and 5 aspect ratios (16:9, 4:3, 1:1, 3:4, 9:16)

Image labels — optional Before / After captions, individually customizable

Overrides file included — control any prop dynamically from buttons, selects, or sliders on your canvas, with no code required beyond applying the override

Accessible & SSR-safe — keyboard navigable, configurable aria-label, works with Framer's static publish

After your purchase, you will receive a link to the Component URL. Copy it and paste it directly onto your Framer canvas to get started.

Support

Component Support includes:

• Availability of the author to answer questions

• Answering technical questions about item's features

• Assistance with reported bugs and issues

Support response time can be up to 2 business days.

Email address: support@hikariweb.io

Refund Policy

If you're not satisfied with your purchase, you may request a refund within 7 days of purchase by emailing support@hikariweb.io.

Refunds will be processed within 14 days of your refund request.