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.
The last two rows of this table (blue/green and yellow/purple) both pass the WCAG 2.0 AA Luminosity test.
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 |