AbraCalc

Công cụ Kiểm tra Độ tương phản Màu

Kiểm tra tỷ lệ tương phản WCAG giữa hai màu hex và xem cặp màu đó có đạt tiêu chuẩn trợ năng AA và AAA hay không.

Bởi · Kiểm tra bởi AbraCalc Methodology Review · 2 nguồn

Nhúng công cụ này vào trang của bạn
Trích dẫn công cụ này

APA

AbraCalc. (2026). Công cụ Kiểm tra Độ tương phản Màu [Online calculator]. Retrieved from https://abracalc.com/vi/kiem-tra-tuong-phan-mau/

BibTeX

@misc{abracalc-kiem-tra-tuong-phan-mau, author = {AbraCalc}, title = {Công cụ Kiểm tra Độ tương phản Màu}, year = {2026}, howpublished = {\url{https://abracalc.com/vi/kiem-tra-tuong-phan-mau/}} }

Công cụ này có trả lời được câu hỏi của bạn không?

Cách dùng công cụ này

  1. Nhập màu chữ (foreground) và màu nền dưới dạng mã hex.
  2. Công cụ tính độ sáng tương đối WCAG của mỗi màu.
  3. Đọc tỷ lệ tương phản và kết quả Đạt/Không đạt cho các ngưỡng AA và AAA.

Kiểm tra xem hai màu có đáp ứng yêu cầu tương phản WCAG 2.1 hay không. Tỷ lệ tối thiểu là 4.5:1 cho văn bản thường (AA) và 7:1 cho tiêu chuẩn AAA cao nhất.

Công thức

For each hex color, compute relative luminance L using the WCAG formula:
L = 0.2126 × lin(R) + 0.7152 × lin(G) + 0.0722 × lin(B)
where lin(c) = c/12.92 if c ≤ 0.03928, else lin(c) = ((c + 0.055)/1.055)2.4.

Contrast ratio: ratio = (Llighter + 0.05) / (Ldarker + 0.05)

WCAG thresholds: AA normal text ≥ 4.5:1; AA large text ≥ 3.0:1; AAA normal text ≥ 7.0:1; AAA large text ≥ 4.5:1.

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

Tỷ lệ tương phản WCAG là gì?
WCAG (Web Content Accessibility Guidelines) định nghĩa một công thức tỷ lệ tương phản. Nó dao động từ 1:1 (không tương phản) đến 21:1 (đen trên trắng). Văn bản nội dung thường cần ít nhất 4.5:1 để đạt chuẩn AA.
Thế nào được coi là văn bản lớn?
Văn bản lớn là 18pt (24px) trở lên, hoặc 14pt in đậm (khoảng 19px đậm). Văn bản lớn chỉ cần tỷ lệ 3:1 để đạt AA.

Tài liệu tham khảo và nguồn