Kleurcontrast-checker

Controleer het WCAG 2.1- en APCA-contrast van twee kleuren — of sleep een screenshot en zie precies waar dunne lijnen tekst slecht leesbaar maken. Alles lokaal, zonder uploaden.

Draait in je browser — geen upload
Large headline 24 px
Normal body text at 15 px — this is how the contrast reads in a paragraph.
Fine print at 12 px, the toughest test.
WCAG 2.1
AAAAA Normal text Large text
APCA

Advertentie Leaderboard · 728 × 90

Waarom een goedgekeurde ratio toch slecht leesbaar kan zijn

Elke contrastchecker neemt twee kleurwaarden en geeft een ratio terug. Dat getal is eerlijk over de kleuren — en blind voor al het andere. Een paar van 4,5:1 dat WCAG AA haalt, kan echt slecht leesbaar zijn wanneer het lettertype dun en klein is: wat het oog bereikt is niet de nominale tekstkleur, maar de anti-aliasing-mix van tekst en achtergrond die daadwerkelijk op het scherm is getekend. Hoe dunner de lijn, hoe groter het deel van elke letter dat uit die vervaagde randpixels bestaat — en het effectieve contrast zakt onder wat de twee hexwaarden beloofden. Die kloof dicht deze tool: naast de klassieke tweekleurencheck analyseert hij een screenshot van je echte interface en meet waar de lijnen het dunst zijn en welk effectief contrast daar precies heerst.

De tool toont altijd beide referenties: de WCAG 2.1-ratio, de huidige nalevingsnorm (4,5:1 voor normale tekst, 3:1 voor grote tekst), en de Lc van APCA, het perceptuele kandidaat-model voor WCAG 3, dat rekening houdt met de licht/donker-polariteit. In de praktijk is Lc 90 ideaal voor leestekst, Lc 75 het doel voor normale tekst, Lc 60 voldoende voor grote of vette tekst, en onder Lc 45 hoort helemaal geen tekst te staan. Spreken de twee waarden elkaar tegen, volg dan de meest pessimistische.

Laag effectief contrast is geen randgeval: de contrastgevoeligheid neemt af met de leeftijd en keldert bij staar, maculadegeneratie of astigmatisme; fel zonlicht en schermen met weinig helderheid maken het erger, net als tekst in hoofdletters. De correcties volgen rechtstreeks uit de metingen: lijnen onder 2 px → het fontgewicht verhogen (400 → 500/600); onvoldoende contrast → de tekstkleur donkerder maken; te kleine tekst → eerst vergroten. Gebruik voor betrouwbare waarden een screenshot in 2×-resolutie (Retina). De analyse draait volledig in je browser — het screenshot verlaat je apparaat nooit.

Art. 25 AVG

Privacy by design

Alle verwerking gebeurt in je browser. Je bestanden bereiken nooit een server — er is niets om op te slaan, te verzenden of te delen.

Meer in ons privacybeleid
Je apparaat
Verwerking in je browser
Resultaat op je apparaat
geen server

Veelgestelde vragen

Is deze contrastchecker gratis en wordt mijn screenshot geüpload?

Hij is gratis, zonder registratie, en er wordt niets geüpload. Zowel de kleurencheck als de volledige screenshot-analyse draaien in je browser — je kunt na het laden van de pagina de internetverbinding verbreken en alles blijft werken.

Wat is een goede APCA-Lc-waarde?

Als vuistregel is Lc 90 ideaal voor leestekst, Lc 75 het doel voor normale tekst, Lc 60 acceptabel voor grote of vette tekst, en onder 45 hoort geen tekst te staan. APCA houdt rekening met polariteit — licht op donker en donker op licht scoren verschillend, anders dan bij de WCAG-ratio.

Mijn kleuren halen WCAG AA — waarom markeert de analyse de tekst toch?

Omdat de ratio alleen de twee nominale kleuren beschrijft. Bij dunne gewichten mengt anti-aliasing het grootste deel van elke lijn met de achtergrond: het werkelijk getoonde contrast is lager. De analyse meet die echte pixels op de dunste plekken — dat is de waarde die je lezers ervaren.

Advertentie In-content · 336 × 280