Kleurcontrast Controle

Test de contrastverhouding tussen voor- en achtergrondkleuren om toegankelijkheid te garanderen.

1.00:1
Contrast
Fail
Zeer slecht

Normale tekst

AA (4.5:1)
AAA (7:1)

Grote tekst

AA (3:1)
AAA (4.5:1)
Black
#000000
Black
#ff6840

Snelle oplossingen

Aa

Voorbeeld Titel

De snelle bruine vos springt over de luie hond

Voorbeeld van kleine tekst (12px)

Tekst
#000000
Achtergrond
#ff6840

WCAG-standaarden

Level AA

Minimale contrastverhouding van 4,5:1 voor normale tekst en 3:1 voor grote tekst. Vereist voor de meeste websites.

Level AAA

Verbeterde contrastverhouding van 7:1 voor normale tekst en 4,5:1 voor grote tekst. Aanbevolen voor optimale toegankelijkheid.

Onvoldoende contrast voor alle tekstgroottes - voldoet niet aan de WCAG-normen.

Kleurcontrast Controle

Bereken de contrastverhouding van tekst- en achtergrondkleuren.

Kies een kleur met de pipet voor tekst en achtergrondkleur of voer een kleur in hexadecimale RGB-indeling in (bijvoorbeeld #259 of #2596BE). Je kunt de schuifregelaar aanpassen om de kleur te selecteren. De Web Content Accessibility Guidelines (WCAG) hebben een specifieke richtlijn om uit te zoeken of tekst leesbaar is voor ziende gebruikers. Dit criterium maakt gebruik van een bepaald algoritme om kleurencombinaties in vergelijkbare verhoudingen in kaart te brengen. Met behulp van deze formule stelt WCAG dat een kleurcontrastverhouding van 4,5:1 met tekst en achtergrond voldoende is voor normale tekst (body), en dat grote tekst (18+ pt normaal, of 14+ pt vet) ten minste een kleurcontrastverhouding van 3:1 moet hebben.

Belangrijkste kenmerken

  • Real-time berekening van contrastverhouding
  • WCAG AA & AAA nalevingscontrole
  • HSL-schuifregelaars voor fijnafstelling
  • Meerdere voorbeeldformaten

Geavanceerd gereedschap

  • Automatische kleurfixatie
  • Tekst- en achtergrondvoorbeelden
  • Detectie kleurnaam
  • Resultaten exporteren