---
title: "HoverImageReveal — Free Framer component · Best of Framer"
description: "Free Framer component · by Rabyaan Khan · Interactive. Smooth cursor-driven image reveal."
canonical: "https://framer.elliotli.dev/component/hoverimagereveal"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/HoverImageReveal

# HoverImageReveal

Smooth cursor-driven image reveal.

[View on Framer](https://framer.com/marketplace/components/hoverimagereveal/?via=elliot-li)

![HoverImageReveal preview image 1](https://framer.elliotli.dev/og/component/hoverimagereveal/e8e1ad32a7d9e69f/1600x1200.jpg)

## Summary

Smooth cursor-driven image reveal.

## Description

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.

## Rank history [How rankings work →](/terms#rankings)

-   All · #3537

## Details

- **Author**: Rabyaan Khan
- **Published**: 2026-03-13
- **Updated**: 2026-03-14
- **Added**: 2026-03-08
- **Categories**: Interactive

## More like this

-   [Velvet Curtain](/component/velvet-curtain) — Sarthak Prakash · $12 — Cinematic curtain reveal effect
-   [Image-Compare Slider](/component/image-compare-slider) — Studio Digital · Free — Reveal what changed, beautifully
-   [Lesson Packages](/component/lesson-packages) — Shelfless Studio · $9 — Lesson bundles with savings shown
-   [Deskbell AI Chatbot](/component/deskbell-ai-chatbot) — NS. Studio · Free — AI site chat, works with Chatbase