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