Operatiivne

Värvikontrasti kontrollija

Reklaam

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
Sisestage allpool oma värvikombinatsioonid, et testida neid meie värvikontrastsuse kontrollijaga ja näha kohe, kas need vastavad juurdepääsetavuse standarditele.

Kuidas meie värvikontrasti kontrollija töötab

Sisestage oma esiplaani ja tausta värvid RGB kuueteistkümnendväärtuste abil või valige need otse värvivalijaga.

 

  • Reguleerige Alpha, et muuta esiplaani värvi läbipaistvust.
  • Kasutage liugurit Heledus, et muuta värv heledamaks või tumedamaks.

Seejärel arvutab meie tööriist kontrastsuse suhte ja kontrollib seda WCAG juhiste järgi:

  • WCAG 2.0 tase AA
  • Tavalise põhiteksti puhul vähemalt 4,5:1
  • Suure teksti puhul vähemalt 3:1
  • WCAG 2.1 (kasutajaliides ja graafika)
  • Vähemalt 3:1 ikoonide, ääriste ja muude liidese komponentide jaoks
  • WCAG-tase AAA
  • Tavateksti puhul vähemalt 7:1
  • Suure teksti puhul vähemalt 4,5:1

Suur tekst tähendab üht:

  • 14 pt (umbes 18,66 px) ja paksus kirjas või
  • 18 pt (umbes px) või suurem

Saate kasutada värvivalija pipetti, et hankida ekraanil ükskõik milliselt täpsed värvid.

Kui soovite, et lingid, mis põhinevad ainult värvil, paistaksid silma, kasutage meie värvikontrastsuse kontrollijat, et olla kindel, et need vastavad juurdepääsetavuse standarditele ja on kõigile hõlpsasti loetavad.