Chalk UI

Opinionated and flexible React components, styled with TailwindCSS, built for Next.js SaaS applications.

Why?

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.

Features

• 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

Documentation

The documentation is available at chalk.rahim.app.

Credits

Chalk UI is inspired by the following projects:

• shadcn/ui
• Tremor
• Saas UI

Resources

• 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...

License

This project is licensed under the MIT License - see the LICENSE file for details.