A quick guide to adding your first component.
This guide provides the essentials for adding Pure UI components to your React application.
Pure UI components are built with Tailwind CSS v4. Before you begin, make sure you have a React project set up with Tailwind CSS.
You can add components automatically with the shadcn CLI or manually by copying the files.
Components are styled with the design token system, which is defined by CSS variables and implemented with Tailwind CSS.
The variables are the same as shadcn/ui, and are fully customizable. You can modify them in your global stylesheet (e.g., app/globals.css) to match your design system.
For developers migrating from Radix UI, many of our UI primitives include instructions and examples for translating equivalent Radix components to Base UI. This ensures a smooth transition while preserving accessibility, behaviors, and API patterns.