GET STARTED

Make it yours.

Install the components you need. The source lives in your project, ready to change.

Pick what you need

No package of components you’ll never use.

Own the source

Readable React and TypeScript in your repo.

Use your design system

Built on shadcn/ui and your existing tokens.

01. Start with shadcn/ui

The kit uses the Radix version of shadcn/ui, Tailwind CSS and React. Initialize shadcn in your application if you haven’t already.

Initialize shadcn

1pnpm dlx shadcn@latest init --base radix

02. Choose a component

Open any component page and copy your personal installation command. The registry includes its source, package dependencies, and required shadcn primitives. Source and installation are included with the Startup and Business plans.

Browse the component library

03. Match your theme

The components inherit your semantic color tokens. Use your existing theme, or bring the Nextbase pink into your primary color.

globals.css

1:root {
2  --primary: #b91270;
3  --primary-foreground: #ffffff;
4}
5
6.dark {
7  --primary: #ff3ea5;
8  --primary-foreground: #090909;
9}

04. Build your version

Customize the source like any other file in your project. Animated components respect reduced motion, and interactive controls support keyboard navigation.

Try the Shimmer Button