Kiểm tra màu của bạn
Kiểm tra các kết hợp màu để đảm bảo chúng đáp ứng tiêu chuẩn truy cập WCAG cho khả năng đọc văn bản.
So sánh: #FFFFFF trên #7C4A38
Văn bản
16px, Thường (400)
Được xem là văn bản bình thường.
AA (WCAG 1.4.3): ít nhất 4.5:1
ĐạtAAA (WCAG 1.4.6): ít nhất 7:1
Đạt
Thành phần UI và đồ họa
Biểu tượng, đường viền ô nhập, chỉ báo focus và những phần khác bạn cần thấy để sử dụng giao diện.
AA (WCAG 1.4.11): ít nhất 3:1
Đạt
Cách kiểm tra
- Các màu được so sánh (sau khi pha)
- Văn bản #FFFFFF trên nền #7C4A38
- Độ sáng tương đối
- Văn bản 1.0000, nền 0.0946
- Công thức
- (L1 + 0.05) / (L2 + 0.05) trong đó L1 là độ sáng của màu sáng hơn và L2 của màu tối hơn.
- Tỷ lệ chính xác
- 7.2573 trên 1, hiển thị là 7.25 trên 1. Giá trị hiển thị bị cắt bớt, không làm tròn, nên nó không bao giờ trông tốt hơn thực tế. Giá trị chính xác mới là cái được so sánh với yêu cầu.
Kích thước chữ: 16px, Thường (400)
Được xem là văn bản bình thường. Văn bản lớn là ít nhất 24px (18pt), hoặc ít nhất 18.67px (14pt) khi đậm (độ dày 700 trở lên). Kích thước được hiển thị cắt bớt, không làm tròn.
Được xem là văn bản bình thường. Văn bản lớn là ít nhất 24px (18pt), hoặc ít nhất 18.67px (14pt) khi đậm (độ dày 700 trở lên). Kích thước được hiển thị cắt bớt, không làm tròn.
Con cáo nâu nhanh nhẹn nhảy qua con chó lười biếng
Ví dụ văn bản nhỏ (12px)
Tiêu chuẩn WCAG
Mức AA
Tỷ lệ tương phản tối thiểu 4.5:1 cho văn bản thường và 3:1 cho văn bản lớn. Cần thiết cho hầu hết các trang web.
Mức AAA
Tỷ lệ tương phản nâng cao 7:1 cho văn bản thường và 4.5:1 cho văn bản lớn. Khuyến nghị để tối ưu khả năng truy cập.
Kiểm tra độ tương phản màu
Tính toán tỷ lệ tương phản của màu văn bản và nền.
Chọn màu bằng bộ chọn màu cho văn bản và màu nền hoặc nhập một màu ở định dạng hệ mười sáu RGB (ví dụ: #259 hoặc #2596BE). Bạn có thể điều chỉnh thanh trượt để chọn màu. Hướng dẫn về Nội dung Web (WCAG) có hướng dẫn cụ thể để giúp xác định xem văn bản có dễ đọc cho người dùng không. Tiêu chí này sử dụng một thuật toán cụ thể để ánh xạ các kết hợp màu thành các tỷ lệ so sánh. Sử dụng công thức này, WCAG cho rằng một tỷ lệ tương phản màu 4.5:1 với văn bản và nền là đủ cho văn bản thường, và văn bản lớn (18+ pt thường, hoặc 14+ pt đậm) nên có ít nhất tỷ lệ tương phản 3:1.
Tính năng chính
- Tính toán tỷ lệ tương phản theo thời gian thực
- Kiểm tra tuân thủ WCAG AA & AAA
- Thanh trượt HSL để tinh chỉnh
- Nhiều định dạng xem trước
Công cụ nâng cao
- Tự động sửa màu
- Mẫu văn bản và nền
- Phát hiện tên màu
- Xuất kết quả