ImageZoom

ImageZoom turns any image in Framer into an interactive zoomable preview. Visitors can hover to gently scale the image, click to open a full-screen modal, and optionally click inside the modal to zoom in further with a lens-style control. It is designed for showing product details, artwork, screenshots, photography, interiors, case study visuals, and any image that benefits from closer inspection.

Features

Upload any image and set custom alt text. The preview image fills its frame with object-cover behavior and supports configurable border radius, default shadow, hover shadow, hover scale, and optional hover overlay. Clicking the image opens a centered modal with a customizable backdrop, modal background, modal radius, and close button. Modal zoom can be enabled or disabled. When enabled, the viewer tracks the pointer over the rendered image, shows a circular zoom icon, and lets visitors toggle between normal view and zoomed-in view. Zoom amount, lens icon size, lens border, icon color, and icon background are all editable. The modal locks page scrolling while open, restores focus when closed, supports Escape-to-close, and closes when the backdrop is clicked. Motion transitions are disabled in static rendering and respect the component’s animation logic.

How to use

Add ImageZoom to your Framer canvas and choose an image in the property panel. Set the alt text, corner radius, hover zoom amount, shadows, and optional hover overlay. Customize the modal backdrop, modal card, close button, and lens zoom settings. Resize the component freely; the image will fill the available frame and keep the zoom interaction intact.

Ideal for

Product detail images, ecommerce cards, portfolio galleries, photography pages, case studies, UI screenshots, artwork previews, architecture visuals, real estate images, feature sections, blog visuals, and any Framer site that needs a clean interactive image preview without a full gallery system.

Refund Policy

This is a digital product with instant access. All sales are final once the files or download link have been delivered, except where required by law. Refunds are not offered for change of mind, accidental purchases, lack of Framer experience, failure to read the description, third-party compatibility issues, or changes made after purchase. If the component has a reproducible technical defect caused by the original product, contact me within 7 days with your order email and evidence of the issue. I will first try to fix or replace the file. A refund may only be considered if the issue cannot be resolved. Your statutory rights are not affected.