What is RareUI?
RareUI is a free, open-source React component library featuring 100+ premium components designed to help you build visually distinctive web applications. Every component is crafted with attention to detail, featuring smooth animations, modern designs, and production-ready TypeScript code. Unlike traditional component libraries that install as a dependency, RareUI components live directly in your codebase. You copy the code, own it, and modify it as you see fit — no version lock-in.RareUI is 100% free and open source under the MIT license. Components are yours once you add them to your project.
Tech stack
RareUI is built on modern, stable technology:| Technology | Version | Role |
|---|---|---|
| React | 19 | Component runtime |
| Next.js | 16 | Application framework |
| Tailwind CSS | 4 | Utility-first styling |
| Framer Motion | 12 | Animations and transitions |
| TypeScript | 5+ | Type safety and IntelliSense |
Key features
Premium designs
Modern, professional aesthetics with a focus on visual impact. Each component is designed to stand out.
Copy-paste ready
No install step, no tree-shaking concerns. Grab the code from the docs and drop it into your project.
Smooth animations
Built-in interactions powered by Framer Motion 12. Animations are performant and respect reduced-motion preferences.
Dark mode native
First-class dark mode support via CSS variables. No extra configuration required.
TypeScript
Every component is fully typed. Enjoy autocomplete and compile-time safety out of the box.
Zero lock-in
Code lives in your project. Modify, extend, or delete any component without touching a dependency.
Philosophy
RareUI is built on three principles:- Developer experience first — Commands are simple, docs are clear, setup is fast.
- Design excellence — Every component should look and feel premium.
- Zero lock-in — You own the code. Modify it without restriction.
Component categories
Buttons
Liquid Button with gooey effect, Glass Shimmer Button, 3D Neumorphism Button, and more premium button variants.
Cards
Particle Card, Premium Profile Card, and interactive card components with eye-catching hover effects.
Forms
Animated inputs, toggle switches, and form components designed to feel as good as they look.
More
New component categories are added regularly. Check the docs to see what’s available.
How is this different from shadcn/ui?
RareUI and shadcn/ui solve different problems. shadcn/ui focuses on accessible primitives and design-system foundations. RareUI focuses on premium designs and complex animations — components that are visually distinctive and ready to impress. They are complementary. Many projects use shadcn/ui for their core UI and RareUI for hero sections, landing pages, and interactive moments.Get started
Ready to build? Follow the Quickstart guide to go from zero to a working component in under 5 minutes.