Pemeriksa Kontras Warna (WCAG)
Periksa apakah teks Anda mudah dibaca: pilih warna teks dan warna latar dan dapatkan rasio kontras WCAG 2.1 seketika, dengan lulus/gagal untuk AA dan AAA pada ukuran teks normal, besar, dan komponen UI. Pratinjau langsung menunjukkan persis seperti apa pasangan tersebut.
🔒 100% privat — file tidak pernah keluar dari browser Anda
Rasio kontras
—
Teks normal — serigala kelabu itu melompati anjing malas.
Contoh teks besar 24px
AA: 4.5:1 normal · 3:1 besar (≥18 pt atau ≥14 pt tebal) · AAA: 7:1 normal · 4.5:1 besar.
Cara menggunakan Pemeriksa kontras WCAG
- 1 Pilih warna teks dan warna latar (atau tempel kode HEX).
- 2 Baca rasio kontras dan putusan AA / AAA untuk teks normal, teks besar, dan komponen UI.
- 3 Sesuaikan sampai pasangan itu lulus — pratinjau langsung menampilkan kombinasi pada ukuran nyata.
Pertanyaan yang sering diajukan
Rasio kontras berapa yang saya butuhkan?
WCAG 2.1 mensyaratkan 4.5:1 untuk teks normal (AA), 3:1 untuk teks besar (18 pt / 14 pt tebal, AA) dan 7:1 untuk level AAA yang ketat. Komponen UI dan objek grafis membutuhkan 3:1.
Bagaimana rasio dihitung?
Luminansi relatif setiap warna dihitung dengan rumus WCAG (linearisasi sRGB, lalu jumlah berbobot) dan dibandingkan sebagai (L1 + 0.05) / (L2 + 0.05). Perhitungannya berjalan secara lokal saat Anda mengetik.
Pasangan saya gagal — apa yang bisa diubah?
Perbaikan tercepat: gelapkan warna teks, terangkan latarnya (atau sebaliknya), atau perbesar ukuran font agar ambang 3:1 teks besar berlaku. Tint/shade pada alat Konverter Warna membantu Anda menemukan tetangga yang lulus dengan cepat.