Image Comparator

✨ Image Comparator — A fully-featured before/after slider for Framer.

✨ 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.

Compare images with 5 interaction modes.