Product Ideas Portal

Reference & guidance on color use for color vision deficiencies, AKA color blindness

Working in Vertical Solutions I've had a surprising number of issues related to colors, or more often hues of colors, that users reported usability problems with. Most were related to contrast, where the hues and colors used created problems for some people and affected whether certain items could be viewed. I'm not talking about providing color palettes for extreme cases or anything, just some guidance on basic design "things to think about" like not using certain color combinations with lighter hues for example.


People can always Google it and get info if they're already aware of the issues, but there is a lot of content to weed through, and also many just don't know or think about it. This is an area where a few minor design considerations can almost completely solve the problem.


These are a few pages I've used in the past that have been helpful to me - guidance has to be short, simple, and useful since most people don't care about color blindness and won't go much out of their way to design for it in UIs. I think providing visual examples like some of the sites below would be most effective in making the concepts more easily digestible for the masses.


Good visual examples and design 'punch lists':

https://www.secretstache.com/blog/designing-for-color-blind-users/

https://www.designmantic.com/community/website-design-guide-color-blind.php


Good reasoning to care about/spend time on designing for color blindness:

https://www.usability.gov/get-involved/blog/2010/02/color-blindness.html

https://econsultancy.com/considering-colour-blindness-in-ux-design-with-five-examples/

  • Guest
  • Apr 20 2021
  • Deferred to Next Gen
  • Attach files