ALUSNA — Bagusnya dimulai di sini.
WCAG Color Contrast Checker
Periksa rasio kontras warna dan status WCAG AA atau AAA untuk teks, tombol, dan antarmuka.
Cara menggunakan WCAG Color Contrast Checker
Contrast Checker menghitung rasio antara warna depan dan latar serta menunjukkan status WCAG. Gunakan hasilnya sesuai ukuran dan ketebalan teks yang benar-benar dipakai dalam antarmuka.
Langkah penggunaan
- Masukkan warna teks dan warna latar persis seperti yang akan tampil di produk.
- Periksa status untuk teks normal, teks besar, dan kebutuhan target AA atau AAA.
- Jika gagal, ubah lightness salah satu warna sambil mempertahankan karakter palet sebisa mungkin.
Cocok digunakan untuk
- Teks dan latar
- Tombol
- Form dan status fokus
Catatan penting
- Kontras warna yang lolos tidak otomatis membuat ukuran font, hierarki, atau fokus keyboard ikut aksesibel.
- Periksa juga kondisi hover, disabled, error, dan dark mode—bukan hanya keadaan default.