---
title: "Ink Mask Reveal — Framer component · Best of Framer"
description: "$9.00 · Framer component · by Aviral Lakhanpaul · Interactive. Ink Mask Reveal is an interactive reveal component that overlays your content with a solid color or custom image, allowing…"
canonical: "https://framer.elliotli.dev/component/ink-mask-reveal"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/Ink Mask Reveal

# Ink Mask Reveal

Hover ink reveal effect

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

![Ink Mask Reveal preview image 1](https://framer.elliotli.dev/og/component/ink-mask-reveal/ec6ceb6b8becc063/1600x1200.jpg)

## Summary

Ink Mask Reveal is an interactive reveal component that overlays your content with a solid color or custom image, allowing users to gradually "erase" the mask using a realistic…

## Description

**Ink Mask Reveal** is an interactive reveal component that overlays your content with a solid color or custom image, allowing users to gradually "erase" the mask using a realistic ink brush effect.

It can be controlled by **mouse movement, dragging, or taps on touch devices**; every interaction feels fluid, responsive, and satisfying.

Perfect for **hero sections, portfolio reveals, product showcases, image galleries, landing pages, creative websites, and interactive storytelling**.

Inspired by Aayush Duhan's work.

## ⚡ Features

-   Organic ink brush reveal animation
    
-   Reveal content using hover, drag, or tap
    
-   Supports both **solid color** and **image-based** masks
    
-   Natural brush edges with adjustable wobble
    
-   Configurable fade behavior for disappearing brush marks
    
-   Touch-friendly tap-to-reveal support
    
-   Optional cursor hiding for a seamless illusion
    
-   Fully responsive and performance optimized
    
-   Ideal for images, videos, text, and creative layouts
    

## 🖌️ Customisations

### Mask Settings

-   Mask Color
    
-   Optional Mask Image
    

### Brush Controls

-   Brush Size
    
-   Brush Spacing
    
-   Maximum Visible Marks
    

### Animation

-   Fade Time
    
-   Fade Curve (Center, Mid, Edge)
    
-   Organic Edge Smoothness
    
-   Edge Wobble Amount
    
-   Brush Start Radius
    
-   Radius Variation
    
-   Brush Softness
    

### Interaction

-   Enable or Disable Tap-to-Reveal
    
-   Show or Hide Cursor
    

## 🚀 Usage

1.  Place **Ink Mask Reveal** above the content you want to conceal.
    
2.  Choose a **Mask Color** or upload a custom **Mask Image**.
    
3.  Adjust the properties to achieve your preferred reveal style.
    
4.  Preview and watch your content come to life through realistic ink-based interactions.
    

### **After completing your purchase, you will receive a link to the component.**

**Copy the URL and paste it into your Framer project to import it.**

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

-   All · #5087

## Details

- **Author**: Aviral Lakhanpaul
- **Price**: $9.00
- **Published**: 2026-06-26
- **Updated**: 2026-07-02
- **Added**: 2026-06-26
- **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