Contrast · WCAG 2.1 · fix suggestions

♿ Color Contrast

Put a text colour on a background and see whether the contrast clears WCAG AA or AAA. If it falls short, get the nearest passing colour with the same hue in one click.

Text (foreground)

Background

Contrast ratio—:1

Must reach

Aa · Xin chào 123

Đoạn chữ thường để kiểm tra khả năng đọc: The quick brown fox jumps over the lazy dog.

Buttona sample link

Contrast is computed from WCAG 2.1 relative luminance (sRGB linearised at 0.04045, weights 0.2126/0.7152/0.0722). AA needs ≥4.5:1 for normal text (≥3:1 for large ≥18.66px bold / ≥24px); AAA needs ≥7:1 (≥4.5:1 large). UI components & graphics need ≥3:1. Suggestions keep hue and saturation and only move lightness, so the colour still reads as the same colour.