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.

✨ Reveal content with every brush stroke.