Labels.io

shadcn/ui components

Add battle-tested primitives that inherit your brand automatically.

The kit is pre-configured for shadcn/ui. components.json is set up, and a token bridge in app/styles/app.css maps shadcn's expected variables (--color-card, --color-ring, ...) onto the kit's own tokens. Components you add render on-brand with zero styling work.

Adding a component

pnpm dlx shadcn@latest add dialog

Or just say "add a dialog"; the add-shadcn.md skill runs the CLI and wires a usage example. Button, dialog, and dropdown-menu are already installed under app/components/ui/.

The component stack rule

Tailwind + the kit's own components + shadcn primitives is the whole stack. Never add a heavyweight UI framework (Chakra, MUI, Ant); it would fight the token system and double the bundle.

On this page