Kleurcontrastcontrole

Zo doe je het

1. 1
   Vul de velden in

   Typ je getallen of kies de opties die je nodig hebt.

2. 2
   Bekijk het resultaat

   Het antwoord wordt meteen bijgewerkt als je een waarde wijzigt.

3. 3
   Gebruik het

   Kopieer het resultaat of noteer het. Er wordt niets ergens naartoe gestuurd.

About this tool

Enter a text colour and a background colour as hex codes. You see the contrast ratio and whether it passes the WCAG 2 levels: AA needs 4.5 to 1 for normal text and 3 to 1 for large text, AAA needs 7 to 1 and 4.5 to 1. Good contrast helps everyone, especially people with low vision.

When to use it

Check text and background colours against WCAG contrast rules.

Tips

Aim for 4.5:1 for normal text and 3:1 for large text.

Privacy

Everything runs in your browser, so your data is not uploaded or stored.

Uitgewerkt voorbeeld

With the boxes at their starting values (Text colour (hex): #1f2937; Background colour (hex): #ffffff), the tool shows: AA, normal text (4.5 : 1): Pass; AA, large text (3 : 1): Pass; AAA, normal text (7 : 1): Pass; AAA, large text (4.5 : 1): Pass; Interface parts and icons (3 : 1): Pass; Contrast ratio: 14.68 : 1. Change any box to see your own numbers. The result updates as you type, and nothing leaves your browser.

Tips voor het beste resultaat

Controleer elk veld voordat je een resultaat vertrouwt, want één verkeerd cijfer verandert het hele antwoord. Gebruik de exacte getallen van een loonstrook, factuur, certificaat of contract en noteer de datum waarop je rekende. Tarieven, drempels en regels veranderen af en toe, dus beschouw het resultaat voor belasting, kosten en juridische zaken als een schatting en controleer het met de officiële bron die op deze pagina staat. Je kunt zoveel scenario's proberen als je wilt; er wordt niets opgeslagen of verzonden en de pagina vernieuwen wist de velden.