WCAG-kleurcontrastverhoudingcalculator
Meet de WCAG-contrastverhouding tussen een voorgrond- en achtergrondkleur om te bevestigen dat je tekst leesbaar en toegankelijk is.
Higher is more readable (max 21:1)
- 1
Fg relative luminance
0.2126×0,0103 + 0.7152×0,0103 + 0.0722×0,0103 = 0,0103Each sRGB channel is gamma-linearised (transfer function) then weighted per WCAG - 2
Bg relative luminance
0.2126×1 + 0.7152×1 + 0.0722×1 = 1 - 3
Contrast ratio
(1 + 0.05) ÷ (0,0103 + 0.05) = 17,40
Hoe werkt deze rekenmachine?
De WCAG-contrastverhouding is (lichtere luminantie + 0,05) / (donkerdere luminantie + 0,05), variërend van 1:1 tot 21:1. Streef naar minstens 4,5:1 voor normale tekst en 3:1 voor grote tekst om aan AA te voldoen, of 7:1 en 4,5:1 voor AAA. Voer twee hex-kleuren in om direct te controleren.
Formule
How this is calculated
Voer een voorgrondkleur (tekst) en een achtergrondkleur in hex in. Zowel de 3-cijferige verkorte vorm (#fff) als de 6-cijferige vorm (#ffffff) worden geaccepteerd, met of zonder voorloop-"#".
Elke kleur wordt omgezet naar zijn relatieve luminantie. De 8-bits kanaalwaarde wordt gedeeld door 255 en vervolgens gelineariseerd: als het resultaat s gelijk is aan of lager dan 0,03928, wordt het gedeeld door 12,92, anders wordt het ((s + 0,055) / 1,055) tot de macht 2,4. De gelineariseerde rode, groene en blauwe waarden worden gewogen met respectievelijk 0,2126, 0,7152 en 0,0722 en opgeteld tot luminantie L. De contrastverhouding is (Llichter + 0,05) / (Ldonkerder + 0,05), waarbij de term 0,05 omgevingslicht modelleert. Verhoudingen lopen van 1:1 (identieke kleuren) tot 21:1 (puur zwart op puur wit).
WCAG 2.1-drempels bepalen de slaag-resultaten: AA vereist minstens 4,5:1 voor normale tekst en 3:1 voor grote tekst (ruwweg 18pt, of 14pt vet); AAA vereist 7:1 voor normale tekst en 4,5:1 voor grote tekst. De berekening is symmetrisch, dus het omwisselen van voorgrond en achtergrond geeft dezelfde verhouding. Het beoordeelt alleen kleur en houdt geen rekening met dekking, anti-aliasing of overlappende lagen.
Veelgestelde vragen
Minstens 4,5:1 voor normale lopende tekst en 3:1 voor grote tekst (ongeveer 18pt regulier of 14pt vet). Voor het strengere AAA-niveau heb je 7:1 voor normaal en 4,5:1 voor groot nodig.
Nee. De formule gebruikt de lichtere en donkerdere luminantie ongeacht welke kleur je als voorgrond aanduidt, dus het omwisselen van de twee invoeren levert dezelfde verhouding op.
Puur wit heeft een relatieve luminantie van 1 en puur zwart 0. Wanneer je deze invult in (1 + 0,05) / (0 + 0,05) krijg je precies 21, het hoogst haalbare contrast.
Ook bekend als
TG we-Calculate Editorial Team. (2026). WCAG-kleurcontrastverhoudingcalculator [Online calculator]. TG we-Calculate. https://we-calculate.com/nl/calculator/color-contrast-ratio-calculator
TG we-Calculate Editorial Team. "WCAG-kleurcontrastverhoudingcalculator." TG we-Calculate. 2026. https://we-calculate.com/nl/calculator/color-contrast-ratio-calculator.
TG we-Calculate Editorial Team, "WCAG-kleurcontrastverhoudingcalculator," TG we-Calculate, 2026. [Online]. Available: https://we-calculate.com/nl/calculator/color-contrast-ratio-calculator
@misc{wecalculate_color_contrast_ratio_calculator, title = {WCAG-kleurcontrastverhoudingcalculator}, author = {{TG we-Calculate Editorial Team}}, howpublished = {\url{https://we-calculate.com/nl/calculator/color-contrast-ratio-calculator}}, year = {2026}, note = {TG we-Calculate} }
Heeft deze rekenmachine je geholpen?