Pemeriksa Aksesibilitas Warna
Masukkan warna teks dan latar belakang (kode hex) untuk memeriksa rasio kontras dan kesesuaian dengan WCAG.
Ini adalah teks tebal berukuran besar.
Ini adalah teks ukuran normal.
21.00:1
Rasio Kontras
Teks Normal (AA)
Teks Besar (AA)
18pt+ or 14pt+ bold
Komponen UI (AA)
Buttons, form controls, etc.
Level AA (minimum required for accessibility compliance):
• Normal Text: Contrast ratio of at least 4.5:1
• Large Text: Contrast ratio of at least 3:1
• UI Components: Contrast ratio of at least 3:1
Level AAA (enhanced accessibility):
• Normal Text: Contrast ratio of at least 7:1
• Large Text: Contrast ratio of at least 4.5:1
Notes:
• "Large Text" is defined as 18pt or 14pt bold and above
• Logos and decorative elements have no minimum contrast requirement
• Text over images or gradients should be evaluated throughout the image
Cara menggunakan Pemeriksa Aksesibilitas Warna
- 1
Masukkan dua warna
Sediakan warna latar depan (teks) dan warna latar belakang sebagai kode hex, misalnya #1a1a1a dan #ffffff.
- 2
Periksa kontras
Klik Check Accessibility untuk menghitung rasio kontras antara kedua warna.
- 3
Tinjau hasil WCAG
Lihat lencana lulus atau gagal untuk AA dan AAA pada level teks normal, teks besar, dan komponen UI, serta lihat pratinjau langsungnya.
- 4
Sesuaikan seperlunya
Tukar warna atau ubah nilai hex hingga kombinasi memenuhi level WCAG yang dibutuhkan proyek Anda.
Pertanyaan yang sering diajukan
Apa itu rasio kontras dan apa yang dianggap baik?
Apa perbedaan antara AA dan AAA?
Mengapa teks besar lulus sementara teks normal gagal?
Format warna apa yang harus saya masukkan?
Apakah pemeriksa ini gratis dan apakah mengirim warna saya ke mana pun?
Alat terkait
Lanjutkan dengan alat praktis ini