HoverImageReveal

Show Preview
HoverImageReveal

About HoverImageReveal

Hover Image Reveal is a premium, interactive Framer component designed to add an engaging layer of discovery to your website. By tracking the user's cursor with smooth, physics-based motion, it acts like a digital flashlight, gracefully uncovering hidden images, textures, or hand-drawn illustrations beneath your main content. It transforms static web pages into memorable, tactile experiences that encourage visitors to explore every inch of your site.

Key Features

  • Fluid Physics: Powered by Framer Motion, the reveal effect follows the cursor with a natural, spring-loaded trailing motion that feels buttery smooth and premium.

  • Total Customization: Easily adjust the mask radius, edge softness, and background colors directly from the Framer properties panel. Create anything from a sharp, focused beam to a soft, ambient glow in seconds.

  • Advanced Blend Modes: Seamlessly integrate your hidden layers with your site's overall aesthetic using native CSS blend modes like Multiply, Screen, Lighten, and Overlay.

  • Responsive and Smart: Automatically disables the cursor-tracking effect in the Framer canvas so it doesn't distract you while designing, while performing perfectly on the published site.

  • Plug-and-Play Setup: No code required. Simply drop the component onto your canvas, set it to fill your section, upload your desired image, and you are ready to go.

Perfect For

Creative Portfolios: Reveal behind-the-scenes wireframes, hand-drawn sketches, or vibrant gradients as users hover over your case studies.

Interactive Storytelling: Create immersive, narrative-driven landing pages that reward users for exploring the screen with their mouse.

Teaser Campaigns: Hide upcoming product shots, easter eggs, or secret announcements in the dark, turning your website into an interactive game of discovery.