Next

Create project

Start by creating a new Next.js project:

npx create-next-app@latest

Add tailwindcss

Configure Tailwind CSS: Setup Tailwind CSS

Setup

Run the init command to setup uilabs in your project:

npx uilabs-cli init

npx uilabs-cli init -d

Configuration

You will be asked a few questions to configure uilabs.config.json:

? Would you like to use TypeScript? › no / yes (default)
? Configure the import alias for components: › @/components
? Would you like to install @uilabs/utils package? › no / yes (default)
? Are you using React Server Components? › no / yes (default)

Add components

You can now start adding components to your project.

npx uilabs-cli add [component-id]

The command above will add the component to your project in the directory you specified during the initialization.