Quick start
- 1
Add the registry to your project:
pnpm dlx shadcn@latest registry add @sortui=https://sortui.dev/r/{name}.json - 2
Install any component:
pnpm dlx shadcn@latest add @sortui/button
Or install directly without adding the registry:
pnpm dlx shadcn@latest add https://sortui.dev/r/button.jsonDependencies resolve automatically: npm packages, other SortUI components and the SortUI tokens each component uses.
The SortUI theme
Optional. Components work without it, on your own base colours and radii. The theme sets the values SortUI is designed with (surfaces, fills, lines, text colours and the radius ladder) in your :root, .dark and @theme inline, and the CLI asks before it replaces yours.
pnpm dlx shadcn@latest add @sortui/themeTheming explains what each token is for and how to retune it.
A project on Radix
SortUI is built on Base UI, like every new shadcn/ui project. In an older project on Radix, SortUI components install next to yours. A component you replace with its SortUI version composes with render instead of asChild, so update the places that use it.
