Why all designers need to understand color blindness


Given the question of how to deal with color blindness in graphic design, many people would be tempted to give a brusque answer: “Choose a different profession.”

As any professional designer should understand, it’s not that simple. Even if you (a designer) are not color blind, over 8% of your male clients are likely to be, as are 8% of their male target markets (color blindness is rarer in females — more like 0.5%). If your design work is unsightly or hard to read for this substantial group, you’ve made a pretty huge mistake.

And say you want to design but do happen to be color blind? Not a big deal. Learn a few tricks and you’ll be fine.

In this post, we’ll give pointers for non-color blind designers on how to consider a color blind audience, and tips for color blind designers on how to keep your colors straight. But first, a little background… and a test.

Are you color blind?


If you see the number 74 in the image above, you’re in the clear. If, like me, you see a 21 (or nothing), then we’ve got some bad news for you: you are red-green color blind. If you’re not convinced, you can take a full test here.

It is important to understand that color blindness does not equate seeing in black and white. That is monochromacy, which is extremely rare. In fact, color blindness typically refers to a reduced ability to distinguish between shades of certain colors — most commonly reds and greens; less commonly, blues and yellows.

These colors tend to blend into one another, resulting in perceptions that may look something like this:


The top version of Google’s logo has normal colors. The bottom version is adjusted to mirror how a red-green color blind person might see it.


The left version of Andy Warhol’s Marilyn Monroe grid has normal coloration; the right version is adjusted to mirror how a red-green color blind person might see it

Lots of famous leaders and creatives have been color blind, including Mark Twain, Bill Clinton, Mark Zuckerberg (rumor has it that Facebook first used blue as its highlight color because it was easiest for the founder to see) and even — although this claim is hotly disputed — Vincent Van Gogh.

van gogh

Mark Zuckerberg (photo by jdlasica) and, perhaps, Vincent Van Gogh were both color blind

You’re not color blind, but you still need to consider a color blind audience

As a normally sighted person, it’s hard to imagine what your work is going to look like to a color blind eye. And yet, this can make a tremendous impact.

Websites are a major concern because it’s crucial that they are legible and easy to navigate for all users. This image underscores the difference between a color blind-unfriendly hover, and a color blind-friendly one:

hover over

The top highlight, which is similar in tone to the normal button, is worst for a color blind audience; the middle is better, as it takes advantage of differences in brightness; the bottom is best, as it also adds a non-color component: a highlighted border

You wouldn’t want your logo to consist of colors that are clashing or indistinguishable to a color blind audience, either, would you? Or worse, a logo that is entirely invisible — as with some of the ones below:


These were apparently logos for 1) Bill Gardner, 2) Dennis Murphy, 3) Razoo and 4) Crema Cafe. None of them carries a particularly positive association for a color blind viewer, but 2 and 3 are difficult or even impossible to read! 

Additionally, consider these more specific areas where color is key:

Links: It’s common to highlight a hyperlink within a body of text using color alone.

Infographics: Color is crucial to the appeal and readability of infographics. It also often carries symbolic information.

Maps: Here too, color is often used to distinguish things like different subway lines or city districts.

Games: Color is often used to distinguish teams and direct gameplay.


Maps that rely too much on color can be very confusing for color blind viewers.

In order to avoid color blindness pitfalls, here are a few handy rules and approaches to consider:

  • Avoid the following color combinations, which are especially hard on color blind people: Green & Red; Green & Brown; Blue & Purple; Green & Blue; Light Green & Yellow; Blue & Grey; Green & Grey; Green & Black
  • Make it monochrome: Using various shades of a single color instead of multiple colors is of course the most surefire way to avoid color blindness issues. Today minimalism is all the rage, isn’t it?
  • Use high contrast: Color blind people can still perceive contrast, as well as differences in hue, saturation and brightness. Use these to your advantage (Hint: many color blind individuals report being able to better distinguish between bright colors rather than dim ones, which tend to blur into one another)
  • Use thicker lines: Some mildly color blind people are able to see a color, but only if there’s a sufficient “mass” of it. If a line of color is too thin, it won’t show up as the right color.
  • Don’t assume colors will signal emotions in and of themselves: If you’re using red to signal “bad,” “warning,” or “watch out,” consider adding another symbolic element to get the point across to color blind viewers.
  • Use texture instead: in maps and infographics, try using texture in addition to color to differentiate between objects.


Texture, in addition to tone, helps a color blind audience read something like an infographic.

Additionally, there are tons of resources that give you feedback about your color choices. Some of them even provide simulations of what your design would look like to a color blind eye! Check these out:

  • Colorblind Web Page Filter: type in a URL, select a type of color blindness, and their filter will show you what the web page looks like to someone with that issue
  • Vischeck: applied to files or web pages, it can either simulate color blind vision or try to correct images for color blind viewers
  • Newman services: another color blind simulation product
  • Color Laboratory: allows you to see how selected colors will appear next to one another, in various foreground/background combinations and to color blind viewers
  • Color Oracle: more color blindness simulation for Window, Mac and Linux
  • Sim Daltonism: a color blindness simulator for Mac only
  • Color contrast visualizer: helps you choose good color combinations in general

You’re color blind and ready to design!

Many graphic designers hide their color blindness like it’s some sort of shameful secret. Really, there’s no need. With a few simple technologies and a willingness to borrow the eyes of others from time to time, you’ll be absolutely fine. In fact, there’s an ever-growing community of color blind designers! Check it out:

  • We Are Colorblind: a website by color blind graphic designers that has articles about color blindness and reviews of various products (mostly apps) with respect to their color blind friendliness or unfriendliness
  • jdotreach: a proud color blind designer, who describes how he copes with his irregular vision in this blog post
  • Yoav Brill: a color blind designer/filmmaker created an inspiring short film made up entirely of dots resembling those from a color blind test

Yoav Brill’s film uses Ishihara color blind test dots to tell a story of difference. 

As far as color blind designing goes, each person has his or her own method, but it’s largely a matter of taking color combinations that you know look good, and keeping track of them with reference tags like the color’s hex value or Pantone code. The dropper tool in Photoshop will prove an indispensable resource in gathering your data, and you don’t need to worry about copying because color cannot be copyrighted.

Beyond that, here are a few other methods you can use:

  • The ColourAdd system: A system that pairs base colors with symbols, which can be combined in various ways to designate secondary colors. This is just one of many approaches one could take.


The ColourAdd system uses symbols to accompany colors, to help direct color blind viewers.

  • Visolve: software that corrects colors for color blind users
  • Vischeck: an alternative software that attempts to correct colors for color blind users

Are you color blind or do you take a color blind audience into consideration when designing? What are your methods?


Alex contributes from New York City on topics ranging from branding and typography to the history of design.

  • Margaret Welwood

    This is fascinating! I think my website did fine on the red-green test. What an interesting change it made to the cover!

  • Davidp

    Thanks. I’m 64 years into this life and I think this is the first article I’ve read on colorblindness from this point of view.

  • Ankit Singh

    I am new to this subject, I came across a feedback from an User Interface Expert to change a color combination of text on a web screen, we were developing. A lot of helpful information here. Thank you very much !!



  • http://WWW.pornhub.com Jacob


  • Arno S.

    Awesome article. I have often thought that there should be design guidelines for graphic artists to accommodate people who have different colour balance in their vision. It is very refreshing to see that this is finally happening.

  • Paul

    Why use ColourAdd, an alien and terribly noisy thing it seems to me, when you could just use regular icons?

  • Campbell

    Nice post.

    Adding symbolic elements is the crux of the solution.

    However, I have to say that- from an afflicted user point of view – simply changing colours often doesn’t help despite all the best intentions of the designer. For me, trying to interpret colour in any form is just really really tiring. Like reading a foreign language. Changing colour palette is often like changing from one language I don’t know to another language I don’t know.

    So, best solution is to forget trying to “fix” colours and include enough other cues to make things functional for everyone. Ie Size, shape, tips, text, colour.

  • Supaksirin Wongsilp

    Thanks This is useful. I’m an Asian female graphic designer. I’ve got a check last week. The doctor said I have “Colour Blindness”. I have no idea how this happens. Anyway, it’s not a big deal, makes me feel a little unique in a way. haha

  • LaurenG

    As a web designer, one thing that I always have to keep in mind is creating a smooth experience for the user (user experience design/UX). I effectively consider this an extension of ADA compliance. Making sites user-friendly, particularly for those who have trouble viewing sites the way others would, is the right thing to do. I feel that far too many web designers brush aside the issue of ADA compliance. I always try to make the extra effort to make my sites accessible to all, and I hope this becomes the norm among my peers. This is a fascinating article, not only because it explains to designer how to approach the issue of color blindness, but also because it explains how one may also become a designer, in spite of color blindness. I also love that there are so many valuable resources within the article for further reading.