Alat ini menggunakan formula luminans relatif rasmi WCAG, jadi hasilnya selari dengan pemeriksa WebAIM dan kebanyakan audit kebolehaksesan. Semua pengiraan berlaku dalam pelayar anda - warna anda tidak dimuat naik, dan tiada had penggunaan.
Semakan kontras warna
Berjalan sepenuhnya dalam pelayar anda - tanpa muat naik, tanpa pendaftaran.
Nisbah kontras
Lulusperlu 4.5:1
Lulusperlu 3:1
Gagalperlu 7:1
Lulusperlu 4.5:1
Besar = 18pt (24px), atau 14pt (18.66px) tebal.
Apa itu semakan kontras warna?
Semakan kontras warna mengukur nisbah kontras antara warna teks dan latar belakangnya, kemudian memberitahu sama ada ia memenuhi piawaian kebolehaksesan WCAG. Hasilnya ialah nisbah antara 1:1 hingga 21:1, dengan status lulus atau gagal untuk AA dan AAA bagi teks biasa dan teks besar.
Cara guna
- 1Masukkan warna anda. Taip kod hex, nilai rgb() atau nama warna CSS untuk teks dan latar belakang, atau pilih menggunakan pemilih warna.
- 2Baca nisbah kontras. Nisbah kontras dikemas kini secara langsung, bersama pratonton teks pada latar belakangnya.
- 3Semak lencana. Setiap lencana menunjukkan status lulus atau gagal untuk WCAG AA dan AAA bagi teks biasa dan teks besar.
Untuk siapa
- Pereka yang menguji warna jenama sebelum dihantar ke pasukan pembangunan.
- Pembangun front-end yang menyemak warna butang, pautan dan label terhadap WCAG AA.
- Juruaudit kebolehaksesan yang mendokumentasikan kegagalan kontras dengan nisbah tepat.
- Pasukan kandungan dan e-mel yang memastikan teks kekal mudah dibaca pada latar belakang berwarna.
Soalan lazim
Adakah semakan kontras warna ini percuma?
Ya - percuma sepenuhnya tanpa pendaftaran dan tanpa had. Ia berjalan dalam pelayar anda sahaja.
Apakah nisbah kontras yang diperlukan untuk WCAG AA?
WCAG 2.1 Tahap AA memerlukan nisbah kontras sekurang-kurangnya 4.5:1 untuk teks biasa dan 3:1 untuk teks besar. Tahap AAA menaikkan syarat itu kepada 7:1 untuk teks biasa dan 4.5:1 untuk teks besar.
Apakah yang dimaksudkan dengan teks besar?
Teks besar ialah sekurang-kurangnya 18pt (lebih kurang 24px) pada berat biasa, atau 14pt (lebih kurang 18.66px) apabila tebal. Teks besar dibenarkan nisbah kontras yang lebih rendah kerana huruf yang lebih besar lebih mudah dibaca.
Bagaimana nisbah kontras dikira?
Formulanya ialah (L1 + 0.05) / (L2 + 0.05), di mana L1 dan L2 ialah luminans relatif bagi warna yang lebih cerah dan lebih gelap. Luminans dikira daripada saluran merah, hijau dan biru sRGB mengikut definisi WCAG 2.x.
Adakah ia menyokong hex, RGB dan nama warna?
Ya. Boleh masukkan hex 3-, 4-, 6- atau 8-digit, nilai rgb() dan rgba(), atau mana-mana nama warna CSS seperti 'teal'. Warna juga boleh dipilih dengan pemilih warna asli.
Mengapa nisbah yang sama kadang-kadang lulus dan kadang-kadang gagal?
Nisbah yang diperlukan bergantung pada saiz teks dan tahap WCAG yang disasarkan. Nisbah 3.5:1 gagal AA untuk teks biasa tetapi lulus AA untuk teks besar, jadi sentiasa semak mengikut saiz dan tahap yang sebenar anda gunakan.