Smart Lens Cursor: Free Interactions Component by Muhmad Haj Hmdo

Transform browsing into a unique visual adventure! A smart lens that follows your cursor with realistic physics, auto-zooms based on content type, and features full accessibility & keyboard navigation. Perfect for portfolios and e-commerce sites.

Ultimate Smart Lens Cursor for Framer

Transform your website into a unique interactive experience with an intelligent magnifying lens that follows your mouse with smooth physics-based animations.

Key Features:

Smart Zoom: Auto-adjusting zoom levels for text (2.5x), images (1.5x), and default elements
Glassmorphism Design: Modern glass effect with backdrop blur and gradient borders
Realistic Physics: Fully customizable spring-based movement (damping & stiffness)
Contextual Tooltips: Instant info about elements (word count, image dimensions, etc.)
Keyboard Mode: Full arrow key control + Enter to interact + Escape to exit
Accessibility First: Respects Reduced Motion, screen reader compatible
Deep Customization: Colors, sizes, opacity, and custom cursor images

Perfect For:

Creative portfolio websites
E-commerce product details
Documentation sites (reading small text)
Interactive presentations

Customizable Properties:

Lens size (20px - 300px)
Zoom levels per content type
Glass opacity (0-1)
Crosshair color & opacity
Spring physics configuration
Toggle tooltips & animations

Accessibility Standards:

WCAG 2.1 AA compliant
Full keyboard navigation
Respects prefers-reduced-motion
Screen reader compatible

History:

Version 1.1 - New Features

Added fullscreen preview mode with customizable hint text and colors. Click the lens to enter fullscreen for detailed inspection. Perfect for showcasing product details and design work.