Pemeriksa Kontras Warna WCAG

Evaluasi rasio kontras warna teks dan latar belakang sesuai dengan pedoman WCAG 2.1. Hasilkan penyesuaian warna yang mudah diakses secara instan.

HEX/RGB/HSL
HEX/RGB/HSL
Semuanya berjalan secara lokal di browser Anda.

Pratinjau Teks Langsung

Judul Besar (18pt Tebal / 24pt Reguler)

Ini adalah preview dari gaya teks tajuk besar.

Teks Normal (Di Bawah 18pt)

Lorem ipsum dolor sit amet, konsectetur adipiscing elit.

Rasio Kontras

18.6:1

Status Kepatuhan WCAG 2.1

Persyaratan WCAG AA
Teks Normal (4.5:1) PASS
Teks Besar (3.0:1) PASS
Persyaratan WCAG AAA
Teks Normal (7.0:1) PASS
Teks Besar (4.5:1) PASS

Pedoman WCAG 2.1

Verifikasi standar kontras dengan mudah untuk membangun antarmuka yang mudah diakses yang mematuhi pedoman Bagian 508, ADA, dan WCAG AA atau AAA.

Mesin Saran

Secara otomatis menyesuaikan warna secara berkekuatan di sepanjang koordinat HSL untuk menemukan alternatif terdekat yang memenuhi kriteria kontras.

Sepenuhnya Sisi Klien

Perhitungan dieksekusi secara lokal di dalam konteks browser Anda. Tidak ada warna, file, atau koordinat telemetri yang dikirimkan ke server kami.

Alat Warna Terkait

Konverter Warna HEX RGB HSL
Konversi warna dan sesuaikan koordinat kecerahan.
Pemilih Warna Gambar
Ekstrak palet warna dari maket desain.
Konverter Warna CSS
Konversi antara format CMYK, HSV, RGB, HSL, dan HEX.

Pemeriksa Kontras Warna

Hitung rasio kontras WCAG untuk warna latar depan dan latar belakang dan tunjukkan hasil ukuran teks umum.

Pengantar
Dua warna CSS yang valid dan teks pratinjau opsional.
output
Rasio kontras dengan indikator lulus atau gagal WCAG AA dan AAA.
Pembatasan yang nyata
Perhitungan hanya mencakup kontras luminansi; ini tidak mensertifikasi antarmuka atau memperhitungkan rendering font, gerakan, fokus, atau isyarat non-warna.
Privasi dan pengendalian data
dua warna CSS yang valid dan teks pratinjau opsional diproses dalam tab browser ini. Convertr tidak menerima atau menyimpannya; menutup atau memuat ulang halaman akan membersihkan status kerja kecuali alat tersebut secara eksplisit menawarkan unduhan lokal.

Bagaimana cara menggunakan alat ini

  1. Sediakan dua warna CSS yang valid dan teks pratinjau opsional di kontrol alat.
  2. Pilih pengaturan yang mempengaruhi rasio kontras dengan indikator lulus atau gagal WCAG AA dan AAA, lalu jalankan alat.
  3. Tinjau rasio kontras dengan indikator lulus atau gagal WCAG AA dan AAA sebelum menyalin atau mengunduhnya.

Mode kegagalan umum

Warna yang tidak valid tidak dapat diukur, dan transparansi tanpa latar belakang yang terselesaikan dapat membuat rasio tidak berarti.

Contoh yang berguna

Bandingkan teks #1f2937 pada #ffffff untuk melihat rasionya untuk teks normal dan besar.