Pemeriksa Kontras
Masukkan warna teks dan warna latar belakang untuk menghitung rasio kontras WCAG, dengan hasil lulus/gagal untuk AA dan AAA serta pratinjau langsung.
🔒 Diproses secara lokal di browser Anda
Loading…
Cara menggunakan
- Masukkan warna teks (foreground) di kolom pertama, atau pilih dengan color picker.
- Masukkan warna latar belakang di kolom kedua, atau pilih dengan color picker.
- Rasio kontras dan pratinjau kombinasi warna sebenarnya akan langsung diperbarui.
- Periksa keempat lencana untuk melihat apakah kombinasi ini lulus WCAG AA dan AAA untuk teks normal dan besar.
Fitur
- Mendukung format warna hex, rgb(), dan hsl()
- Menghitung rasio kontras luminansi relatif WCAG 2.x secara akurat
- Menampilkan lencana lulus/gagal untuk AA dan AAA pada teks normal dan besar
- Pratinjau langsung kombinasi warna teks di atas latar belakang sebenarnya
- 100% diproses di sisi klien — warna Anda tidak pernah meninggalkan browser
Pertanyaan yang sering diajukan
Bagaimana rasio kontras dihitung?
Rasio dihitung menggunakan rumus WCAG 2.x: kanal sRGB setiap warna dilinierkan, digabungkan menjadi nilai luminansi relatif, lalu rasionya adalah (L1 + 0.05) / (L2 + 0.05), dengan L1 adalah luminansi warna yang lebih terang. Rasio berkisar dari 1:1 (tanpa kontras) hingga 21:1 (hitam di atas putih).
Apa perbedaan antara AA dan AAA?
AA adalah tingkat kepatuhan standar yang ditargetkan sebagian besar situs; AAA adalah tingkat yang lebih ketat dan ditingkatkan. AA memerlukan 4,5:1 untuk teks normal dan 3:1 untuk teks besar, sedangkan AAA memerlukan 7:1 dan 4,5:1.
Apa yang dimaksud teks besar menurut WCAG?
Teks besar didefinisikan sebagai minimal 18pt (24px) dengan ketebalan normal, atau minimal 14pt (18,66px) tebal (bold). Guratan yang lebih besar dan tebal tetap mudah dibaca pada kontras yang lebih rendah, sehingga persyaratannya lebih longgar.
Format warna apa saja yang bisa saya masukkan?
Anda dapat mengetik kode hex (#000 atau #000000), string rgb()/rgba(), atau hsl()/hsla(), atau menggunakan color picker di samping setiap kolom.
Apakah alat ini menyimpan atau mengunggah warna saya?
Tidak. Semua penguraian dan perhitungan kontras dilakukan secara lokal di browser Anda menggunakan JavaScript murni. Tidak ada yang dikirim ke server atau disimpan.