We live in a world where new tech is constantly shaping the face of art and design, but sometimes it’s easy to get caught up in the hype. Over the next few weeks, instead of focusing on the tech of design, we’re going back to the basics to explore the technique of design.
If you’re just joining us, go catch up by reading the first part of this series before you continue. For those who are caught-up, you’ll remember that when we last talked we were discussing how humans perceive individual colors differently. Today, we’re going to talk about how that perception changes when colors interact with one another.
When it comes to color-based relationships, there are two types: harmonies and discordants. Harmonies, as you can probably guess, are colors that look good together. Of course, things aren’t quite that simple – there are actually quite a few different types of color harmonies our brains perceive as acceptable and pleasing. All of these harmonies, however, are systematically based on the color wheel – that’s right, this one:
You remember that from primary school, right? Well, it just so happens that it’s the perfect tool for explaining color relationships, and you might remember our first example – the Complementary Color Harmony – from your younger days as well.
These, quite simply, are colors that live across the way from each other on the color wheel. You’ve seen these all over – in fact, you’re about to see a whole lot of one with the Christmas season coming up:
The second type of harmonious relationship – the Split-Complementary Harmony – is a close cousin to the first. With this harmony, you’d be combining three colors – essentially, you’re mixing a color and the two colors adjacent to the one across from it. It sounds a little confusing, but it’s actually quite simple:
The third type of harmony also mixes three colors, and it’s called a Triadic Harmony. You remember the concept of an equilateral triangle from geometry, right? Well, if you took that triangle, shrunk it down to fit inside your color wheel, and then mixed the three colors that lay at the points of the triangle, you’d have a triadic harmony:
The next type of harmony is the Analogous Harmony. This relationship describes the act of mixing a color and the two colors adjacent to it together. Often this creates a very uniform aesthetic that is well-suited to indicating subtle differences in a design:
Hue, Chroma, and Value
The last type of harmony is called a Monochromatic Harmony, and it’s a bit different from the others. All of the other harmonies describe the relationships between different colors, but Monochromatic Harmonies only use a single color. This sounds weird, I know, but hear me out.
Instead of mixing multiple colors, you’d actually be mixing multiple shades of the same color. But light red and dark red are different colors, you say? Well, not technically – here’s where the science comes in (you knew we’d get here eventually)!
When people think of the word “color” they generally think in terms of red or pink, and blue or navy blue. Well, what would you say if I told you that pink and red are actually the same color? Don’t believe me? Consider this:
A “color” as we perceive it is made up of three different characteristics. These are a color’s Hue, its Chroma, and its Value.
Hue, for all intents and purposes, can be described as the “color” of a color. More specifically, a color’s hue describes exact the wavelength (or at least our perception of the wavelength) of light that creates the color that we’re referring to. For instance, the color red falls at one specific place on the spectrum, and only at that place – you might remember this from Part 1, but here’s an image of the visible light spectrum just in case:
Notice how the color “pink” isn’t anywhere on that spectrum? Well, that has to do with our second trait, the Chroma. If you do any design or video work, you likely already know the term Chroma by a different name – Saturation. Essentially, a color’s chroma refers to how much of the hue exists within the specific “color” that we’re looking at.
Remember how I said that red and pink were the same color? Well, “pink” is just “red” minus some of the chroma:
The last trait, Value, refers to the brightness of the color, and it’s not so much a choice as it is a consequence.
Different hues naturally possess varying degrees of brightness, and chroma can affect this too. In general, if you want to draw a viewer’s eye to a certain spot, you need to create contrast between your subject and their surroundings – value can help you do this. A color that is darker or radically different from the colors adjacent to it possesses more visual weight, and it will draw the viewer’s eye. However, choosing colors with values that are too similar can cause confusion – your viewers may not know where to look if everything looks the same!
So we’ve got our Harmonies covered, but I mentioned another type of color relationship earlier, and it’s vitally important! A Discordant is a color relationship that does not fall into any of the above categories. Thus, it will look odd or discomforting to our eyes, and we certainly don’t want to use discordants unintentionally. Here are a couple of examples:
Discordants are actually really important anyone who crafts visual images, because they allow us to create feelings of unease within our audience.
So there we go – human beings have a gut-reaction to different combinations of colors. This can be vital to conveying messages though our aesthetics, but we’ll stop here for now.
Next time, we’ll be talking about specific colors and the feelings they evoke in our audience. Until then, sound off in the comments if you have any questions or feedback!