HTMLTỉ lệ tương phản đo độ chênh sáng giữa màu chữ và màu nền, tính từ 1:1 (trùng nhau) tới 21:1 (đen trên trắng).
| Nội dung | AA | AAA |
|---|---|---|
| Chữ thường | 4.5:1 | 7:1 |
| Chữ lớn (≥18.66px, hoặc ≥14px in đậm) | 3:1 | 4.5:1 |
| Viền input, icon mang nghĩa | 3:1 | — |
css
/* #999 trên nền trắng = 2.85:1 → trượt AA */
.meta { color: #949494; } /* 4.54:1 — vừa đủ đạt */Công cụ: panel Accessibility trong Chrome DevTools (chọn màu là thấy tỉ lệ ngay), Lighthouse, WebAIM Contrast Checker, axe DevTools.
Điểm hay bị bỏ sót: yêu cầu 3:1 cũng áp cho thành phần giao diện, không chỉ chữ — viền ô input, icon trạng thái, đường phân cách mang thông tin.
Lưu ý: đừng dùng màu làm kênh thông tin duy nhất. Ô input báo lỗi chỉ bằng viền đỏ thì người mù màu (khoảng 8% nam giới) không phân biệt được. Luôn kèm icon hoặc chữ.