Kleurcontrast checker
Controleer of je kleurencombinatie voldoet aan de WCAG-richtlijnen. Vul twee kleuren in en zie direct of het contrast voldoende is — en voor welke situaties.
Niveau AA
Niveau AAA
Welke eis geldt wanneer?
Tekst en afbeeldingen van tekst moeten een contrastverhouding van minstens 4.5:1 hebben.
Grote tekst (18pt / 24px of groter, of 14pt / 18.66px vet) mag een lagere verhouding van 3:1 hebben.
Dit criterium geldt niet voor logo's, merknamen of decoratieve tekst.
UI-componenten (knoppen, formuliervelden, iconen) en grafische objecten die nodig zijn om de content te begrijpen
moeten een contrastverhouding van minstens 3:1 hebben ten opzichte van aangrenzende kleuren.
Denk aan de rand van een invoerveld, de kleur van een icoon, of de staat van een schakelaar.
Tekst moet een contrastverhouding van minstens 7:1 hebben. Grote tekst: 4.5:1.
Dit is het hoogste niveau en is niet wettelijk verplicht, maar wordt wel aanbevolen voor
optimale leesbaarheid — bijvoorbeeld voor langere teksten of een ouder publiek.
Overzicht drempelwaarden
| Wat | AA (verplicht) | AAA (aanbevolen) |
|---|---|---|
| Normale tekst (< 18pt) | 4.5:1 | 7:1 |
| Grote tekst (≥ 18pt / ≥ 14pt vet) | 3:1 | 4.5:1 |
| UI-componenten & iconen | 3:1 | — |
Kleurcontrast is slechts een van de 55 WCAG-succescriteria. Wil je weten of je hele website voldoet aan de toegankelijkheidseisen?
Vraag een audit aan of bel 085 5055 890.