31 người đã dùng
·
54 lượt xem
Kiểm tra tương phản
Chữ trên nền có dễ đọc và đạt chuẩn WCAG không? Biết ngay.
Màu chữ
Màu nền
0: 1
Xem thử chữ thật trên nền thật
Học thiết kế cùng ColorME
Độ tương phản đủ giúp mọi người đọc dễ dàng, kể cả trên màn hình ngoài trời hay với người thị lực kém.
Chữ nhỏ 12px · chú thích, ghi chú, nhãn biểu mẫu
Đăng ký ngayChọn màu chữ và màu nền bằng mã màu hoặc ô chọn màu, công cụ tính ngay tỉ lệ tương phản và cho biết đạt chuẩn WCAG AA, AAA hay chưa. Bạn xem thử được chữ thật trên nền thật ngay bên cạnh.
Theo WCAG 2.1, chữ thường cần tối thiểu 4.5:1 để đạt AA và 7:1 để đạt AAA. Chữ lớn chỉ cần 3:1 (AA) hoặc 4.5:1 (AAA).
AA là mức tối thiểu nên đạt cho mọi website và ứng dụng. AAA khắt khe hơn, phù hợp nội dung đọc nhiều hoặc sản phẩm dành cho người thị lực kém.
Chữ lớn là từ 18pt (khoảng 24px), hoặc từ 14pt (khoảng 18.66px) nếu in đậm. Các cỡ nhỏ hơn được tính là chữ thường.
Khi chưa đạt, công cụ giữ nguyên sắc độ màu chữ của bạn và chỉ đổi độ sáng tới khi đạt AA hoặc AAA. Nhờ vậy màu gợi ý vẫn hợp với thương hiệu.
Có, bấm nút đổi chỗ để thử ngược lại, ví dụ chữ trắng trên nền màu thương hiệu so với chữ màu trên nền trắng.
Tương phản đủ giúp mọi người đọc dễ dàng, kể cả khi xem điện thoại ngoài nắng hoặc người lớn tuổi, người thị lực kém. Đây cũng là tiêu chí cơ bản của thiết kế dễ tiếp cận (accessibility).
Hãy lấy màu ở vùng ảnh sát chữ nhất (dùng công cụ Chọn màu của ColorME) làm màu nền để kiểm tra. Nếu chưa đạt, thêm lớp phủ tối hoặc khung nền phía sau chữ.
Có. WCAG yêu cầu thành phần giao diện như viền ô nhập, biểu tượng quan trọng đạt tối thiểu 3:1 so với nền xung quanh.
Được để tham khảo, vì chữ khó đọc trên màn hình cũng thường khó đọc khi in. Tuy nhiên màu in còn phụ thuộc giấy và mực, nên hãy in thử.
Miễn phí, không cần đăng nhập và chạy ngay trên trình duyệt máy tính lẫn điện thoại.
Có thể, miễn là vẫn đạt 4.5:1 trên nền. Nhiều giao diện dùng xám quá nhạt khiến chữ phụ khó đọc, hãy thử màu gợi ý đậm hơn một chút.
Công cụ bỏ qua độ trong suốt và tính tương phản theo màu đặc, đồng thời báo ngay dưới ô nhập. Nếu chữ của bạn bán trong suốt, hãy nhập màu thực tế nhìn thấy sau khi chồng lên nền.
Việc tính toán chạy ngay trên trình duyệt của bạn. ColorME ghi nhận lượt dùng kèm hai mã màu, tỉ lệ tương phản và kết quả đạt hay chưa để thống kê, không cần tài khoản.
Không có câu hỏi nào khớp. Thử từ khoá khác hoặc nhắn tư vấn.
Còn câu hỏi? Nhắn tư vấn
Công cụ khác cho người học thiết kế
- Mở khoá toàn bộ công cụ AI của ColorME: tạo ảnh, video, phụ đề… và thêm lượt tạo mockup mỗi ngày.
- Mỗi khoá học tại ColorME tặng 3 đến 24 tháng Premium, tuỳ khoá.
- Bạn bè được học viên mời: 1 tháng Premium.
Xem Premium Account
Xem khoá học
Học viên ColorME có thể mời bạn bè dùng Premium. Nhờ một học viên gửi lời mời tới email của bạn, sau đó đăng nhập bằng đúng email đó, Premium sẽ tự kích hoạt.