Kiểm tra tương phản WCAG AA và AAA

Kiểm tra tương phản màu theo WCAG 2.2 AA và AAA, xem trước cỡ chữ và tìm màu thay thế đáp ứng khả năng tiếp cận.

Di chuột lên hoặc chọn một trường để xem trợ giúp. Nhấn Escape để đóng.

Tiền cảnhNềnNền vẽ không trong suốt

Dùng HEX, RGB, RGBA hoặc HSL. Màu trong suốt được tổng hợp trên nền vẽ không trong suốt.

5.84:1

Ngưỡng dùng tỷ lệ với độ chính xác đầy đủ, không dùng giá trị hiển thị đã làm tròn.

WCAG 2.2
Mức	Dùng	SC	Tối thiểu	Kết quả
AA	Chữ thông thường	1.4.3	4.5:1	Đạt
AA	Chữ lớn	1.4.3	3:1	Đạt
AAA	Chữ thông thường	1.4.6	7:1	Không đạt
AAA	Chữ lớn	1.4.6	4.5:1	Đạt
AA	Thành phần giao diện và đồ họa	1.4.11	3:1	Đạt

Văn bản xem trướcCỡ chữ (CSS px)Đậm

Aa — fiokit.

Chữ thông thường: AA ✓ · AAA ✗

Chữ lớn: ít nhất 24 CSS px, hoặc 18,67 CSS px khi in đậm (14 pt).

Mục tiêu màu tiền cảnh đề xuấtBáo cáo

WCAG 2.2
#155bdf / #ffffff (#ffffff)
5.8433:1
AA Chữ thông thường (SC 1.4.3): PASS — 4.5:1
AA Chữ lớn (SC 1.4.3): PASS — 3:1
AAA Chữ thông thường (SC 1.4.6): FAIL — 7:1
AAA Chữ lớn (SC 1.4.6): PASS — 4.5:1
AA Thành phần giao diện và đồ họa (SC 1.4.11): PASS — 3:1

Công cụ kiểm tra cặp màu, không kiểm tra tuân thủ WCAG toàn diện. Đánh giá riêng màu liền kề, trạng thái tương tác và nội dung thực tế.

W3C — SC 1.4.3 · SC 1.4.6 · SC 1.4.11

Cách sử dụng

Đặt màu tiền cảnh, nền và nền vẽ không trong suốt. Kết quả AA và AAA cập nhật ngay. Thử cỡ và độ đậm chữ, áp dụng màu đề xuất hoặc tải báo cáo.

Ví dụ thực tế

Màu

#155bdf

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

Văn bản có được gửi đến máy chủ không?

Không. Nội dung được xử lý trong trình duyệt này, không được gửi đến máy chủ hoặc lưu lại.

Cần biết gì về Kiểm tra tương phản WCAG AA và AAA?

Hiển thị riêng ngưỡng cho văn bản và thành phần phi văn bản. Kiểm tra màu này không chứng nhận tuân thủ WCAG toàn diện.