Kiểm tra tỷ lệ tương phản màu sắc để tuân thủ tiêu chuẩn tiếp cận web. Thử nghiệm các kết hợp màu văn bản và nền theo hướng dẫn WCAG với xem trước thời gian thực, đánh giá khả năng tiếp cận và gợi ý cải thiện.
Chọn màu văn bản
Nhấp vào công cụ chọn màu đầu tiên để chọn màu văn bản của bạn, hoặc nhập trực tiếp mã hex.
Chọn màu nền
Sử dụng công cụ chọn màu thứ hai để chọn màu nền cho bài kiểm tra độ tương phản.
Xem lại kết quả tương phản
Kiểm tra tỷ lệ tương phản đã tính toán và xem xếp hạng AA/AAA cho văn bản thường và văn bản lớn.
Xem trước thiết kế của bạn
Xem bản xem trước trực tiếp để thấy sự kết hợp màu của bạn trông như thế nào với nội dung văn bản thực tế.
Kiểm tra độ tương phản thời gian thực
Ngay lập tức tính toán tỷ lệ tương phản khi bạn chọn các kết hợp màu văn bản và nền khác nhau.
Đánh giá tuân thủ WCAG
Nhận xếp hạng AA và AAA cho cả văn bản thường và văn bản lớn theo Hướng dẫn về khả năng tiếp cận nội dung web.
Bảng xem trước trực tiếp
Xem chính xác cách các kết hợp màu của bạn sẽ hiển thị với văn bản mẫu ở cả kích thước thường và lớn.
Chỉ báo điểm trực quan
Xem hiệu suất độ tương phản của bạn bằng biểu đồ tròn trực quan hiển thị điểm từ 0-100.
Công cụ chọn màu tương tác
Chọn màu dễ dàng với các công cụ chọn màu tích hợp sẵn cho cả màu văn bản và màu nền.
Công cụ kiểm tra độ tương phản màu sắc là một công cụ đo lường sự khác biệt về độ sáng giữa màu văn bản và màu nền. Nó tính toán tỷ lệ tương phản theo tiêu chuẩn WCAG (Hướng dẫn về khả năng tiếp cận nội dung web) để đảm bảo nội dung dễ đọc cho người dùng bị suy giảm thị lực, bao gồm cả người mù màu và thị lực kém.
Tuân thủ WCAG
Đảm bảo thiết kế của bạn đáp ứng các tiêu chuẩn tiếp cận quốc tế với xếp hạng AA và AAA chính xác.
Phản hồi thời gian thực
Xem kết quả tức thì khi bạn điều chỉnh màu sắc, giúp dễ dàng tìm thấy các kết hợp tuân thủ.
Hệ thống điểm số trực quan
Dễ dàng hiểu hiệu suất độ tương phản chỉ trong nháy mắt với hệ thống chấm điểm 0-100 trực quan của chúng tôi.
Không cần cài đặt
Kiểm tra các kết hợp màu ngay lập tức trong trình duyệt của bạn mà không cần tải xuống bất kỳ phần mềm nào.
Đối với văn bản thường, hãy đặt mục tiêu tối thiểu 4.5:1 để tuân thủ AA hoặc 7:1 để tuân thủ AAA. Văn bản lớn (18pt hoặc 14pt in đậm) cần 3:1 để tuân thủ AA hoặc 4.5:1 để tuân thủ AAA.
AA là cấp độ tuân thủ tiêu chuẩn về khả năng tiếp cận được yêu cầu bởi hầu hết các quy định. AAA là cấp độ cao nhất, cung cấp khả năng tiếp cận nâng cao cho người dùng bị suy giảm thị lực nghiêm trọng hơn.
Tỷ lệ tương phản được tính bằng cách sử dụng độ sáng tương đối của màu sắc theo hướng dẫn của WCAG. Nó dao động từ 1:1 (không tương phản) đến 21:1 (tương phản tối đa).
Văn bản lớn được định nghĩa là 18 điểm (24px) trở lên, hoặc 14 điểm (18.66px) trở lên nếu in đậm. Văn bản lớn có yêu cầu tương phản nới lỏng hơn.
Độ tương phản màu sắc tốt đảm bảo nội dung dễ đọc cho mọi người, bao gồm người dùng bị suy giảm thị lực, mù màu, hoặc những người xem nội dung dưới ánh nắng mặt trời chói chang hoặc trên màn hình kém chất lượng.
Mẹo về khả năng tiếp cận
Nhận các gợi ý thực tế để cải thiện độ tương phản và đáp ứng các tiêu chuẩn tiếp cận.
Công cụ này chấp nhận mã màu hex. Bạn có thể chuyển đổi từ các định dạng khác (RGB, HSL, v.v.) sang hex bằng cách sử dụng các công cụ chuyển đổi trực tuyến hoặc phần mềm thiết kế.
Chuyển đổi màu RGB sang màu Pantone gần nhất bằng thuật toán so khớp màu tiên tiến của chúng tôi. Duyệt qua các màu Pantone được tuyển chọn, so sánh sự khác biệt màu sắc và nhận mã màu chính xác cho các dự án thiết kế.