Give your coding agent the system: one prompt installs it and puts it to work.
One prompt gives your coding agent the system: it adds the registry, installs the theme and the components the screen needs, and keeps to the tokens and the rules on these pages instead of inventing its own.
Install the Sphere Kit design system in this project. It is a shadcn/ui registry built on Radix UI.
1. In components.json, add the registry: "registries": {"@sphere-kit":"https://kit.studiosphere.co/r/{name}.json"}2. Install the theme (tokens for light and dark, fonts, radius): npx shadcn@latest add @sphere-kit/theme3. Add the components the screen needs, for example: npx shadcn@latest add @sphere-kit/button
Rules: use the theme's tokens for every colour, never raw palette values. Keep shadcn's component APIs as they are.Docs and examples: https://kit.studiosphere.co| Without the prompt | With it | |
|---|---|---|
| Colour | Raw palette values and one-off shadows | A role token for every colour, in both themes |
| Hover | A highlight that blinks between rows | One highlight that glides to the pointer |
| Loading | Labels that swap, layouts that jump | Values that morph, skeletons sized by the content |