Kleurcontrastchecker
Controleer lokaal het contrast tussen voorgrond- en achtergrondkleur volgens de relatieve-luminantieformule van WCAG, beoordeel afzonderlijk gewone hoofdtekst en de drempel voor grote tekst van AA/AAA, en ondersteun het exporteren van rapporten.
De kleurcontrastchecker gebruiken
Kleurwaarden worden alleen in de huidige browser berekend voor relatieve luminantie en contrast; ze worden niet geüpload of opgeslagen.
Voer twee kleuren in
Gebruik de kleurkiezer of plak #RRGGBB-waarden om de voor- en achtergrondkleur in te stellen. Het voorbeeld wordt direct bijgewerkt.
Controlegrens
Klik op Controleren om afzonderlijk de geslaagde status te bekijken van gewone tekst AA, gewone tekst AAA en tekst in groot lettertype AA.
Controlerecord kopiëren
Na goedkeuring kunt u het rapport kopiëren of TXT downloaden. Het bevat kleurwaarden, verhoudingen en de resultaten voor elk drempelniveau.
Beperkingen en aandachtspunten
- De eerste versie accepteert alleen #RGB of #RRGGBB zonder transparantie; voor halftransparante kleuren moet eerst de daadwerkelijke compositieachtergrond worden bepaald.
- 4.5:1 is van toepassing op gewone hoofdtekst AA, 3:1 is van toepassing op grote tekst AA, 7:1 is de referentiedrempel voor gewone hoofdtekst AAA; controleer ook de tekengrootte, het lettergewicht en het contrast van niet-tekstuele elementen.
- De tool berekent alleen het contrast tussen één paar effen kleuren en simuleert geen verlopen, afbeeldingen, schaduwen, letterweergave of complexe achtergronden.
Veelgestelde vragen
Wat betekent 4.5:1?
Dit is de minimale contrastdrempel van WCAG voor gewone hoofdtekst volgens AA; de drempel voor hoofdtekst in groot lettertype is AA: 3:1.
Waarom kan transparante kleur niet direct worden beoordeeld?
De uiteindelijke kleur van een transparante voorgrond of achtergrond hangt af van de compositievolgorde en de onderliggende afbeelding; het is betrouwbaarder om eerst de werkelijk weergegeven effen kleur vast te stellen.
Betekent een geslaagde contrastcontrole automatisch dat de inhoud toegankelijk is?
Niet noodzakelijk. Controleer ook de tekengrootte, het lettergewicht, de status, de focus, niet-tekstuele componenten, afbeeldingsachtergronden en de weergave op het daadwerkelijke apparaat.