MagnifyingGlass

About

Magnifying Glass brings a sleek, interactive zoom effect to your Framer projects, making it easier than ever for visitors to inspect the finer details of your work. Whether you are showcasing high-resolution photography or intricate product shots, this component adds a layer of professional polish and engagement to any layout. Just drop it in and let your users explore your content with a smooth, responsive lens.

What it does

This component creates a dynamic magnifying lens that follows the user's cursor across images or videos. It renders a high-quality zoomed view in real-time, allowing for precise inspection without needing to open a separate gallery. It handles media transitions smoothly and includes built-in styling for borders and shadows to ensure the lens stands out clearly against your background.

What you can customize

• Media settings: Easily switch between Image and Video modes depending on what you want to highlight.

• Lens controls: Use the sliders to dial in the perfect Lens Size and Zoom Level for your specific content.

• Visual styling: Adjust the Border Width and pick any Border Color to match your brand. You can also toggle the Shadow on or off to add depth.

• Interface options: Choose to show or hide Overlay Text, and decide if the component should act as a clickable Link or remain a purely visual tool.

Great for

• E-commerce product detail pages

• Photography and design portfolios

• Technical diagrams or complex maps

• Interactive landing pages

• Showcasing high-quality textures and materials

Share your build

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.

Need help?

Questions or feedback? Reach me anytime: dulajdilshan766@gmail.com or on X @Dulajweb