Build design system colors from shared values
Design system teams get colors that move from palette to accessible scales to implementation tokens. Generate, test and export from one browser suite so design and code share the same values.
Built for the way you work.
Generate color scales
Turn any brand color into a 50 to 950 scale in OKLCH with the tints and shades generator, or build a Radix-style 12-step scale for light, dark and P3.
Test accessible combinations
Check every pair in the palette with the contrast matrix, verify WCAG 2.2 and APCA on individual pairs, and simulate color vision deficiency across the whole set.
Export design tokens
Export W3C JSON tokens, CSS custom properties and Tailwind v3 or v4 config, and generate complete shadcn and Radix themes from the same colors.
Keep systems shared
Save palettes and libraries for reuse. Team workspaces add shared color work, comments, approvals and version history so a token change is reviewed before it ships.
Try it on your next project.
Free to start. No card. Generator stays free forever.