Text Reveal Card
Mousemove effect to reveal text content at the bottom of the card.
Sometimes, you just need to see it.
This is a text reveal card. Hover over the card to reveal the hidden text.
I know the chemistry
You know the business
Installation
Run the following command
npx shadcn@latest add @aceternity/text-reveal-cardProps
| Prop name | Type | Description |
|---|---|---|
className | string | The class name of the TextReveal component. |
text | string | Piece of text that stays on the card |
revealText | string | Text that reveals when hovered over the card |
children | React Node | Title and Descriptions for the Card |
Build websites faster and 10x better than your competitors with
Aceternity UI Pro
Next.js 15, Tailwind CSS v4 and Motion for react powered templates
200+ templates and blocks combined
Ready to copy paste component blocks, save days of development time
