Operatiivne
Logi sisse / Registreeru
common.you_need_to_be_loggedin_to_add_tool_in_favorites
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
Sisesta esiplaani ja taustavärvid RGB kuusnurksete väärtustega või vali need otse värvivalijaga.
Sa võid:
- Reguleeri Alpha, et muuta esiplaani värv läbipaistvat.
- Kasuta heledusliugurit, et värv näeks heledam või tumedam.
Meie tööriist arvutab seejärel kontrastsuse suhte ja võrdleb seda WCAG juhistega:
- WCAG 2.0 AA tase
- Vähemalt 4,5:1 normaalse põhiteksti jaoks
- Vähemalt 3:1 suure teksti puhul
- WCAG 2.1 (kasutajaliides ja graafika)
- Vähemalt 3:1 ikoonide, ääriste ja teiste liidese komponentide puhul
- WCAG AAA tase
- Vähemalt 7:1 tavalise teksti jaoks
- Vähemalt 4,5:1 suure teksti jaoks
Suur tekst tähendab kas:
- 14 pt (umbes 18,66 px) ja paksus kirjas, või
- 18 pt (umbes px) või suurem
Värvivalija silmatilgutiga saab täpselt valida ekraanilt täpseid värve. See teeb päris disainide, nuppude või taustade testimise lihtsaks.
Kui lingid tuginevad ainult värvile, et silma paista, kasuta meie värvikontrasti kontrollijat, et veenduda, et need vastavad ligipääsetavusstandarditele ja on kõigile kergesti loetavad.