Skills
.Work. You
Rest

contrast-validator

Community

Ensure WCAG AA color contrast in frontend UI.

Design & Creative#ui#a11y#frontend#validation#wcag#contrast
Authormarcusta
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Validates that foreground text and background color combinations in frontend code meet WCAG AA contrast requirements, reducing accessibility issues in UI before deployment.

Core Features & Use Cases

  • Contrast checks across common UI tokens and CSS classes to identify low-contrast pairings.
  • Report generation with violated pairs, suggested fixes, and calculated contrast ratios.
  • Framework-agnostic guidance applicable to React, Vue, or plain HTML/CSS code during code reviews and design handoffs.

Quick Start

Run the validator on your frontend project to audit color pairs and generate a violations report.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: contrast-validator
Download link: https://github.com/marcusta/golf-serie/archive/main.zip#contrast-validator

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.