Interactive hover/drag mask effect to reveal layered content or images. Customizable direction, speed, shape, and smooth animations.
Made with Workshop
Build your own component with AI
Add an interactive reveal effect to your designs with this polished mask component. Display two layers—front and back—and smoothly transition between them on hover or drag.
Features
Layered content: front and back images or content
Multiple reveal styles: left, right, top, or bottom directions
Mask options: rectangle or circle wipe
Custom controls: reveal speed, easing, padding, border radius, background
Interactive modes: hover or drag gestures
Polished design: smooth transitions, soft edges, premium feel
Perfect for Before vs. After, portfolios, galleries, product reveals, and hover-driven storytelling.