Complementary Colors
What are complementary colors?
Complementary colors are two colors located opposite each other on the color wheel. For this reason, they’re also known as “opposite colors.” When placed next to each other, the contrast makes each color appear brighter than it does when standing alone.
There are three basic complementary color sets:
Red - Green
Blue - Orange
Yellow - Purple
How complementary colors are formed
Each pair of the basic complementary colors are composed of one primary color, and the resulting secondary color produced from mixing the two remaining primary colors. Primary colors are: red, blue, and yellow. Hence, in the red-green pairing, red is the primary color, while green is the secondary color derived from the combination of blue and yellow.
In all complementary color sets, there is one warm color and one cool color. Warm colors include orange, reds, and yellows. Blues, greens, and purples are considered cool colors. Placing one of each side-by-side produces the effect called simultaneous contrast, where each hue appears brighter.
You may also be interested in:
When to use complementary colors
Complementary colors are often used in art and web design to create greater contrast and emphasis. In today's digital world, it is particularly important to think about complementary colors when designing websites as they can help bring the visitor's eye to a particular focal point.
The right website color scheme can also influence how likely a user might be to convert or buy something. Other times, these opposite colors are mixed with each other to generate shadows, or even to cancel each other out by creating a neutral hue.
Complementary colors also have practical design uses. High contrast is a helpful tool to use to create greater visibility, such as choosing to make life jackets orange so they will stand out against a blue ocean.
It is important to note however, that complementary colors should not be used together for long periods of time as they can become overwhelming and create visual fatigue. To prevent this, complementary colors should be used sparingly and balanced with neutral colors or complementary shades of the same hue to create a more subtle and calming effect.
Complementary color examples
Complementary hues of red and green can be used together to create a high-contrast combination. Complementary colors are often found in nature, such as complementary blues and oranges seen in a sunset sky or complementary reds and greens seen in a forest.
A famous example of complementary colors in the art world is Claude Monet’s Impression, Sunrise (1872). The painting shows a tiny orange sun against a blue background, making each of those colors ‘pop’ off the canvas to catch the viewer’s eye.
Split complementary colors
This refers to using the color wheel to combine different colors that complement each other. It involves combining together in a color scheme more than two colors, and usually involves adding a 3rd or 4th too.
One way to do this is to choose your base color, then look opposite it in the color wheel, and take at the same time the two adjacent colors to this new opposite your base color.
For example, yellow can be found across from purple in the traditional color wheel. Orange and green sit alongside yellow in the wheel. This means that the split complementary colors for purple are - yellow, orange and yellow, green.
Learn more about how to make a website with our extensive guide.
Complementary colors FAQ
How can complementary colors be used best in design?
Complementary colors are often used in design to create visual interest and balance. They can be used to highlight specific elements, create depth and dimension, and make designs more vibrant and eye-catching. However, it's important to use them in moderation to avoid overwhelming the viewer.
What are some common examples of complementary colors?