Kleurenblindheidsimulator voor screenshots en paletten
Kleurenblindheidsimulator
Kleurenblindheidsimulator: test een screenshot of palet in 8 soorten zicht | We.Inc
Bekijk een screenshot of kleurenpalet naast elkaar door de ogen van acht soorten kleurzienstoornissen. Markeert kleurparen die moeilijk te onderscheiden worden en stelt een veiligere tint voor. Draait in uw browser.
Een kleurenblindheidsimulator tekent kleuren opnieuw zoals mensen met een ontbrekend of zwak type kegeltje ze zien. Upload een screenshot of plak uw palet om het in één keer in acht soorten zicht te bekijken. De tool markeert ook kleurparen die voor de meeste mensen duidelijk verschillen maar voor anderen samenvallen, en stelt een lichtere of donkerdere vervanger voor.
De belangrijkste soorten kleurzienstoornissen
Soort
Wat er verandert
Vaak verward
Deuteranomalie en deuteranopie
Zwakke of ontbrekende groene kegeltjes
Rood en groen, bruin en groen, blauw en paars
Protanomalie en protanopie
Zwakke of ontbrekende rode kegeltjes; rood oogt donkerder
Rood en groen, rood en zwart
Tritanomalie en tritanopie
Zwakke of ontbrekende blauwe kegeltjes (zeldzaam)
Blauw en groen, geel en roze
Achromatopsie
Geen werkende kegeltjes (zeer zeldzaam)
Alles behalve helderheid
Twee manieren om te beginnen: sleep een screenshot van een pagina, grafiek of ontwerp hierheen, of plak een lijst met hexkleuren. Elke simulatie draait in uw browser en er wordt niets geüpload.
Sleep of kies een screenshot (PNG, JPG of WebP), of plak hexkleuren, één per regel of gescheiden door komma's.
De afbeelding of het palet wordt acht keer opnieuw getekend, één keer per soort zicht, met een gepubliceerd model van hoe kegeltjes reageren.
Bij paletten wordt elk paar onder elke simulatie vergeleken. Paren waarvan het verschil onder een kleine drempel zakt, worden gemarkeerd.
Elk gemarkeerd paar krijgt een voorgestelde vervanger: de tweede kleur lichter of donkerder gemaakt tot ze weer te onderscheiden is.
Laat kleur nooit het enige signaal zijn. Voeg ook een label, icoon, patroon of positie toe, wat ook is wat WCAG-succescriterium 1.4.1 vraagt.
Contrast in helderheid overleeft elke soort kleurenblindheid. Donkerrood naast lichtgroen blijft leesbaar; middelrood naast middelgroen niet.
Label lijnen in grafieken direct of varieer de lijnstijl, en kies paletten die zowel in helderheid als in tint verlopen.
Foutmeldingen in formulieren horen een icoon en tekst te hebben, niet alleen een rode rand.
Veelgestelde vragen
Hoe vaak komt kleurenblindheid voor?
Volgens het Amerikaanse National Eye Institute is rood-groenkleurenblindheid de meest voorkomende vorm, en die komt veel vaker voor bij mannen dan bij vrouwen. Bij mensen van Noord-Europese afkomst treft het tot ongeveer 1 op de 12 mannen en 1 op de 200 vrouwen. Blauw-geelvormen en volledige kleurenblindheid zijn zeldzaam.
Hoe nauwkeurig is de simulatie?
Ze gebruikt het model van Machado, Oliveira en Fernandes, dat breed wordt gebruikt en goed staat aangeschreven, met volle sterkte voor de -opie-vormen en een gematigde sterkte voor de -anomalie-vormen. Echte mensen verschillen: twee mensen met dezelfde diagnose kunnen iets anders zien, en schermen en verlichting veranderen ook dingen. Zie het als een sterke richtlijn, niet als een diagnose.
Kan ik een live website controleren via de URL?
Niet vanaf deze pagina. Browsers laten een site niet de pixels van een andere site laden en lezen. Maak een screenshot van de pagina (op de meeste systemen Shift + Cmd + 4 op een Mac of Win + Shift + S op Windows) en sleep die hierheen.
Betekent slagen voor een contrastchecker dat mijn kleuren veilig zijn voor kleurenblinden?
Niet helemaal. Contrastcheckers vergelijken de helderheid van tekst en achtergrond, wat iedereen helpt. Maar twee grafiekkleuren of twee statuskleuren kunnen elk slagen tegen wit en er voor iemand met deuteranopie toch hetzelfde uitzien. Controleer paren kleuren die van elkaar te onderscheiden moeten zijn, en dat is wat de paletcontrole hier doet.
Waarom rood en groen de meeste problemen geven
De rode en groene kegeltjes in het oog reageren op overlappende lichtbereiken. Als een ervan ontbreekt of verschoven is, verliest het brein het grootste deel van het verschil tussen rood, oranje, geel en groen, en komen die kleuren op één schaal van donker naar licht te liggen.
Daarom zijn statuskleuren in verkeerslichtstijl, rode en groene grafieklijnen en badges voor succes of fout de gebruikelijke problemen. Leg de betekenis vast in een woord of icoon en laat de twee kleuren verschillen in helderheid.
Hoe de paarcontrole werkt
Elke kleur wordt omgezet naar OKLab, een kleurruimte die zo is ontworpen dat gelijke afstanden er ongeveer even verschillend uitzien. De tool meet de afstand tussen elk paar vóór en na de simulatie. Een paar dat normaal duidelijk verschilt maar in een simulatie onder de drempel zakt, wordt gemarkeerd.
De drempel is een afweging voor kleine vlakke gebieden zoals grafieklijnen, legendastaaltjes en badges. Grote kleurvlakken zijn makkelijker te onderscheiden, dus een gemarkeerd paar kan prima zijn als twee secties over de volle breedte.
Normaal zicht
Alle drie de soorten kegeltjes werken.
Protanopie
Geen rode kegeltjes. Rood oogt donker en lijkt op groen.
Protanomalie
Zwakke rode kegeltjes. Een mildere rood-groenverwarring.
Deuteranopie
Geen groene kegeltjes. Rood en groen lijken op elkaar.
Deuteranomalie
Zwakke groene kegeltjes. De meest voorkomende soort.
Tritanopie
Geen blauwe kegeltjes. Blauw en groen, geel en roze worden verward.
Tritanomalie
Zwakke blauwe kegeltjes. Een mildere blauw-geelverwarring.
Achromatopsie
Geen kleurenzicht. Alleen helderheid blijft over.
Achromatomalie
Sterk verminderd kleurenzicht.
Kies een afbeeldingsbestand.
Die afbeelding kon niet worden gelezen.
Sleep hier een screenshot naartoe of klik om er een te kiezen. Hij blijft op uw apparaat.