Pemeriksa Kontras
Periksa kepatuhan WCAG AA dan AAA untuk kombinasi warna teks dan latar belakang apa pun.
Text color
Background color
Large Text Example (18pt+)
Normal text: The quick brown fox jumps over the lazy dog. This is regular body text to test readability and contrast against the selected background color.
Large text = 18pt (24px) normal or 14pt (18.67px) bold. WCAG 2.1 guidelines. AA is the minimum standard; AAA is enhanced.
Apa itu kepatuhan kontras WCAG?
WCAG (Web Content Accessibility Guidelines) mendefinisikan rasio kontras minimum antara teks dan latar belakangnya untuk memastikan keterbacaan bagi orang dengan penglihatan rendah atau buta warna. Level AA membutuhkan minimal 4,5:1 untuk teks normal dan 3:1 untuk teks besar. Level AAA adalah standar yang ditingkatkan yang membutuhkan masing-masing 7:1 dan 4,5:1.
AA vs AAA - mana yang harus Anda targetkan?
AA adalah minimum hukum untuk sebagian besar regulasi aksesibilitas (termasuk EN 301 549 di Eropa dan Section 508 di AS). AAA adalah standar emas - lebih sulit dicapai tetapi direkomendasikan untuk teks isi dan antarmuka kritis. Sebagian besar tim menargetkan AA untuk semua teks dan AAA untuk teks isi jika memungkinkan.
Apa yang dimaksud dengan "teks besar"?
WCAG mendefinisikan teks besar sebagai 18pt (24px) atau lebih besar dengan bobot normal, atau 14pt (18,67px) atau lebih besar dengan bobot tebal. Teks besar mendapat manfaat dari rasio kontras yang lebih longgar (3:1 untuk AA) karena ukurannya sendiri membantu keterbacaan. Headline dan teks display biasanya memenuhi syarat; sebagian besar teks isi tidak.
Cara menggunakan alat ini
Pilih warna teks dan warna latar belakang Anda menggunakan pemilih warna atau ketik kode hex langsung. Rasio kontras diperbarui seketika dan semua empat pemeriksaan WCAG menampilkan Pass atau Fail secara real time. Gunakan tombol Swap untuk membalik warna. Pratinjau langsung menampilkan bagaimana kombinasi Anda terlihat pada teks sebenarnya.