skills.rest
Community-Access
Community-AccessOFFICIAL
Explore all skills by this author →
GitHub

Contrast Master

Audit color contrast and visual accessibility for WCAG AA compliance.

387|42|Updated Feb 21, 2026
Search Tags:#accessibility#css#visual design#wcag#contrast#dark mode
One-click install
npx skills add https://github.com/Community-Access/accessibility-agents --skill contrast-master
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Contrast Master
Source: https://github.com/Community-Access/accessibility-agents/tree/main/.gemini/extensions/a11y-agents/skills/contrast-master
Command: npx skills add https://github.com/Community-Access/accessibility-agents --skill contrast-master

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill ensures that all color choices, visual designs, and user interface elements meet strict accessibility standards, preventing exclusion of users with visual impairments.

Core Features & Use Cases

  • WCAG AA Compliance: Guarantees color contrast ratios for text and UI elements meet or exceed standards.
  • Visual Accessibility Specialist: Addresses focus indicators, color independence, dark mode, and animation safety.
  • Use Case: When designing a new website theme, use this Skill to audit all color palettes, ensuring text is readable against backgrounds and interactive elements have clear focus states for keyboard users.

Quick Start

Use the contrast master skill to audit the color contrast for the text 'Hello World' on a background color of '#f0f0f0'.

Frequently Asked Questions about Contrast Master

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

FAQPage Schema
How do I check color contrast ratios for WCAG AA compliance in my web interface?▼

Contrast Master analyzes your CSS to check color contrast ratios for WCAG AA compliance. It audits text visibility, UI component color independence, and focus indicator design across all web frameworks to ensure strict accessibility.

How do I implement accessible dark mode without breaking visual accessibility?▼

To implement accessible dark mode, audit your color palettes to ensure dark mode implementation meets visual accessibility standards. You must verify that text contrast ratios and UI component visibility remain compliant across theme variations.

What is color independence and why does it matter for UI component visibility?▼

Color independence means UI component visibility does not rely solely on color to convey information. It is a core visual accessibility requirement that ensures users with visual impairments can perceive interactive elements without being excluded by color choices.

Can I audit focus indicator design and animation safety across any web framework?▼

Yes, you can audit focus indicator design and animation safety across all web frameworks. The analysis enforces accessibility standards by evaluating CSS and design elements, providing recommended fixes for any non-compliant visual states.

What is the best way to fix CSS contrast issues found during a web accessibility audit?▼

The best way to fix CSS contrast issues is through detailed analysis and recommended fixes for your design elements. Enforcing strict accessibility standards requires adjusting color palettes to guarantee text readability against background colors.

Related Skills

Explore More Design & Creative Skills→
kireevkit15-syskireevkit15-sys

minimalist-ui

Generate editorial web UI designs with bento-grid layouts and HTML/React/Tailwind components.

Community
Advanced
clawpod-appclawpod-app
46

accessibility-review

Audit designs or pages for WCAG 2.1 AA compliance with remediation guidance.

Community
Intermediate
eboodyeboody

ui-expert

Audit UI designs for visual hierarchy, spacing, typography, and design-system consistency.

Community
Advanced
timsvoicetimsvoice

specimin-ui-accessibility

Audit and fix generated UI code for WCAG 2.1 AA compliance.

Community
Advanced