Generate Color Tokens

Generate accessible color tokens from a single accent color following Dieter Rams' "Less, but better" philosophy.

Usage

1. Ask user for the accent color (hex format, e.g., #ed8008)
2. Run: node .claude/skills/color-tokens/generate.js "#hexcolor"
3. Review output with user
4. Update src/styles/tokens.css with new values

What It Generates

• 10 adaptive grays that harmonize with the accent (warm/cool/neutral)
• Accessible text color for the accent (light or dark based on APCA contrast)
• CSS custom properties ready to paste
• Accessibility contrast checks

Example

node .claude/skills/color-tokens/generate.js "#ed8008"