color

Audit and optimize color contrast and accessibility in UI designs.

12|4|Updated Jun 21, 2026

Search Tags:#accessibility #contrast #color #palette #cvd #perceptual-safety #chromostereopsis

Ready to run

npx skills add https://github.com/eccstartup/grok_skills_bundle --skill color-eccstartup

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: color
Source: https://github.com/eccstartup/grok_skills_bundle/tree/main/color
Command: npx skills add https://github.com/eccstartup/grok_skills_bundle --skill color-eccstartup

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Pillow, and includes scripts (resource) components.

What problem does it solve?

Choosing and auditing colors across projects can fail accessibility standards and perceptual guidelines, leading to unreadable interfaces and unsafe visuals. This Skill provides practical guidance, checks, and automation to help you pick accessible palettes, validate contrast, and audit perceptual hazards.

Core Features & Use Cases

WCAG-compliant contrast auditing for color pairs across light and dark modes
Palette generation and shade-scale creation from a brand color
Perceptual hazard analysis including chromostereopsis and color-vision deficiencies simulations
Automated design reviews of color choices in UI components and dashboards

Quick Start

Run python scripts/audit_image.py screenshot.png to perform a full color accessibility audit.

Frequently Asked Questions about color

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I check WCAG contrast compliance for my UI color palette?▼

You can check WCAG contrast compliance by running automated Python scripts to audit color pairs across light and dark modes, validating that your UI palette meets accessibility standards for readable interfaces.

How do I simulate color vision deficiency and chromostereopsis in a design?▼

Simulate color vision deficiency and chromostereopsis by running perceptual hazard analysis scripts on your images. This identifies unsafe visuals and accessibility issues caused by specific color combinations in your design.

Can I generate an accessible color palette from a single brand color?▼

Yes, you can generate an accessible color palette and create shade scales from a single brand color using the provided Python scripts, ensuring the generated shades maintain perceptual safety and accessibility.

How do I audit color accessibility directly from a screenshot?▼

Audit color accessibility directly from a screenshot by running the audit_image.py script with your image file, which extracts colors and performs a full contrast and perceptual safety review automatically.

Do I need Pillow installed to run contrast checks and color simulations?▼

Yes, you need the Pillow library installed, as the Python scripts rely on it for image processing, color extraction, and executing the underlying contrast checks and perceptual hazard simulations.

What is the best way to plan dark mode colors without causing perceptual hazards?▼

The best way to plan dark mode colors is to use automated design review scripts that validate contrast and simulate perceptual hazards like chromostereopsis, ensuring your dark mode UI remains accessible and visually safe.