Make it yours

Components take their colors and corners only from tokens, so one small set of values sets the whole look. Pick a look below. These are the same components with different values.

Change one app

Components use the shadcn tokens already in your app's globals.css, so they match it from the first install. Edit a value there, and every component follows, including ours. Adding more components keeps your values.

:root {
  --radius: 0.25rem;
  --primary: hsl(243 75% 59%);
  --primary-foreground: hsl(0 0% 100%);
}

Change one component

Installing copies the component to components/kit/. It's your code, so edit its classes or markup directly. Installing it again asks before replacing a changed file.

Use the full UI Kit look

This replaces the colors and corners in your globals.css with the values below, and it overwrites any you changed. Commit first so you can review the change.

bunx --bun shadcn@latest add HarshitMahajan/UI/theme

Change the house style

Edit registry/styles/theme.css in this library's repo and push. This site and later theme installs then use the new values. Apps keep their own values until they install it again.

All tokens