CMYK ↔ RGB ↔ HEX Color Converter
About Palette Contrast Analyzer
The Color Palette Contrast Matrix & WCAG Accessibility Auditor generates an $N \times N$ cross-comparison matrix of all foreground/background color combinations in a palette, auditing WCAG 2.1 AA/AAA compliance for normal text, large text, and UI components.
How to Use Palette Contrast Analyzer
Step 1
Paste your palette hex colors into the input field.
Step 2
Inspect the generated cross-contrast matrix table.
Step 3
Click on any cell to see detailed WCAG score cards.
Step 4
Click "Export Audit Report".
Practical Use Cases for Palette Contrast Analyzer
Auditing Design System Color Accessibility
Verify which text colors and background combinations in a brand palette meet WCAG 2.1 minimum 4.5:1 contrast ratios before shipping.
Creating Accessible Button & Badge Variant Combinations
Find guaranteed readable primary, secondary, danger, and warning color pairings from an existing brand palette.
Input & Output Examples
Analyzing Contrast Between Blue and White
Foreground: `#ffffff` | Background: `#3b82f6`
Contrast: `4.54:1` | Status: ✅ WCAG AA Normal Text Passed | ✅ WCAG AAA Large Text Passed
Key Features & Performance
- ✓Interactive $N \times N$ grid matrix showing exact contrast ratio for every possible color pair.
- ✓WCAG 2.1 compliance badges: AA (4.5:1), AAA (7.0:1), Large Text (3.0:1), and UI Components (3.0:1).
- ✓1-Click accessible pairing filter (hides failing combinations automatically).
- ✓100% Client-Side memory execution.
- ✓1-Click Export CSV accessibility audit report.
Key Terminology & Definitions
WCAG 2.1 Level AA
The standard accessibility baseline requiring at least 4.5:1 contrast ratio for normal body text and 3.0:1 for large text / UI elements.
Contrast Ratio ($L_1 + 0.05 / L_2 + 0.05$)
The mathematical ratio of the relative luminance of the lighter color ($L_1$) to that of the darker color ($L_2$).