Color System
Visual reference of design tokens and Tailwind classes.
Primary
primary-100
—
Aa
primary-200
—
Aa
primary-300
—
Aa
primary-400
—
Aa
primary-500
—
Aa
primary-600
—
Aa
primary-700
—
Aa
primary-800
—
Aa
primary-900
—
Aa
Secondary
secondary-100
—
Aa
secondary-200
—
Aa
secondary-300
—
Aa
secondary-400
—
Aa
secondary-500
—
Aa
secondary-600
—
Aa
secondary-700
—
Aa
secondary-800
—
Aa
secondary-900
—
Aa
Neutral
neutral-100
—
Aa
neutral-200
—
Aa
neutral-300
—
Aa
neutral-400
—
Aa
neutral-500
—
Aa
neutral-600
—
Aa
neutral-700
—
Aa
neutral-800
—
Aa
neutral-900
—
Aa
Success
success-100
—
Aa
success-200
—
Aa
success-300
—
Aa
success-400
—
Aa
success-500
—
Aa
success-600
—
Aa
success-700
—
Aa
success-800
—
Aa
success-900
—
Aa
Warning
warning-100
—
Aa
warning-200
—
Aa
warning-300
—
Aa
warning-400
—
Aa
warning-500
—
Aa
warning-600
—
Aa
warning-700
—
Aa
warning-800
—
Aa
warning-900
—
Aa
Danger
danger-100
—
Aa
danger-200
—
Aa
danger-300
—
Aa
danger-400
—
Aa
danger-500
—
Aa
danger-600
—
Aa
danger-700
—
Aa
danger-800
—
Aa
danger-900
—
Aa
Info
info-100
—
Aa
info-200
—
Aa
info-300
—
Aa
info-400
—
Aa
info-500
—
Aa
info-600
—
Aa
info-700
—
Aa
info-800
—
Aa
info-900
—
Aa