Kiểm tra Tương phản
Công cụ kiểm tra độ tương phản này tính tỷ lệ tương phản WCAG 2.1 giữa màu chữ và màu nền, cho biết cặp màu có đạt chuẩn AA và AAA cho chữ thường và chữ lớn hay không.
Về công cụ này
Công cụ kiểm tra độ tương phản này tính tỷ lệ tương phản WCAG 2.1 giữa màu chữ và màu nền, cho biết cặp màu có đạt chuẩn AA và AAA cho chữ thường và chữ lớn hay không.
Cách sử dụng
- Nhập hoặc chọn màu chữ.
- Nhập hoặc chọn màu nền (dùng được giá trị hex, kể cả dạng rút gọn 3 chữ số).
- Xem tỷ lệ tương phản và kết quả AA/AAA cho chữ thường và chữ lớn.
- Điều chỉnh một trong hai màu cho đến khi đạt mức bạn cần.
Điều nên biết
- WCAG 2.1 AA yêu cầu tỷ lệ tương phản tối thiểu 4.5:1 cho chữ thường và 3:1 cho chữ lớn.
- WCAG 2.1 AAA yêu cầu tối thiểu 7:1 cho chữ thường và 4.5:1 cho chữ lớn.
- Chữ lớn là chữ có cỡ tối thiểu 18 pt (24 px) ở độ đậm thường hoặc 14 pt (khoảng 18.66 px) in đậm.
- Tỷ lệ tương phản dao động từ 1:1 (hai màu giống hệt) đến 21:1 (đen trên trắng).
- Tỷ lệ được tính từ độ chói tương đối (relative luminance) của mỗi màu, theo công thức WCAG.
Chạy hoàn toàn trong trình duyệt của bạn — không có dữ liệu nào bạn nhập được tải lên hay lưu lại.
Câu hỏi thường gặp
Tỷ lệ tương phản bao nhiêu là đạt yêu cầu tiếp cận?
Với WCAG 2.1 mức AA, chữ thường cần tối thiểu 4.5:1 và chữ lớn tối thiểu 3:1. Mức AAA nâng yêu cầu lên 7:1 và 4.5:1.
Chữ trắng trên nền xanh lá có đạt chuẩn tiếp cận không?
Tùy vào sắc độ. Nhiều màu xanh lá tươi không đạt AA với chữ trắng; màu xanh lá đậm hơn thường đạt. Hãy nhập đúng giá trị hex của bạn để kiểm tra.
Thế nào là chữ lớn theo WCAG?
Chữ có cỡ tối thiểu 18 point (24 px) ở độ đậm thường, hoặc tối thiểu 14 point (khoảng 18.66 px) khi in đậm.
Độ tương phản WCAG có áp dụng cho nút và biểu tượng không?
Tiêu chí thành công 1.4.11 của WCAG 2.1 yêu cầu độ tương phản tối thiểu 3:1 cho các thành phần giao diện người dùng và đồ họa mang ý nghĩa so với vùng xung quanh.