Color Blindness Simulator
Bekijk elke kleur zoals waargenomen door mensen met kleurzichtafwijkingen — 6 typen gesimuleerd.
① Voer een HEX-code in of kies een kleur ② Simuleer 6 typen kleurenblindheid ③ Kopieer elke gesimuleerde HEX
Probeer een voorinstelling:
Wat is Kleurenblindheid en Waarom is het Belangrijk voor Ontwerp?
Kleurenblindheid (kleurzichtafwijking) treft ongeveer 8% van de mannen en 0,5% van de vrouwen. De meest voorkomende typen — deuteranopie en deuteranomalie — betreffen verwarring tussen rode en groene tinten. Het WCAG 2.1 SC 1.4.1-criterium vereist dat kleur niet het enige visuele middel is om informatie over te brengen. Deze simulator gebruikt het wetenschappelijk gevalideerde LMS-model (Viénot 1999).
Veelgestelde vragen
Kleurenblindheid is het onvermogen om bepaalde kleuren te onderscheiden door afwezigheid of disfunctie van kegelcellen in het netvlies. Het treft ongeveer 8% van de mannen en 0,5% van de vrouwen. De meest voorkomende vorm is deuteranomalie (verminderde groengevoeligheid).
De tool gebruikt het LMS-model (Viénot 1999-methode). Pipeline: HEX → sRGB [0,1] → lineair RGB (gamma-verwijdering) → LMS-kegelresponsen via Hunt-Pointer-Estevez matrix → afwijkingssimulatieMatrix → LMS → lineair RGB → sRGB → HEX.
Deuteranopie: M-kegels (groen) afwezig — groenen, roden en oranje lijken op elkaar. Protanopie: L-kegels (rood) afwezig — roden verschijnen zeer donker. Tritanopie: S-kegels (blauw) afwezig — blauw en groen worden verward met rood en roze.
Voer elke kernkleur van je UI in — primaire knoppen, statusindicatoren, grafieken, badges. Controleer bij elke simulatie of de kleur nog steeds de beoogde betekenis overbrengt. Als de gesimuleerde kleur niet te onderscheiden is, voeg dan een tweede signaal toe: icoon, patroon, label of rand.
WCAG 2.1 SC 1.4.1 (Niveau A): kleur mag niet het enige visuele middel zijn om informatie over te brengen. SC 1.4.3 (Niveau AA): het tekstcontrast moet minstens 4,5:1 zijn (3:1 voor grote tekst).
De veiligste combinaties behouden hoog luminantiecontrast ongeacht de tint. Blauw-oranje en blauw-geel werken voor de meeste afwijkingen. Rood-groen combinaties zijn het meest problematisch. Voeg iconen of patronen toe naast kleurcodering.
Deze tool simuleert één kleur tegelijk — ideaal voor het controleren van merkkleuren, paletitems en UI-sleutelelementen. Voor een volledige pagina, gebruik extensies zoals NoCoffee of Colorblinding, of de kleurfilters van het besturingssysteem.