Kiểm tra Contrast Ratio

Kiểm tra tỉ lệ tương phản màu theo chuẩn WCAG 2.1 — AA và AAA cho chữ thường và chữ lớn

Foreground (chữ)

14.63: 1

Background (nền)

Tiêu chuẩn WCAG 2.1

AA Normal4.5:1
AA Large3:1
AAA Normal7:1
AAA Large4.5:1

“Large text” = ≥ 24 px (18 pt) bình thường, hoặc ≥ 18.67 px (14 pt) in đậm.

Preview

Tiêu đề lớn — Large Text

Chữ đậm cỡ 18 px — Bold Large Text

Đây là đoạn văn bản thông thường (Normal text). Tỉ lệ tương phản cần đạt ít nhất 4.5:1 theo tiêu chuẩn WCAG 2.1 AA để đảm bảo khả năng đọc cho người dùng.

Chữ nhỏ (14 px) — Small text yêu cầu chuẩn AA Normal (4.5:1).

Caption / chú thích — 12 px

CSS Snippet

color: #1E293B;
background-color: #FFFFFF;

Bộ màu nhanh

Điểm nổi bật

Các điểm đáng chú ý nhất của công cụ này để bạn nắm nhanh trước khi dùng.

#01

Kiểm tra chuẩn WCAG 2.1

Tự động đánh giá mức AA và AAA cho cả văn bản thường và văn bản lớn theo tiêu chuẩn tiếp cận web quốc tế.

#02

Xem trước trực tiếp

Hiển thị ngay văn bản mẫu trên nền màu đã chọn để bạn cảm nhận thực tế mức độ dễ đọc.

#03

Gợi ý sửa màu không đạt

Khi cặp màu không đạt chuẩn, công cụ đề xuất màu điều chỉnh để vừa đủ tỉ lệ yêu cầu vừa gần với màu gốc nhất.

#04

Tỉ lệ tương phản chính xác

Hiển thị con số tỉ lệ tương phản cụ thể, giúp bạn biết chính xác khoảng cách đến ngưỡng đạt chuẩn.

Cách sử dụng

Làm theo từng bước để dùng công cụ nhanh và đúng intent ngay từ lần đầu.

1

Chọn màu chữ và màu nền

Nhập mã hex hoặc dùng color picker để chọn màu foreground (chữ) và background (nền).

2

Xem kết quả tương phản

Tỉ lệ tương phản và trạng thái đạt/không đạt AA, AAA hiển thị ngay lập tức.

3

Kiểm tra xem trước

Xem ô preview để đánh giá trực quan văn bản trên nền màu thực tế.

4

Áp dụng gợi ý nếu không đạt

Nếu màu không đạt chuẩn, chọn màu được gợi ý để tự động cập nhật về giá trị đủ điều kiện.

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

Những câu hỏi gặp nhiều nhất khi dùng công cụ, được trình bày ngắn gọn và dễ quét.

WCAG 2.1 yêu cầu tối thiểu 4.5:1 cho văn bản thường (mức AA) và 3:1 cho văn bản lớn (≥18pt hoặc ≥14pt bold). Mức AAA nâng lên 7:1 và 4.5:1 tương ứng.