Get NextJet
ComponentsShadCN

ShadCN

Easily use beautifully designed, accessible, and customizable components in your app with ShadCN.

We use ShadCN for beautifully pre-built components that enable swift app development.

ShadCN offers a collection of stunning, accessible components for your app. Built with React, RadixUI, and Tailwind CSS, these components are easy to integrate and customize.

Why ShadCN?

ShadCN is different from usual component libraries. Instead of installing it with npm, you just copy and paste beautifully designed, accessible, and customizable React components directly into your project.

This way we get the following benefits:

  • Easy to use and understand
  • No need to worry about updates or breaking changes
  • Complete control and flexibility for customization and integration
  • We can style all components easily and swiftly with Tailwind CSS through the classname prop

Usage

I have added all ShadCN components already for your convenience to the packages/ui folder.

You can use these components in your app by importing them like so:

import { Button } from "@package/ui/button"
import { Badge } from "@package/ui/badge"
import { Card } from "@package/ui/card"

These are not all the components available. It's just an example to show you how to import them.

Visit ShadCN components to see a list of all the components and how to use them.

Last updated on

On this page