2-Minute Tips: 5 Color Combinations to Avoid

In this issue of 2-Minute Tips, we’ll look at five color pairings to avoid in business (and sometimes fashion choices) and some substitutions. Warning: This post WILL hurt your eyes (sorry).

We use color to express almost everything visual in our lives. Clothing, cars, jewelry, fingernails, logos, websites, marketing materials—you name it, and we associate color. Unfortunately, not all color combinations are pleasant. Some color combinations can be challenging, or even impossible, to read, leading to eye strain, headaches, and anxiety.

#1 Black/Red

This one is a major no-no. For some who are color blind, black/red are indistinguishable from each other when paired. Even if you’re not color blind, your eyes must work much harder to read text or see images that are only black and red.

Tip

Try using white or light gray text on a black/red background. For color blindness, it appears black and white or high contrast grayscale. And for others, it’s just easier to see.

#2 Green/Red

A popular holiday choice this combo is another candidate for tired eyes. When you look at them, the text almost seems to vibrate. Your eyes must work too hard to make sense of what they see. And, for those that are red color blind or impaired, the contrast isn’t significant enough to see the text clearly.

Tip

Suitable options would be medium/dark red or green text on a white background or white text on a medium/dark green or red background. The contrast is much more significant, and your eyes don’t have to work as hard to read or make out designs.

#3 Blue/Yellow

Though blue/yellow color blindness is rare, this color combination is also difficult to perceive for anyone without this condition. Like red/green, blue/yellow doesn’t provide enough contrast. There are exceptions, but generally, it’s best to avoid them altogether.

Tip

Try white or very light grey on medium/dark blue backgrounds. Yellow backgrounds are more complicated. Try choosing a yellow that’s rich yellow instead of bright, very yellow.

#4 Blue/Red

Patriotic colors can be great in design, but when you add text, you get an unreadable, vibrating mess. The effect is unpleasant and, again, causes strain on the eyes. If you have issues with either the red or blue spectrum, the contrast may be non-existent, so you won’t see any text at all or, at best, only a faint outline.

Tip

White text on medium/dark blue and red backgrounds is best. Avoid the “electric” varieties of blue/red; they are unpleasant to look at and considered “old” in most applications. 

#5 Purple/Green

You might think it’s a great attention-getter. Well, that’s almost true. The problem is, you’ve just sacrificed readability and given your audience a visual shock (not in a good way). Also, people may see both purple and green as blue, red, or gray. They may not be able to see any text or design.

Tip

Use white text for medium/dark backgrounds or black/dark gray text on light backgrounds or the opposite. Depending on the design, you could use a very light purple text on a dark purple background or dark green text on a light green background—this holds for most colors. 

Color is a critical way to communicate to your audience. By avoiding these five color pairings, you can make sure you’re giving your audience legible and attractive materials.

As with nearly anything else, there are exceptions to the rule—as you will see in some of these examples. Check out the following for some inspiration:

https://designshack.net/articles/trends/best-website-color-schemes/
https://www.designwizard.com/blog/design-trends/colour-combination
https://webflow.com/blog/best-color-combinations