Product Image Zoom brings a professional and interactive viewing experience to your Framer projects. It allows you to add high quality magnification to any image, making it perfect for online stores or portfolios where detail is everything. You can drop it into a product page or a gallery and let your visitors explore your work with smooth, fluid animations.
This component creates a magnifying lens effect that follows the cursor, allowing users to see close up details of your images. It handles zoom levels and speeds effortlessly, offers multiple lens shapes, and includes a built in lightbox for a full screen experience. You can also place interactive hotspots on the image to highlight specific features or provide extra context when a user interacts with them.
Zoom and Lens: Set your preferred zoom level and motion speed. Choose between a circle or square lens, adjust the lens size, and decide whether to show or hide the magnifying effect.
Interaction and Links: Enable or disable the lightbox and "click to open" features. You can also turn the image into a functional link with a custom URL and choose whether it opens in a new browser tab.
Hotspots and Styling: Manage a list of interactive points with custom colors and sizes. Switch between light and dark themes, adjust the overlay opacity, and fine tune the border radius and background colors to perfectly match your site design.
Online store product pages
Photography and digital art portfolios
Technical diagrams and blueprints
Fashion lookbooks and catalogs
Detailed maps or infographics
If you ship something cool with it, post it on X and tag me @Dulajweb , or send it over. I’d love to see what you create.
Questions or feedback? Reach me anytime: dulajdilshan766@gmail.com or on X @Dulajweb
Dulaj dilshan
