Kleurcontrastcontrole
Zorg dat je tekst en UI voldoen aan WCAG 2.1 contrastvereisten, een essentieel onderdeel van EAA/EN 301 549-conformiteit. Plak merkkleuren, bekijk combinaties en krijg duidelijke goedkeuring of afkeuring voor normale tekst, grote tekst en UI-componenten.
Vertrouwd door organisaties in heel Europa die werken aan naleving van WCAG- en EAA-richtlijnen
Color Contrast Checker
Example text preview
Contrast ratio: 8.67:1
Contrast Ratio:8.67:1
Wat is een contrastchecker en waarom gebruiken?
Voldoende contrast verbetert leesbaarheid voor iedereen, vooral voor gebruikers met verminderd zicht, kleurenzienstoornissen of op schermen van lage kwaliteit.
Controleer 1.4.3 Contrast (Minimum), 1.4.6 Contrast (Uitgebreid) en 1.4.11 Niet-tekstcontrast voor UI-componenten en grafiek.
De Europese toegankelijkheidswet verwijst naar EN 301 549, die op zijn beurt naar WCAG verwijst, contrast is een sleutelonderdeel in het voldoen aan verplichtingen.
Toegankelijke kleurpaletten creëren robuuste, leesbare interfaces die werken in lichte/donkere thema’s en op verschillende apparaten.
WCAG 2.1 contrastdrempels (snel referentie)
Minimaal ratio: 4,5:1 (tekst onder 24 px normaal / 19 px vet).
Minimaal ratio: 3:1 (≥ 24 px normaal of ≥ 19 px vet).
Minimaal contrast ten opzichte van aangrenzende kleuren: 3:1 (focusringen, formulierinvoeren, iconen etc.).
Test de contrastchecker
Voer voor- en achtergrondkleuren in (HEX). De tool berekent de contrastverhouding en toont geslaagd/niet geslaagd voor WCAG-niveaus. Resultaten worden bijgewerkt terwijl je typt.
Veelgestelde vragen
Veranderen de contrastverhoudingen in WCAG 2.1?
Vereist EAA WCAG contrast?
Wat wordt beschouwd als “grote tekst”?
Maak contrastcontroles onderdeel van je workflow
Voer contrastcontroles uit tijdens designreviews en code-reviews. Combineer met automatische scantechnieken om problemen op grotere schaal te ontdekken.