Kiểm tra độ tương phản màu

Kiểm tra tỷ lệ tương phản giữa màu nền và màu văn bản để đảm bảo khả năng truy cập.

1.00:1
Tương phản
Fail
Rất kém

Văn bản thông thường

AA (4.5:1)
AAA (7:1)

Văn bản lớn

AA (3:1)
AAA (4.5:1)
White
#ffffff
Coral
#ff7f50

Sửa nhanh

Aa

Tiêu đề xem trước

Con cáo nâu nhanh nhẹn nhảy qua con chó lười biếng

Ví dụ văn bản nhỏ (12px)

Văn bản
#ffffff
Nền
#ff7f50

Tiêu chuẩn WCAG

Level AA

Tỷ lệ tương phản tối thiểu 4.5:1 cho văn bản thông thường và 3:1 cho văn bản lớn. Yêu cầu cho hầu hết các trang web.

Level AAA

Tỷ lệ tương phản nâng cao 7:1 cho văn bản thông thường và 4.5:1 cho văn bản lớn. Khuyến nghị cho khả năng truy cập tối ưu.

Độ tương phản không đủ cho tất cả kích thước văn bản - không đạt tiêu chuẩn WCAG.

Kiểm tra độ tương phản màu

Tính toán tỷ lệ tương phản của màu văn bản và nền.

Chọn một màu bằng công cụ Color Picker cho màu văn bản và nền hoặc nhập màu ở định dạng RGB hexadecimal (ví dụ: #259 hoặc #2596BE). Bạn có thể điều chỉnh thanh trượt để chọn màu. Hướng dẫn về Nội dung Web (WCAG) có một hướng dẫn cụ thể để giúp xác định liệu văn bản có dễ đọc cho người dùng có thị lực hay không. Tiêu chí này sử dụng một thuật toán cụ thể để ánh xạ các kết hợp màu thành các tỷ lệ có thể so sánh. Sử dụng công thức này, WCAG cho rằng tỷ lệ tương phản màu 4.5:1 với văn bản và nền của nó là đủ cho văn bản thông thường, và văn bản lớn (18+ pt thông thường, hoặc 14+ pt đậm) nên có ít nhất tỷ lệ tương phản màu 3:1.

Tính năng chính

  • Tính toán tỷ lệ tương phản theo thời gian thực
  • Kiểm tra tuân thủ WCAG AA & AAA
  • Thanh trượt HSL để tinh chỉnh
  • Nhiều định dạng xem trước

Công cụ nâng cao

  • Tự động sửa màu
  • Mẫu văn bản và nền
  • Phát hiện tên màu
  • Xuất kết quả