colorize

Add strategic color to features that are too monochromatic or lack visual interest. Makes interfaces more engaging and expressive.

1.10x

Quality

56%

Does it follow best practices?

Impact

93%

1.10x

Average score across 3 eval scenarios

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./archived/legacy-companion/.agents/skills/colorize/SKILL.md

Evaluation results

100%

21%

Add a Color-Coded Status System to an Order Management UI

Semantic color and accessibility

Criteria

Without this skill

With this skill

Green for success state

100%

Red/pink for error/cancel state

100%

Orange/amber for warning state

100%

Blue for info/processing state

100%

Gray/slate for neutral state

100%

Non-color indicator added

100%

WCAG contrast target stated

100%

Color-per-status documented

100%

Consistent color meanings

100%

No color-only reliance noted

100%

No pure gray neutrals in badges

50%

100%

80%

Colorize a Grayscale Analytics Dashboard

OKLCH color and palette strategy

Criteria

Without this skill

With this skill

OKLCH usage

No pure gray neutrals

100%

No pure black surface

100%

No pure white surface

Palette restraint

100%

60/30/10 hierarchy

50%

100%

Teal brand color used

100%

Purposeful application explained

100%

No gray text on colored background

100%

Semantic colors present

100%

Redesign a Landing Page Hero Section with Meaningful Color

Purposeful gradients and palette restraint

Criteria

Without this skill

With this skill

No purple-blue gradient

100%

No pure white hero background

100%

No pure black text

100%

No pure gray neutrals

100%

Coral/warm brand color used

100%

Palette restraint documented

100%

Avoided approach explained

100%

Temperature consistency

100%

Purposeful visual interest method

100%

Color has stated purpose

100%

Repository: The-Vibe-Company/companion
Path: archived/legacy-companion/.agents/skills/colorize/SKILL.md
Commit: 90804d3

Evaluated: 6 months ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

Colorize a Grayscale Analytics Dashboard Add a Color-Coded Status System to an Order Management UI Redesign a Landing Page Hero Section with Meaningful Color

Is this your skill?

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.