Pemeriksa Kontras Warna WCAG 2.2
Berjalan secara lokal di browser AndaPeriksa kontras warna teks dan UI terhadap WCAG 2.2 AA dan AAA, lalu perbaiki pasangan yang gagal
Memulihkan warna tersimpan…
Alat Terkait
Apa itu WCAG 2.2 Color Contrast Checker?
WCAG 2.2 Color Contrast Checker mengukur rasio kontras antara warna latar depan dan latar belakang, lalu melaporkan lulus atau gagal untuk teks AA dan AAA (KS 1.4.3 dan 1.4.6) serta untuk komponen UI dan objek grafis (KS 1.4.11). Alat ini menerima HEX, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color(), dan nama warna CSS, menampilkan pratinjau pasangan sebagai teks dan kontrol, serta menyarankan warna aksesibel terdekat saat pasangan gagal.
Cara menggunakan
- 1.Ketik atau pilih warna latar depan dan latar belakang.
- 2.Baca rasio dan baris lulus/gagal untuk setiap kriteria WCAG 2.2.
- 3.Periksa pratinjau teks normal, teks besar, dan kontrol.
- 4.Jika ada yang gagal, pilih Sesuaikan latar depan atau Sesuaikan latar belakang ke AA atau AAA, bandingkan warna asli dan saran, lalu pilih Terapkan.
- 5.Salin ringkasan hasil atau deklarasi CSS.
Cara rasio dihitung
Setiap warna dikonversi ke sRGB dan luminans relatifnya dihitung dengan rumus WCAG (ambang linearisasi 0.04045). Rasionya adalah (L1 + 0.05) / (L2 + 0.05). Rasio ditampilkan dengan dua desimal, tetapi setiap keputusan lulus/gagal memakai nilai yang belum dibulatkan, sehingga 4.499:1 gagal AA walaupun tampil sebagai 4.50:1. Latar depan transparan dicampur di atas latar belakang, dan latar belakang transparan di atas warna alas halaman (default putih), per kanal sRGB, seperti cara browser menggambarnya. Warna di luar sRGB, seperti nilai Display P3 atau OKLCH yang sangat jenuh, dipotong ke sRGB sebelum diukur dan alat ini menampilkan keterangannya.
Batasan dan privasi
Pemeriksa ini mengukur satu pasangan warna. Alat ini tidak menilai rendering font, teks di atas gambar atau gradien, maupun kriteria WCAG lain; gunakan Web Accessibility Checker untuk mengaudit seluruh halaman. Dalam WCAG 2.2, teks besar berukuran minimal 18 poin, atau 14 poin tebal (sekitar 24px, atau 18,66px tebal). Warna diproses di browser Anda, dan pasangan terakhir hanya disimpan di penyimpanan lokal browser ini.
