colorize

Strategically introduce color to monochromatic designs while maintaining hierarchy, accessibility, and visual restraint.

- Requires running the frontend-design skill first to establish design context and gather existing brand colors

- Guides systematic color application across semantic states (success, error, warning, info), accents, backgrounds, data visualization, borders, and typography

- Enforces a 60-30-10 color distribution rule and WCAG contrast compliance to prevent overwhelming or inaccessible designs

- Recommends OKLCH color space for perceptually uniform palettes and provides explicit anti-patterns (rainbow overuse, pure grays, color-only indicators)

Strategically introduce color to designs that are too monochromatic, gray, or lacking in visual warmth and personality.

MANDATORY PREPARATION

Invoke /impeccable - it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow the protocol before proceeding - if no design context exists yet, you MUST run /impeccable teach first. Additionally gather: existing brand colors.

Assess Color Opportunity

Analyze the current state and identify opportunities:

- Understand current state:

- Color absence: Pure grayscale? Limited neutrals? One timid accent?

- Missed opportunities: Where could color add meaning, hierarchy, or delight?

- Context: What's appropriate for this domain and audience?

- Brand: Are there existing brand colors we should use?