Prerequisites
There’s nothing new you need to set up. Just make sure you already have a Next.js project configured with Tailwind CSS, and that ShadCN UI is initialized with all its components installed.
1. Create a Next.js Project
Start by creating a new Next.js application. If you don’t already have one, run the following command:
Highlighting code...2. Install ShadCN UI
Follow the official ShadCN UI installation guideto set up the required dependencies and configure your project.
Highlighting code...3. Add All ShadCN Components
Once installation is complete, you can bulk-install all available ShadCN components using the command below:
Highlighting code...This ensures all base ShadCN components are ready to use, so you won’t need to install them individually each time you add a new block or feature.
You can skip certain components if you’re sure they won’t be used in your project.
4. Browse & Use Blocks
After setup, explore the /blocks page to browse, preview, and copy or download components directly into your project.