Brand Primary Color
Enter a color to auto-generate a complete design variable system
Accent Relationship
Neutral Tone
Contrast Level
Scale System
Click any scale to view details; each group has 11 steps from 50 to 950
Design Tokens
Semantic variables ready to copy to CSS or Figma Variables
UI Preview
Verify Primary / Accent / Neutral / Surface hierarchy and readability in real UI