Build a design system
build_systemGenerate a complete color system from one brand color: 50-950 scales, light/dark theme roles, Tailwind v4, CSS variables, shadcn/ui, DTCG tokens, and contrast audit.
Instructions
Build a full color system from a brand color: 50–950 scales for primary, secondary, accent, neutral and status colors, light and dark theme roles, exported as a Tailwind v4 theme, CSS variables, shadcn/ui globals.css or DTCG tokens, with a contrast audit of text and surface pairs.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| name | No | Brand | |
| accent | No | Any color: #ff5733, rgb(255 87 51), hsl(11 100% 60%), oklch(68% 0.21 34), a CSS or common name like navy, or a Tailwind class like sky-500 | |
| format | No | tailwind | |
| values | No | oklch | |
| neutral | No | Any color: #ff5733, rgb(255 87 51), hsl(11 100% 60%), oklch(68% 0.21 34), a CSS or common name like navy, or a Tailwind class like sky-500 | |
| primary | Yes | Brand or primary color | |
| secondary | No | Any color: #ff5733, rgb(255 87 51), hsl(11 100% 60%), oklch(68% 0.21 34), a CSS or common name like navy, or a Tailwind class like sky-500 |