Adds a deliberate color strategy to UI components and surfaces. The skill guides an agent through assessing a design's current color state, planning a palette (dominant, secondary, accent), and applying color semantically to actions, status indicators, charts, and backgrounds. It emphasises accessibility (WCAG contrast), brand consistency, and minimal, high-impact color use.
Use when an interface feels flat, over-gray, or lacks visual hierarchy — for onboarding flows, dashboards, marketing pages, or component libraries. Also useful before a design pass to prepare a palette that maps to states (success, error, warning, info) and to ensure accessibility.
Best for agents that can inspect frontend codebases and run style audits (design-savvy agents); compatible with general-purpose assistant agents and tooling that can modify CSS/Tailwind variables or generate design tokens.
Colorize is a purely instructional skill for adding strategic color to monochromatic UI designs. It contains no scripts or executable code — just a well-structured SKILL.md with design guidance on semantic color, accessibility, and palette strategy. References a dependency on the frontend-design skill for context gathering. No security concerns since there's nothing executable.
Clean instructional skill with good design guidance content. The {{ask_instruction}} template variable and dependency on frontend-design skill are notable. No executable content to test.