Color palette analysis
Full color analysis in one call: parse any color format, check WCAG contrast against white, and simulate all three forms of color blindness.
When to use this pack
A designer or front-end agent picked a brand color and needs the accessibility picture before committing: does it pass WCAG AA/AAA against a white background? What do protanopia / deuteranopia / tritanopia users see? What's the HSL breakdown? One pack replaces three separate calls.
Tools in this pack
-
Color convert
$0.001
POST /api/color
Convert a color between hex, RGB, and HSL. Accepts "#1a2b3c", "rgb(26,43,60)", or "hsl(210,40%,17%)".
-
Color contrast (WCAG)
$0.001
POST /api/color-contrast
Compute the WCAG 2.x contrast ratio between two colors (hex #rgb or #rrggbb) and whether it passes AA/AAA for normal and large text. Deterministic — for accessible color choices without a tool in the loop.
-
Color blindness simulation
$0.001
POST /api/color-blindness
Simulate how a color appears to viewers with protanopia (red-blind), deuteranopia (green-blind), or tritanopia (blue-blind) — the three dichromacy types covering ~8% of men and ~0.5% of women. Returns the simulated RGB plus the contrast ratio against a reference color so you can verify a UI is still legible under each condition. Uses the Brettel/Vienot/Mollon approximation in sRGB (the de-facto standard for web tools).
Workflow
- Parse the color with the color tool — returns hex, RGB, HSL, and named-color lookup.
- Check WCAG contrast against white (#ffffff) with color-contrast — returns ratio and AA/AAA pass/fail for normal and large text.
- Simulate color blindness with color-blindness — returns the color as seen by protanopia, deuteranopia, and tritanopia viewers.
Run it in Claude
claude mcp add agent402 -s user -- npx -y agent402-mcp@latest
Then paste this prompt into Claude:
Analyze the color #4ade80 using Agent402: (1) color {color: "#4ade80"} — get hex/RGB/HSL. (2) color-contrast {foreground: "#4ade80", background: "#ffffff"} — WCAG ratio + AA/AAA pass. (3) color-blindness {color: "#4ade80"} — simulated values for all three types. Return {parsed, contrast, blindness}.← All skill packs