common.you_need_to_be_loggedin_to_add_tool_in_favorites
Penyemak Kontras Warna
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
WCAG Compliance
Normal Text
Large Text (18pt+ or 14pt+ bold)
UI Components & Graphics
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
Bagaimana Pemeriksa Kontras Warna Kami Berfungsi
Masukkan warna latar depan dan latar belakang anda menggunakan nilai hex RGB, atau pilih terus dengan Pemilih Warna.
Awak boleh:
- Laraskan Alpha untuk menukar sejauh mana warna latar depan telus.
- Gunakan gelangsar Cahaya untuk menjadikan warna kelihatan lebih terang atau lebih gelap.
Alat kami kemudian mengira nisbah kontras dan menyemaknya terhadap garis panduan WCAG:
- WCAG 2.0 Tahap AA
- Sekurang-kurangnya 4.5:1 untuk teks badan biasa
- Sekurang-kurangnya 3:1 untuk teks besar
- WCAG 2.1 (UI & grafik)
- Sekurang-kurangnya 3:1 untuk ikon, sempadan dan komponen antara muka lain
- WCAG Tahap AAA
- Sekurang-kurangnya 7:1 untuk teks biasa
- Sekurang-kurangnya 4.5:1 untuk teks besar
Teks besar bermaksud sama ada:
- 14 pt (kira-kira 18.66 px) dan tebal, atau
- 18 pt (kira-kira px) atau lebih besar
Anda boleh menggunakan penitis dalam Pemilih Warna untuk mengambil warna yang tepat daripada apa sahaja pada skrin anda. Ia memudahkan untuk menguji reka bentuk, butang atau latar belakang sebenar.
Untuk pautan yang bergantung pada warna sahaja untuk menonjol, gunakan penyemak kontras warna kami untuk memastikan ia memenuhi piawaian kebolehcapaian dan kekal mudah dibaca untuk semua orang.