In addition to the issues of contrast or color blindness, placing areas of brightly colored hues together can be hard for users with color vision to read. Bright colors cause an afterimage effect. With only one bright color, the after image is usually not bothersome, but with two bright colors together, the afterimages interfere with one another, causing a "visual vibration." This can be reduced by placing a neutral color between the two areas of bright colors or by making one of the colors a pastel or dark shade.

Some Vibrating Color Combinations (Avoid)

Below are some color combinations that can cause afterimage effects.

Note: It is possible for some of these combinations to pass minimial WCAG contrast tests. However, some users may find the pairing uncomfortable.

The last two rows of this table (blue/green and yellow/purple) both pass the WCAG 2.0 AA Luminosity test.

Some Vibrating Color Combinations
red/green

red on green

green on red

blue/orange

blue on orange

orange on blue

green/magenta

green on magenta

magenta on green

yellow/cyan

yellow on cyan

cyan on yellow

blue/magenta

magenta on blue

blue on magenta

orange/yellow

yellow on orange

orange on yellow (not so bad)

blue/green

green on blue

blue on green

purple/yellow

purple on yellow

yellow on purple

Top of Page