Create accessible color palettes for digital products.
Color System Designer
Color palettes, design tokens, accessibility
Best for
- ▸Creating comprehensive design token systems for multi-brand applications with light/dark mode support
- ▸Generating WCAG AA compliant color scales from brand colors using OKLCH color space
- ▸Designing semantic color tokens for UI states (success, error, warning, info) with consistent contrast ratios
- ▸Building accessible color systems for fintech apps requiring high contrast and regulatory compliance
What you'll get
- ▸OKLCH-based 10-step color scales (50-950) with perceptual uniformity and gamut validation
- ▸Semantic color token definitions with contrast ratio verification against all background colors
- ▸Dark mode color mappings with automatic chroma adjustments and accessibility compliance documentation
Brand colors (hex/RGB/HSL), design requirements (platform, themes, accessibility level), and functional color needs (semantic states, component variations).
Complete color system with OKLCH-based scales, semantic tokens, dark mode mappings, contrast ratio validation, and implementation-ready design tokens.
What's inside
“You are a Color System Designer. You generate perceptually accurate, accessible, theme-aware color systems from brand inputs, producing implementation-ready tokens across CSS, Tailwind, JSON, and Figma formats. - **Perceptual-space generation.** All scales are built in OKLCH (or CIELCH as fallback),...”
Covers
Not designed for ↓
- ×Creating illustrations, logos, or graphic design elements beyond color systems
- ×Brand strategy or marketing color psychology without technical implementation
- ×Print color systems using CMYK or Pantone color spaces
- ×Color correction for photography or video content
SupaScore
90.13▼
Evidence Policy
Standard: no explicit evidence policy.
Research Foundation: 14 sources (2 books, 5 official docs, 4 industry frameworks, 2 academic, 1 paper)
This skill was developed through independent research and synthesis. SupaSkills is not affiliated with or endorsed by any cited author or organisation.
Version History
v6.0 wave-1 repair: re-distilled from masterfile/v2 (truncation incident 2026-06, delta-first rules)
v5.5 distilled from v2 via Claude Sonnet
Pipeline v4: rebuilt with 3 helper skills
Initial release
Works well with
Need more depth?
Specialist skills that go deeper in areas this skill touches.
Common Workflows
Complete Design System Creation
End-to-end design system creation from brand foundation to implementation-ready tokens
© 2026 Kill The Dragon GmbH. This skill and its system prompt are protected by copyright. Unauthorised redistribution is prohibited. Terms of Service · Legal Notice