Installation
Get up and running in a few minutes. You need Tailwind CSS v4 and a React project.
1. Install Tailwind CSS
If you don't already have Tailwind v4 in your project:
npm install -D tailwindcss @tailwindcss/postcss2. Add the Catppuccin stylesheet
Import Tailwind and the Catppuccin theme tokens in your global CSS file:
@import "tailwindcss";
@import "./catppuccin.css";Grab the stylesheet from the setup page or copy it from src/styling/catppuccin.css in the repo.
3. Install components
Use the shadcn CLI to pull any component into your project:
npx shadcn@latest add https://catppuccin.d14y.com/r/button.jsonReplace button with any component name. The CLI resolves dependencies automatically.
You can also copy source directly from the component pages.
4. Use it
import { Button } from "@/components/ui/button"
export default function Page() {
return <Button>Click me</Button>
}