Kleurcontrast controleren
Vergelijk twee ondoorzichtige HEX-kleuren met WCAG 2.2-tekstcontrastdrempels.
Een uitgewerkt voorbeeld proberen
Een uitgewerkt voorbeeld proberen
Kleurcontrast controleren
Controleer de eenheden en opties en gebruik vervolgens de berekenknop. Het voorbeeld is fictief; vervang de waarden voor uw eigen berekening.
Voorbeeldinvoer
- Tekstkleur
- #000000
- Achtergrondkleur
- #ffffff
Verwachte uitvoer
Contrastverhouding: 21,000000:1 WCAG 2.2 AA — normale tekst (4,5:1): Drempel gehaald WCAG 2.2 AA — grote tekst (3:1): Drempel gehaald WCAG 2.2 AAA — normale tekst (7:1): Drempel gehaald WCAG 2.2 AAA — grote tekst (4,5:1): Drempel gehaald De beoordeling gebruikt de volledige verhouding; de getoonde waarde is afgerond.
Berekent de relatieve luminantieverhouding en meldt of AA- en AAA-drempels voor normale en grote tekst worden gehaald. De beoordeling gebruikt de volledige waarde, niet de getoonde afgeronde verhouding.
Het hulpmiddel wordt geladen. De uitleg blijft beschikbaar zonder JavaScript.
Methode en beperkingen
Voer tekst- en achtergrondkleur in als HEX met 3 of 6 cijfers. Bekijk het voorbeeld en controleer het contrast. Drempels zijn 4.5:1 en 7:1 voor normale tekst, 3:1 en 4.5:1 voor grote tekst.
Grote tekst betekent minstens 18 pt normaal of 14 pt vet. Beoordeelt geen interfaceonderdelen, afbeeldingen, verlopen, transparantie of volledige paginaconformiteit. Het voorbeeld is illustratief en controleert niet de werkelijke tekstgrootte.
Deel deze tool
Alleen de openbare link naar de tool wordt gedeeld. Je invoer en resultaten blijven hier.
Toon de link om handmatig te kopiëren
In het kort
Berekent de relatieve luminantieverhouding en meldt of AA- en AAA-drempels voor normale en grote tekst worden gehaald. De beoordeling gebruikt de volledige waarde, niet de getoonde afgeronde verhouding.
Deze tool verwerkt je invoer in je browser. De berekeningen versturen je invoer en resultaten niet. De website zelf maakt netwerkverzoeken; bezoekgegevens gaan alleen met je toestemming naar Google Analytics.
Veelgestelde vragen
Wat telt als grote tekst?
Voor WCAG is dat minstens 18 pt normaal of 14 pt vet (ongeveer 24 px of 18,7 px). Dunne of ongebruikelijke lettertypen kunnen meer contrast nodig hebben.
Betekent een geslaagde controle dat mijn pagina toegankelijk is?
Nee. Alleen tekstcontrast tussen twee effen ondoorzichtige HEX-kleuren wordt gecontroleerd. Niet-tekstuele bediening, afbeeldingen, verlopen, letterstijl en andere toegankelijkheidseisen worden niet beoordeeld.
Wanneer verandert het resultaat?
Klik na het aanpassen van de invoer opnieuw op de uitvoerknop. Kopiëren gebruikt het laatst getoonde resultaat; een andere optie kiezen kan dat wissen. De verwerking gebeurt in je browser.
Bronnen en verwijzingen
- W3C: WCAG 2.2, minimumcontrast (Engels)
- W3C: WCAG 2.2, verhoogd contrast (Engels)
- W3C: toelichting bij criterium 1.4.3 minimumcontrast (Engels)
Deze bronnen documenteren de genoemde standaard of browser-API; ze bevestigen niet de juistheid van de uitvoer van het hulpmiddel.