◐

Trình kiểm tra độ tương phản màu

Kiểm tra tỷ lệ tương phản WCAG giữa màu chữ và màu nền với kết quả AA/AAA.

Tệp luôn ở trên thiết bị này

Tệp được xử lý trong trình duyệt, không bao giờ tải lên máy chủ. Trang web tải mã và tài nguyên cần thiết để chạy công cụ. Không tài khoản hay theo dõi.

Dùng Tải xuống để lưu công cụ thành một tệp HTML dùng ngoại tuyến.

Quyền riêng tư →

Màu chữ

Màu nền

Con cáo nâu nhanh nhẹn nhảy qua chú chó lười.

Chữ mẫu cỡ lớn

Thử một ví dụ cụ thể

Ví dụ

Đặt màu chữ là #767676 và nền là #ffffff. Tỉ lệ là 4.54:1, đạt AA cho chữ thường. Nhạt hơn một bậc, #777777 cho 4.48:1 và không đạt, vì AA yêu cầu ít nhất 4,5:1 cho chữ thường.

Lưu ý

Chữ lớn (khoảng 24px, hoặc 18,7px in đậm) chỉ cần 3:1 để đạt AA. Tỉ lệ này bỏ qua phông mảnh, chữ trên ảnh và độ trong suốt, nên hãy kiểm tra cả thiết kế thật và đừng chỉ dùng màu để truyền đạt ý nghĩa.

Về công cụ này

So sánh màu chữ và màu nền để xem tỷ lệ tương phản WCAG cùng việc nó có đạt AA và AAA hay không, tất cả được tính cục bộ trong trình duyệt của bạn.

Câu hỏi thường gặp

Thế nào được tính là chữ lớn?

WCAG coi chữ ở cỡ 18pt (24px) hoặc 14pt (18.66px) in đậm là chữ lớn, vốn chỉ cần tỷ lệ thấp hơn là 3:1 cho AA.

Những tỷ lệ nào đạt yêu cầu?

Chữ thường cần 4.5:1 cho AA và 7:1 cho AAA; chữ lớn cần 3:1 cho AA và 4.5:1 cho AAA.