😎
Installation
Usage
import { ScratchToReveal } from "@/components/magicui/scratch-to-reveal";<ScratchToReveal width={300} height={300} minScratchPercentage={50}>
Scratch To Reveal
</ScratchToReveal>Props
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | - | The class name to apply to the component. |
width | number | - | Width of the scratch container. |
height | number | - | Height of the scratch container. |
minScratchPercentage | number | 50 | Minimum percentage of scratched area to be considered as completed (Value between 0 and 100). |
children | node | - | The content to display in the marquee. |
onComplete | function | - | Callback function called when scratch is completed |
gradientColors | string[] | - | Gradient colors for the scratch effect. |
Credits
- Credit to dipesh_the_dev