Opinionated and flexible React components, styled with TailwindCSS, built for Next.js SaaS applications.
Chalk UI is a collection of React components built for SaaS applications. It was created to merge the best parts of multiple UI libraries into a single package. It combines the developer experience of shadcn/ui, primitives of Radix UI, higher order components of Saas UI, charts of Tremor, and more.
Chalk UI components are opinionated, meaning most components are built with a specific use case in mind. However, they are also flexible enough to be customized to suit your needs.
Most components are built around primitives from multiple libraries, such as Radix UI, Zag.js, Recharts, and more. Chalk UI adds a layer of abstraction to provide a consistent design language and API.
- Broad range of components tailored for SaaS applications
- Higher-level API for Radix UI primitives
- Consistent design language and API
- Usage of battle-tested libraries
- Customizable with TailwindCSS
- 100% TypeScript
Features | Chalk UI | Shadcn UI | Radix UI | Saas UI |
---|---|---|---|---|
Tailwind support | ✅ | ✅ | ✅ | ❌ |
Pre-styled components | ✅ | ✅ | ✅ | ✅ |
Customizable | ✅ | ✅ | ✅ | ✅ |
Vanilla JS option | ✅ | ✅ | ✅ | |
Higher order components | ✅ | ❌ | ❌ | ✅ |
Charts, CurrencyInput, PhoneInput, AddressInput | ✅ | ❌ | ❌ | ❌ |
Fully-featured Form API | ✅ | ✅ | ✅ | |
Fully-featured DataGrid | ✅ | ❌ | ✅ | |
CLI | ✅ | ✅ | ❌ | ❌ |
Completely Open Source | Yes | Yes | Yes | No |
Components | 50+ | 46 | 28 | 60+ |
- ✅ = First-class support with no extra work
⚠️ = Requires some extra work- ❌ = Not officially supported or documented
The documentation is available at chalk.rahim.app.
Chalk UI is inspired by the following projects:
- RadixUI
- TailwindCSS
- Lucide Icons
- Zag.js
- zod
- React Hook Form
- react-phone-number-input
- react-currency-input-field
- react-dropzone
- react-day-picker
- class-variance-authority
- tailwind-merge
- tailwindcss-animate
- And many more...
This project is licensed under the MIT License - see the LICENSE file for details.