Kleurcontrast controleren: WCAG AA en AAA – gratis
Gratis, zonder account, werkt in je browser. Controleer of tekst leesbaar is op de achtergrond met de WCAG-contrastverhouding, zie de AA- en AAA-resultaten voor normale tekst, grote tekst en bedieningselementen, en krijg de dichtstbijzijnde kleur die wel voldoet.
Grote tekst ziet er zo uit
Normale lopende tekst ziet er zo uit. Pa’s wijze lynx bezag vroom het fikse aquaduct, en kleine letters, zoals een bijschrift, staan eronder.
Kleine tekst: bijschrift van 14px.
KnopContrastverhouding13.08:1
- Normale tekst, AA: GeslaagdLopende tekst, minstens 4,5:1
- Normale tekst, AAA: GeslaagdVerhoogd, minstens 7:1
- Grote tekst, AA: Geslaagd18pt+, of 14pt+ vet, minstens 3:1
- Grote tekst, AAA: GeslaagdVerhoogd, minstens 4,5:1
- Iconen en bediening, AA: GeslaagdKnoppen, randen, grafieklijnen: 3:1
Gebruikt de WCAG 2-contrastformule. Verhoudingen worden nooit naar boven afgerond, dus 4,49:1 telt niet als 4,5:1. Gecontroleerd op je apparaat.
Waarom Kleurcontrast controleren gebruiken
- 100% gratis
- Gebruik het zo vaak je wilt. Geen account, geen watermerk, niets te installeren.
- Privé vanaf de basis
- Wat je typt blijft in je browser en wordt nooit naar ons gestuurd.
- Werkt op elk apparaat
- Draait in je browser op Windows, Mac, Linux, Android en iPhone. Geen app nodig.
Zo gebruik je Kleurcontrast controleren
- Vul de tekstkleur en de achtergrondkleur in, of kies ze.
- Lees de contrastverhouding en de resultaten (voldoet of voldoet niet).
- Voldoet het niet, klik dan op een voorgestelde kleur die wel voldoet.
Veelgestelde vragen
- Welke contrastverhouding heb ik nodig?
- WCAG AA vraagt 4.5:1 voor normale tekst en 3:1 voor grote tekst en interface-onderdelen zoals knoppen en pictogrammen. AAA vraagt 7:1 en 4.5:1.
- Wat telt als grote tekst?
- Minstens 18 punt (24px) normaal, of 14 punt (ongeveer 18.7px) vet.
- Werkt het met transparante tekstkleuren?
- Ja. Een doorzichtige tekstkleur wordt eerst met de achtergrond gemengd voordat het contrast wordt gemeten.
- Waarom voldoet 4.49:1 niet?
- Volgens WCAG mogen verhoudingen niet naar boven worden afgerond, dus alles onder 4.5:1 voldoet niet aan AA voor normale tekst.
- Is Kleurcontrast controleren gratis?
- Ja. Het is gratis te gebruiken, zonder account en zonder iets te installeren.
Vergelijkbare tools
- HEX naar RGB omzettenZet een kleur in één stap om tussen HEX, RGB, HSL, HSV en CMYK, inclusief transparantie. Plak een code in elk formaat of kies een kleur, kopieer het formaat dat je nodig hebt en controleer het tekstcontrast.
- KleurenpaletgeneratorGenereer kleurenpaletten met één toetsaanslag, zet de kleuren die je mooi vindt vast, of bouw er een vanuit een basiskleur met analoge, complementaire of triadische harmonieën. Exporteer als CSS-variabelen, Tailwind of JSON.
- Kleurnaam vindenVind de naam van elke kleur: plak een HEX-, RGB- of HSL-code en krijg de dichtstbijzijnde CSS-kleurnamen, een eenvoudige omschrijving en de volledige lijst van 148 benoemde kleuren om door te bladeren.