Blur Reveal

A text component that reveals its content with a smooth blur-to-focus animation, activated by default when the text enters the viewport.

Library

Badtz UI

Framework

React

Type

ui

License

MIT

Dependencies

clsx, motion, tailwind-merge

Install

npx shadcn@latest add https://badtz-ui.com/r/blur-reveal.json

Files

• registry/new-york-v4/ui/blur-reveal.tsx
• lib/utils.ts

Source

https://github.com/badtzx0/badtz-ui

Categories

• Animated Text Components
• React Animated Text Components
• Tailwind CSS Animated Text Components
• Text Components
• React Text Components
• Tailwind CSS Text Components
• Animated Text Components

More from Badtz UI

• Fade Up Word
• Stagger Blur Effect
• 3D Wrapper
• Animated Card 1
• Animated Card 2
• Animated Card 3
• Animated Keyboard
• Animated List
• Border Beam
• Button
• Cloud Orbit
• Confetti Button