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.
72
66%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./source/skills/colorize/SKILL.mdQuality
Discovery
82%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a solid description with excellent trigger terms and clear completeness, explicitly stating both what the skill does and when to use it. Its main weakness is moderate specificity—it describes the general goal of adding color but doesn't enumerate concrete actions (e.g., applying accent colors, adjusting color palettes, enhancing contrast). There's also some risk of overlap with broader UI design or theming skills.
Suggestions
Add more specific concrete actions, e.g., 'Applies accent colors to buttons, headers, and backgrounds; introduces complementary color palettes; enhances visual hierarchy through color contrast.'
Differentiate from general theming/design skills by clarifying scope, e.g., 'Focuses specifically on injecting color into existing grayscale or muted designs, not full redesigns or brand theming.'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | It describes the domain (adding color to interfaces) and a general action ('add strategic color'), but doesn't list multiple specific concrete actions like adjusting accent colors, applying color palettes, modifying button/header colors, etc. | 2 / 3 |
Completeness | Clearly answers both 'what' (add strategic color to monochromatic features to make interfaces more engaging) and 'when' (explicit 'Use when...' clause with multiple trigger scenarios). | 3 / 3 |
Trigger Term Quality | Includes strong natural trigger terms users would actually say: 'gray', 'dull', 'lacking warmth', 'needing more color', 'vibrant', 'expressive palette', 'monochromatic'. These are realistic phrases users would use when describing a bland UI. | 3 / 3 |
Distinctiveness Conflict Risk | Reasonably specific to color enhancement of interfaces, but could overlap with general UI design/theming skills or brand color skills. The focus on 'adding color to dull designs' is somewhat distinctive but not a completely unique niche. | 2 / 3 |
Total | 10 / 12 Passed |
Implementation
50%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill provides a comprehensive framework for adding color to monochromatic designs with good strategic principles (60/30/10 rule, OKLCH recommendation, accessibility requirements). However, it's overly verbose for a skill file—many subsections read like a design reference guide rather than actionable instructions. It would benefit from being split into a concise overview with references to detailed guidance, and from including more concrete code examples.
Suggestions
Add concrete CSS/Tailwind code examples for key patterns (e.g., replacing gray backgrounds with tinted ones, creating colored status badges) to improve actionability
Move the detailed subsections (Semantic Color, Data Visualization, Decorative Elements, etc.) into a separate reference file and keep SKILL.md as a concise overview with links to improve progressive disclosure
Add explicit validation steps in the Verify section, such as 'Run a contrast checker on all text-on-color combinations' with specific tool recommendations, to strengthen the feedback loop
Trim redundant guidance—the NEVER list repeats points already made in the body (e.g., 'choose 2-4 colors' appears multiple times)
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The skill is moderately verbose with some unnecessary elaboration. Lists like semantic color tones (emerald, forest, mint) and decorative elements could be trimmed. However, most content is domain-specific guidance Claude wouldn't inherently know about color strategy, so it's not explaining basic concepts. Some sections like 'Decorative Elements' and 'Data Visualization' feel like padding. | 2 / 3 |
Actionability | The skill provides concrete guidance on what colors to use where and includes specific examples like replacing `#f5f5f5` with `oklch(97% 0.01 60)`, but lacks executable code snippets. Most guidance is descriptive ('add colored left/top borders to cards') rather than showing actual CSS/code implementations. The OKLCH recommendation is good but only has one concrete example. | 2 / 3 |
Workflow Clarity | There's a clear sequence (Assess → Plan → Introduce → Balance → Verify) which is good, but the verification step is just a checklist of questions rather than concrete validation steps. For a design skill involving visual changes, there are no explicit feedback loops like 'check contrast with a tool, if failing adjust, re-check.' The mandatory preparation step with command references is a good checkpoint. | 2 / 3 |
Progressive Disclosure | The skill references external commands (frontend-design, teach-impeccable) which is good progressive disclosure, but the main content itself is quite long and monolithic. The detailed subsections on semantic color, accent application, backgrounds, data visualization, borders, typography, and decorative elements could be split into a reference file, keeping SKILL.md as a concise overview with links. | 2 / 3 |
Total | 8 / 12 Passed |
Validation
90%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
3a4fc70
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.