The largest & most creative library of animated React components.
Stand out with 130+ free, customizable animations for text, backgrounds, and UI.
📖 Documentation · ⚡ Quick Start · 🛠️ Tools
✨ Why React Bits?
React Bits helps you ship stunning interfaces faster. Instead of spending hours crafting animations from scratch, grab a polished component and customize it to fit your vision.
💬 Text Animations · 🌀 Animations · 🧩 Components · 🖼️ Backgrounds
🚀 Features
- 130+ components — text animations, UI elements, and backgrounds, growing weekly
- Minimal dependencies — lightweight and tree-shakeable
- Fully customizable — tweak everything via props or edit the source directly
- 4 variants per component — JS-CSS, JS-TW, TS-CSS, TS-TW (everyone's happy)
- Copy-paste ready — works with any modern React project
🛠️ Creative Tools
Beyond components, React Bits offers free creative tools to supercharge your workflow:
| Tool | What it does |
|---|---|
| Background Studio | Explore animated backgrounds, customize effects, export as video/image/code |
| Shape Magic | Create inner rounded corners between shapes, export as SVG, React code or clip-path code |
| Texture Lab | Apply 20+ effects (noise, dithering, ASCII) to images/videos and export in high quality |
📦 Installation
React Bits supports shadcn and jsrepo for quick CLI installs.
# Example: Add a component via shadcn
npx shadcn@latest add @react-bits/BlurText-TS-TWEach component page includes copy-ready CLI commands. See the installation guide for full details.
You can also select your preferred technologies, and copy the code manually.
🚀 Sponsors
React Bits is proudly supported by these amazing sponsors:
Diamond
Platinum
Silver
Become a sponsor — Get your brand in front of 500K+ developers monthly.
🤝 Contributing
We'd love your help! Check the open issues or submit ideas via the feature request template.
Please read the contribution guide first — thanks for making React Bits better!
🙌 Contributors
👤 Maintainer
David Haz — creator & lead maintainer
🌐 Official Ports
| Framework | Link |
|---|---|
| Vue.js | vue-bits.dev |
| Svelte | sveltebits.xyz |
📊 Stats
🗳️ Credit
React Bits occasionally draws inspiration from publicly available code examples. These are rewritten as full-fledged, customizable components for JS, TS, CSS, and Tailwind. If you recognize your work, open an issue to request credit.
📄 License
MIT + Commons Clause — free for personal and commercial use.