Chuyển tới nội dung chính

Chọn màu và kiểm tra độ tương phản

Chọn một màu và đọc ở dạng HEX, RGB, HSL, rồi kiểm tra độ tương phản với màu khác theo quy tắc WCAG cho chữ và giao diện.

Màu

Màu chữ ở các dạng

  • HEX#17203a
  • RGBrgb(23, 32, 58)
  • HSLhsl(225, 43%, 16%)

Kết quả

Tỉ lệ tương phản
13,05:1
AA, chữ thường
Đạt

Đạt mọi mức kiểm tra cho chữ, kể cả AAA.

Xem trước

Chữ lớn, 24px

Trăm năm trong cõi người ta, chữ tài chữ mệnh khéo là ghét nhau.

Kiểm tra WCAG 2.2

Kết quả kiểm tra tương phản WCAG cho hai màu
AA, chữ thườngĐạtcần 4,5:1
AA, chữ lớnĐạtcần 3:1
AAA, chữ thườngĐạtcần 7:1
AAA, chữ lớnĐạtcần 4,5:1
Biểu tượng và nútĐạtcần 3:1

Chạy ngay trên trình duyệt; những gì bạn nhập không rời khỏi trang này.

Cách hoạt động

Đọc một màu

Gõ #rgb, #rrggbb, rgb() hoặc hsl(), các dạng còn lại tự cập nhật. HSL mô tả màu bằng sắc độ, độ bão hoà và độ sáng, dạng dễ chỉnh tay nhất.

Kiểm tra tương phản

Độ tương phản là tỉ số giữa độ chói tương đối của màu sáng hơn và màu tối hơn, từ 1 đến 21. WCAG 2.2 yêu cầu 4,5 cho chữ thường ở mức AA và 7 ở mức AAA, 3 cho chữ lớn và thành phần giao diện, và 4,5 cho chữ lớn ở mức AAA.

tỉ số = (L₁ + 0,05) ÷ (L₂ + 0,05)