Components
Image reveal
Images revealed through a liquid, wobbling mask — growing from the center on scroll, or as a lens that follows the pointer.
Paste it into ChatGPT, Claude, Cursor or v0.
Usage
import { ImageReveal } from '@vizzele/react';
<ImageReveal src="/hero.jpg" alt="Neon city at night" mode="hover" radius={130} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
src / alt | string | — | Image and its description (required). |
mode | 'view' | 'hover' | 'view' | Grow on scroll, or a pointer lens over a monochrome base. |
radius | number | 120 | Lens radius (hover). |
liquidity | number | 1 | Edge wobble. |
Accessibility
- role="img" with your alt text. Reduced motion: the image appears without the wobble.