Build-Time Accessibility Validation
Contrast Auditing.
A fast, compile-time CLI tool to catch accessibility (a11y) violations. Automatically verifies combinations of Tailwind CSS text and background utilities for WCAG contrast compliance.
Sandbox Controls
CLI Simulator Output
$ npx tailwind-contrast "**/*.html"
Calculated Contrast:
WCAG Standard
Large Text (Header)
Normal Body Text. This audits paragraphs, small text labels, input labels, and button text elements.
Sample Button
UI Tag
AA Normal
≥ 4.5:1
AA Large
≥ 3.0:1
AAA Normal
≥ 7.0:1
AAA Large
≥ 4.5:1
Integrating with Your Workflow
Ensure your digital interfaces are accessible to all users by catching color contrast violations early in your development pipeline. The plugin parses template files, identifies text and background combinations, and flags failures immediately.
1. Installation
npm install -D @theunwindfront/tailwindcss-contrast-checker
2. Package Task Hook
"scripts": {
"lint:a11y": "tailwind-contrast \"src/**/*.html\""
}