Pamariksa kontras warna

Uji rasio kontras antara warna latar hareup sareng latar tukang pikeun mastikeun aksésibilitas.

Pariksa warna anjeun

Uji kombinasi warna pikeun mastikeun yén éta nyumponan standar aksésibilitas WCAG pikeun kabacaan téks.

5.73 ka 1
Kontras
AA
Hasil téks
Hadé

Dibandingkeun: #000000 dina #B6765B

Téks

16px, Regular (400)

Diitung salaku téks biasa.

  • AA (WCAG 1.4.3): sahenteuna 4.5:1

    Lulus
  • AAA (WCAG 1.4.6): sahenteuna 7:1

    1.27 deui diperlukeun

    Gagal

Komponén UI jeung grafik

Ikon, wates input, indikator fokus jeung bagian séjén anu kudu katingali pikeun ngagunakeun antarmuka.

  • AA (WCAG 1.4.11): sahenteuna 3:1

    Lulus
5.73 ka 1. Téks: lulus AA, gagal AAA. Komponén UI: lulus.
Kumaha ieu dipariksa
Warna anu dibandingkeun (sanggeus campuran)
Téks #000000 dina latar #B6765B
Luminansi relatif
Téks 0.0000, latar 0.2365
Rumus
(L1 + 0.05) / (L2 + 0.05) dimana L1 nyaéta luminansi warna anu leuwih caang jeung L2 luminansi warna anu leuwih poék.
Rasio tepat
5.7314 ka 1, ditingalikeun salaku 5.73 ka 1. Nilai anu ditingalikeun dipangkas, teu dibunderkeun, jadi teu pernah katingali leuwih alus tibatan sabenerna. Nilai tepat anu dibandingkeun jeung sarat.

Ukuran téks: 16px, Regular (400)

Diitung salaku téks biasa. Téks ageung sahenteuna 24px (18pt), atawa sahenteuna 18.67px (14pt) lamun kandel (beurat 700 atawa leuwih). Ukuran ditampilkeun dipotong, lain dibuleudkeun.

Diitung salaku téks biasa. Téks ageung sahenteuna 24px (18pt), atawa sahenteuna 18.67px (14pt) lamun kandel (beurat 700 atawa leuwih). Ukuran ditampilkeun dipotong, lain dibuleudkeun.

Aa
Judul pratinjau

Rubah coklat gancang ngaluncat ngaliwatan anjing malas

Conto téks leutik (12px)

Téks
#000000
Latar
#b6765b

Standar WCAG

Tingkat AA

Rasio kontras minimum 4.5:1 kanggo téks normal sareng 3:1 pikeun téks ageung. Diperyogikeun pikeun kalolobaan situs wéb.

Tingkat AAA

Rasio kontras ningkat 7:1 pikeun téks normal sareng 4.5:1 kanggo téks ageung. Disarankeun pikeun aksésibilitas optimal.

Pamariksa kontras warna

Itung rasio kontras tina téks jeung warna latar tukang.

Pilih warna nganggo selector warna keur teks jeung warna latar atawa ketik warna dina format heksadesimal RGB (mis. #259 atawa #2596BE). Anjeun tiasa nyaluyukeun slider pikeun milih warna. Pedoman Aksesibilitas Kontén Wéb (WCAG) gaduh pedoman khusus pikeun mastikeun naha teks tiasa dibaca ku pangguna anu awas. Kritéria ieu ngagunakeun algoritma khusus pikeun meunteun kombinasi warna kana rasio anu bisa dibandingkeun. Ngagunakeun rumus ieu, WCAG nyatakeun yén rasio kontras warna 4.5:1 kalayan teks sareng latar tukangna cukup pikeun teks regulér (badan), sareng teks ageung (18+ pt regulér, atanapi 14+ pt tebal) kedah ngagaduhan sahanteuna rasio kontras 3:1.

Fitur utama

  • Itungan rasio kontras sacara real-time
  • Pamariksaan patuh WCAG AA & AAA
  • Slider HSL pikeun nyaluyukeun
  • Beberapa format pratinjau

Alat canggih

  • Perbaikan warna otomatis
  • Sampel téks sareng latar tukang
  • Deteksi ngaran warna
  • Ékspor hasil

Patarosan anu sering ditanyakeun

Pikeun kapatuhan WCAG AA, téks normal butuh rasio kontras minimum 4,5:1, sedengkeun téks gedé (18pt atawa 14pt kandel) butuh 3:1.

WCAG AAA butuh rasio kontras nu leuwih luhur: 7:1 pikeun téks normal sareng 4,5:1 pikeun téks gedé, dibandingkeun sareng AA nu masing-masing 4,5:1 sareng 3:1.

Paké fitur perbaikan otomatis pikeun nyaluyukeun warna téks atawa latar tukang bari tetep nahan maksud désain anjeun, atawa sasuaikeun warna sacara manual maké slider HSL kalayan indikator visual nu nembongkeun zona optimal pikeun kapatuhan AA/AAA.

Zona hejo sareng tanda AA/AAA nembongkeun rentang optimal pikeun ngahontal kapatuhan WCAG. Petunjuk arah (Leuwih caang/Leuwih poék) mandu anjeun ka kontras nu leuwih hadé dumasar kana kombinasi warna anjeun ayeuna.

Tiasa, anjeun tiasa lebetkeun kode warna hex mana wae atawa maké pamilih warna pikeun milih warna sorangan. URL bakal diropéa sacara otomatis, jadi anjeun tiasa ngabagi kombinasi warna nu tangtu.