Components install with the shadcn CLI. There is no package to add and nothing to keep in sync: each command copies a component's source into your project, where you own it.
Skip this step if your project already has a components.json. Otherwise run
init. It works in Next.js, Vite, React Router, Astro and other React setups
that use Tailwind CSS 4:
pnpm dlx shadcn@latest init
Pass the component's registry URL to add. Every component page shows its
own command.
pnpm dlx shadcn@latest add https://ui.tealmac.com/r/globe.json
The CLI writes the file to components/ui (or wherever the ui alias in
components.json points) and installs any npm packages it needs. Import it
like any other component:
import { Globe } from "@/components/ui/globe"
export default function Home() {
return <Globe />
}Register the namespace once in your project's components.json:
{
"registries": {
"@tealmac": "https://ui.tealmac.com/r/{name}.json"
}
}After that, the namespace works the same as the full URL, and you can add several items in one go:
pnpm dlx shadcn@latest add @tealmac/globe @tealmac/marquee
| What | Where it lands |
|---|---|
| Components | components/ui/<name>.tsx |
| Hooks | hooks/<name>.ts |
Helpers such as cn() | lib/utils.ts |
| npm dependencies | Your package.json, installed once |
The paths follow the aliases in components.json, so a src/ layout or a
monorepo package works without extra flags.