01
Khi nào công cụ này hữu ích
Sử dụng trước khi tung màu chữ và màu nền cho văn bản nội dung, nhãn hoặc nút. Nhập hai mã HEX để xem tỷ lệ tương phản và kết quả ngưỡng cho văn bản thường và văn bản lớn.
Trình kiểm tra độ tương phản màu
Kiểm tra độ tương phản cho chữ thường và chữ lớn từ màu nền trước và màu nền sau.
Trình kiểm tra độ tương phản màu
Kết quả xử lý ngay trên trình duyệt để lập kế hoạch và tham khảo.
Cần kiểm tra gì trước khi dùng
02
Cách tạo ra kết quả
Phép tính tuyến tính hóa các kênh sRGB, suy ra độ sáng tương đối và chia độ sáng sáng hơn cộng 0.05 cho độ sáng tối hơn cộng 0.05. Nó so sánh tỷ lệ với ngưỡng văn bản 3:1, 4.5:1 và 7:1.
03
Ví dụ thực tế và cách diễn giải
Nhập màu chữ #111111 trên nền #FFFFFF sẽ tạo ra tỷ lệ cao. Hãy kiểm tra AA thường trước cho phần body nhỏ; với một tổ hợp dành cho tiêu đề lớn, hãy đọc thêm kết quả AA large.
04
Phạm vi và hạn chế
Đi qua một tỷ lệ không có nghĩa là hoàn tất đánh giá khả năng tiếp cận. Hãy kiểm tra kích thước và trọng lượng phông chữ thực tế, trạng thái tương tác, văn bản đặt trên hình ảnh, và bất kỳ thông tin nào chỉ truyền đạt bằng màu sắc.
Câu hỏi thường gặp
Làm thế nào để chuyển một màu từ Trình kiểm tra độ tương phản màu sang ứng dụng khác?
Dùng nút sao chép bên dưới kết quả để sao chép văn bản CSS, HEX hoặc HSL. Xác nhận ứng dụng đích giải thích cùng định dạng màu.
Màu trên màn hình từ Trình kiểm tra độ tương phản màu có khớp bản in không?
Không tự động. Màn hình RGB phát xạ và giấy, mực phản xạ dùng các gamut và mô hình trộn khác nhau, nên vẫn cần hồ sơ in và bản chứng minh in.
Tôi có thể phê duyệt một design token chỉ từ Trình kiểm tra độ tương phản màu không?
Hãy dùng nó như một phương án gợi ý, sau đó thử nền thực, chế độ tối, trạng thái tương tác và độ tương phản văn bản trước khi đặt tên và phê duyệt token.