Periksa rasio kontras dua warna dengan hasil lolos/gagal WCAG AA dan AAA untuk teks normal dan besar, plus pratinjau langsung.
Semua perhitungan dilakukan secara lokal di browser Anda. Tidak ada data yang meninggalkan perangkat Anda.
Rasio kontras adalah perbedaan antara kecerahan suatu warna dengan kecerahan latar belakangnya, dinyatakan sebagai angka seperti 7,2:1. Ini adalah metrik terpenting untuk keterbacaan teks: jika nilainya terlalu dekat, teks menyatu dengan latar belakang; jika jauh, teks menonjol. WCAG (Pedoman Aksesibilitas Konten Web) mengubah angka ini menjadi aturan lolos/gagal yang konkret untuk dua ukuran teks dan dua tingkat kepatuhan, persis seperti yang diperiksa tabel di atas secara real-time.
Rasio kontras mengukur seberapa berbeda dua warna dalam kecerahan yang dipersepsikan, dinyatakan sebagai angka dari 1:1 (identik) hingga 21:1 (hitam di atas putih). Jika teks dan latarnya terlalu mirip, sulit dibaca — terutama bagi penyandang penglihatan rendah atau buta warna, atau di layar yang terang. WCAG menentukan rasio minimum yang harus dipenuhi teks agar disebut aksesibel.
Setiap warna dikonversi menjadi nilai luminansi relatif memakai rumus WCAG: kanal R, G, dan B dilinearisasi dari sRGB, lalu diberi bobot (0,2126R + 0,7152G + 0,0722B). Rasio hasilnya (Lterang + 0,05) / (Lgelap + 0,05). Alat ini melakukan perhitungan yang persis sama di browser Anda.
WCAG menyebut teks besar bila ukurannya minimal 18 pt (24 px) dengan ketebalan biasa, atau minimal 14 pt (sekitar 18,7 px) dengan ketebalan tebal. Teks besar cukup butuh rasio minimum yang lebih rendah (3:1 untuk AA, 4,5:1 untuk AAA) karena glyph besar lebih mudah dibedakan daripada yang kecil.
AA (4,5:1 untuk teks normal) adalah batas minimum legal di banyak wilayah dan mencakup sebagian besar pengguna. AAA (7:1) adalah standar tertinggi untuk produk baru, dokumentasi, dan apa pun yang keterbacaannya krusial — nyaman bagi pengguna yang lebih tua dan penyandang gangguan penglihatan. Jika ragu, bidik AAA.
Tidak. Pemilih warna hanya menghasilkan warna yang sepenuhnya opak, jadi rasionya selalu antara dua warna solid. Jika desain Anda memakai nilai alpha, ratakan dulu di atas latar aslinya, lalu periksa pasangan warna hasilnya di sini.
Jika Anda baru saja memakai Pemeriksa kontras warna, langkah berikutnya yang wajar adalah Pembuat palet warna, Konverter warna, Generator gradient CSS, atau telusuri semua alat Alat file privat.