← ClaudeAtlas

colorizelisted

Add strategic color to features that are too monochromatic or lack visual interest, making interfaces more engaging and expressive. Use when the user mentions the design looking gray, dull, lacking warmth, needing more color, or wanting a more vibrant or expressive palette.
AkaraChen/2code · ★ 23 · Code & Development · score 67
Install: claude install-skill AkaraChen/2code
Strategically introduce color to designs that are too monochromatic, gray, or lacking in visual warmth and personality. ## MANDATORY PREPARATION Invoke /frontend-design — 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 /teach-impeccable first. Additionally gather: existing brand colors. --- ## Assess Color Opportunity Analyze the current state and identify opportunities: 1. **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? 2. **Identify where color adds value**: - **Semantic meaning**: Success (green), error (red), warning (yellow/orange), info (blue) - **Hierarchy**: Drawing attention to important elements - **Categorization**: Different sections, types, or states - **Emotional tone**: Warmth, energy, trust, creativity - **Wayfinding**: Helping users navigate and understand structure - **Delight**: Moments of visual interest and personality If any of these are unclear from the codebase, ask the user directly to clarify what you cannot infer. **CRITICAL**: More color ≠ better. Strategic color beats rainbow vomit every time. Every color should have a purpose. ##