Operasional
Pemeriksa Kontras Warna
Iklan
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
21.00:1
WCAG Compliance
Normal Text
✓
AA Pass
✓
AAA Pass
Large Text (18pt+ or 14pt+ bold)
✓
AA Pass
✓
AAA Pass
UI Components & Graphics
✓
AA Pass
WCAG Standards
Normal Text
- AA: 4.5:1 minimum
- AAA: 7:1 minimum
Large Text
- AA: 3:1 minimum
- AAA: 4.5:1 minimum
UI Components
- AA: 3:1 minimum
Common Combinations
Black on White
White on Blue
White on Dark Gray
Masukkan kombinasi warna Anda di bawah untuk mengujinya dengan pemeriksa kontras warna kami dan langsung melihat apakah kombinasi tersebut memenuhi standar aksesibilitas.
Cara Kerja Pemeriksa Kontras Warna Kami
Masukkan warna latar depan dan latar belakang menggunakan nilai hex RGB, atau pilih langsung dengan Pemilih Warna.
- Sesuaikan Alpha untuk mengubah seberapa transparan warna latar depan.
- Gunakan penggeser Terang untuk membuat warna terlihat lebih terang atau lebih gelap.
Alat kami kemudian menghitung rasio kontras dan memeriksanya berdasarkan pedoman WCAG:
- WCAG 2.0 Tingkat AA
- Setidaknya 4.5:1 untuk teks isi normal
- Setidaknya 3:1 untuk teks besar
- WCAG 2.1 (UI & grafis)
- Setidaknya 3:1 untuk ikon, batas, dan komponen antarmuka lainnya
- WCAG Tingkat AAA
- Setidaknya 7:1 untuk teks normal
- Setidaknya 4.5:1 untuk teks besar
Teks besar berarti:
- 14 pt (sekitar 18,66 px) dan tebal, atau
- 18 pt (sekitar px) atau lebih besar
Anda dapat menggunakan penetes mata di Pemilih Warna untuk mengambil warna yang tepat dari apa pun di layar Anda.
Agar tautan yang hanya mengandalkan warna terlihat menonjol, gunakan pemeriksa kontras warna kami untuk memastikan tautan tersebut memenuhi standar aksesibilitas dan tetap mudah dibaca oleh semua orang.