Operacionale
Kontrolluesi i kontrastit të ngjyrave
Reklamë
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
Futni kombinimet tuaja të ngjyrave më poshtë për t'i testuar ato me kontrolluesin tonë të kontrastit të ngjyrave dhe për të parë menjëherë nëse ato përmbushin standardet e aksesueshmërisë.
Si funksionon kontrolluesi ynë i kontrastit të ngjyrave
Futni ngjyrat tuaja të sfondit të parë dhe të sfondit duke përdorur vlerat hex RGB ose zgjidhni ato drejtpërdrejt me Zgjedhuesin e ngjyrave.
- Rregullo Alfa për të ndryshuar sa transparente është ngjyra e planit të parë.
- Përdorni rrëshqitësin Lightness për ta bërë ngjyrën të duket më e lehtë ose më e errët.
Mjeti ynë më pas llogarit raportin e kontrastit dhe e kontrollon atë sipas udhëzimeve WCAG:
- WCAG 2.0 Niveli AA
- Të paktën 4,5:1 për tekst normal të trupit
- Të paktën 3:1 për tekst të madh
- WCAG 2.1 (UI dhe grafika)
- Të paktën 3:1 për ikonat, kufijtë dhe komponentët e tjerë të ndërfaqes
- Niveli WCAG AAA
- Të paktën 7:1 për tekst normal
- Të paktën 4.5:1 për tekst të madh
Tekst i madh do të thotë:
- 14 pt (rreth 18,66 px) dhe të trasha, ose
- 18 pt (rreth px) ose më e madhe
Mund të përdorni pikuesin e syve në Zgjedhësin e ngjyrave për të rrëmbyer ngjyrat e sakta nga çdo gjë në ekranin tuaj.
Që lidhjet që mbështeten vetëm te ngjyra për të dalluar, përdorni kontrolluesin tonë të kontrastit të ngjyrave për t'u siguruar që ato përmbushin standardet e aksesueshmërisë dhe mbeten të lehta për t'u lexuar për të gjithë.