Over deze tool
Controleer de kleurcontrastverhoudingen tussen voorgrondtekst en achtergrondkleuren volgens de toegankelijkheidsrichtlijnen van WCAG 2.1. Voer kleuren in als hexadecimale codes, RGB-waarden of HSL-waarden en bekijk direct de contrastverhouding en de geslaagde/mislukte resultaten voor WCAG AA- en AAA-compatibiliteit bij zowel normale als grote tekstgroottes.
Veelgestelde vragen
- Welke contrastverhouding is vereist om aan WCAG te voldoen?
- WCAG AA vereist 4,5:1 voor normale tekst en 3:1 voor grote tekst (18pt+ of 14pt+ vetgedrukt). WCAG AAA vereist 7:1 voor normale tekst en 4,5:1 voor grote tekst. De maximaal mogelijke verhouding is 21:1 (zwart op wit).
- Waarom is kleurcontrast belangrijk?
- Voldoende contrast zorgt ervoor dat de tekst leesbaar is voor gebruikers met slechtziendheid, kleurenblindheid of gebruikers die naar schermen kijken in fel zonlicht. Het is voor veel websites ook een wettelijke vereiste onder de ADA- en EU-toegankelijkheidsregelgeving.
- Wat wordt in WCAG als 'grote tekst' beschouwd?
- Grote tekst wordt gedefinieerd als 18pt (24px) en hoger voor normale tekst, of 14pt (18,66px) en hoger voor vetgedrukte tekst. Voor grote tekst gelden lagere contrastvereisten omdat deze van nature gemakkelijker te lezen zijn.
- Controleert deze tool het contrast voor niet-tekstelementen?
- WCAG 2.1 vereist een contrastverhouding van 3:1 voor UI-componenten en grafische objecten (knoppen, pictogrammen, formuliervelden). U kunt deze tool ook gebruiken om deze te verifiëren: voer gewoon de component- en achtergrondkleuren in.