Two-Color Combinations: A Toolkit

How I learned to combine colors more intentionally by focusing on the amount of stimulation they create

Ruxandra Duru
The Startup

--

Whether it was graphic design, illustration or lettering, color was a recurring theme in my work. In spite of my attraction to it, I used it as no more than a secondary tool.

Until I gave it my full attention.

In 2018, I started devouring anything color-related. Josef Albers taught me how colors influence each other. Johannes Itten opened my eyes to numerous types of color contrasts. Riccardo Falcinelli’s all-encompassing Cromorama fascinated me with scientific facts. Margrethe Odgaard opened up color to my other senses and less tangible emotions. Broader publications like Joyful made me appreciate vivid colors and introduced me to the word “stimulation”.

In parallel, I tiptoed into the world of color and minimal abstraction, encouraged by artists I was discovering at the time think Ellsworth Kelly, Agnes Martin, Anne Truitt or, again, Josef Albers. That daily practice led to an artist residency in Japan a year later where I exhibited similar artworks.

Examples of daily color explorations. Working digitally allowed me to be productive, completing over 1500 of them. See a larger selection here, or all of them here (scroll down a little, you‘ll know when you get there).

Back home, I started focusing on two-color combinations using colored paper. The more I tested, the more I became aware of the range of effects I could transmit through these simple combinations: some were particularly delightful and lifted my spirits every time I looked at them. Some made me cringe. Others were insipid. I could not help but wonder: is there a logic behind those attractive combinations that feel “just right”? Drawing from my readings and own observations, I finally drafted a tentative answer:

Approach two-color combinations based on the amount of stimulation they create, which can span from overexciting high to making-you-sleepy low. A promising approach, I thought, as I realized that most of my “just right” combinations avoided those two extremes and were found mostly in the central area between the two.

2,2” x 2,2” composition I have been testing combinations with. Before increasing the complexity, I hoped to understand how two colors work together first. I have compiled close to 500 of them by now.

This thinking process evolved into the “toolkit” I will share in the following lines.

Note: If “stimulation” sounds strange to you, swap it with “excitement” or even “information”.

The stimulation toolkit

How does one control the amount of stimulation of a two-color combination? Here are the three tools that I found most effectively do that:

◆ Overall color intensity.
◆ Hue distance in the color wheel.
◆ Light/dark — also called value — contrast.

It turns out that applying these familiar terms intensity, hue, valueto two colors at once was particularly useful.

Note: The techniques explained here specifically deal with combinations of colors that are in contact with each other. Also, I have not yet looked into monochrome combinations as well as palettes in which one of the colors is white, black or a completely desaturated grey.

Overall color intensity

Pretty quickly in my explorations it became obvious that combinations of intense colors — in other words, colors in their purest state, containing the greatest amount of “pigment” — were much more exciting to the eye than combinations of softer or duller colors.

Two methods can be used to reduce color intensity and, as a result, the stimulation it creates:

◆ Adding white or black (lightening or darkening).
◆ Adding grey (desaturating).

Two ways of reducing intensity: adding black or white (middle photo) or desaturating (right photo). From left to right: © Sean Robertson, © Erol Ahmed, © Phil Hearing / Unsplash.

Adding white or black

Lightening or darkening colors softens them and makes them less stimulating, while allowing them to keep their essence they avoid becoming completely dull.

Let’s say we begin with a combination of intense blue and orange and want to reduce its amount of stimulation. One could, for instance, add a moderate amount of white to both colors. Since what matters is the average intensity of both colors, one could also considerably lighten one of the two and leave the other untouched. And, of course, the more white is added, the less stimulating the duo becomes.

Though dark colors give off a different effect compared to pale ones, adding black also similarly reduces the amount of stimulation generated. Note that these dark colors pop more because they are placed against a white background.

One can also add black to one color and white to the other. Again, the more one does that, the less stimulating the combination becomes. This method will, however, drastically change the light-dark relationship of the pair, which, as explained in the third section, has its own implications.

Adding grey

The second and even more effective method to reduce the stimulation of an intense combination is to add grey to the colors, in other words, desaturate them.

The more we desaturate again, looking at the average of both colors’ intensitiesthe duller and less stimulating the pair becomes. However, as opposed to adding black or white, desaturating preserves the combination’s original light-dark relationship.

In summary, the more intense the two colors are as a whole, the more stimulating the combination. The further away they are from their purest, most intense state, the less stimulating it becomes. Specially if the colors are desaturated!

Note: Maximum color intensity can be hard to pinpoint. I have experienced that a color may appear very intense to my eyes until an even more intense version of it is placed next to it. It is also dependent on the material used as well as on whether the surface reflects light (like paper) or mixes colored light (like a screen).

Hue distance in the color wheel

Early in my art classes I learned how to place hues such as yellow, blue or red on a color wheel. This form of organizing color comes in handy, as stimulation can be adjusted by increasing or decreasing the distance between two hues on a color wheel.

For any hue, let’s say a blue-green, there are hues that sit far away, on the “other side” of the wheel. This creates combinations of hues that are very different from each other, and also very stimulating. The most distant hue is the complementary one, sitting right opposite to our selected hue, creating the most distinct — and stimulating — combination. Additionally, complementaries and close complementaries tend to further emphasize each other.

Conversely, placing our chosen blue-green next to hues that sit closer to it in the wheel creates combinations of hues that feel more related to each other and that together are less stimulating. Choosing hues that are the closest, directly on each side of the selected hue, will result in “analogous” palettes, the least stimulating of these combinations.

If these color pairs are placed on a stimulation spectrum that goes from high to low, the first one to go on the spectrum would be the most stimulating combination, the complementary scheme, followed by other palettes of the “distant hues” group. Then we would transition to the “close hues” group, and finish off with the least stimulating pairs, the analogous combinations.

In a few words, the further apart the two hues are on the color wheel, the higher the stimulation. The closer they are, the lower the stimulation.

Note: I have personally been using the Munsell color wheel for this purpose. However, the use other wheels will not create a dramatic difference in the results.

Light-dark contrast

At some point during my color self-education it was brought to my attention that not all colors are made equal at least to our human eyes. We perceive pure colors as having different values: a vivid yellow is much lighter than a vivid purple. Of course, black or white can be added to lighten or darken them but, as mentioned earlier, their intensity is then reduced.

Colors have different intrinsic values. Image: Greg Clayton / Harding University.

Either way, it was not obvious to me how significant value was at first. After all, I was focusing on color combinations, right? I eventually realized that, when I looked at a color combination, I was also perceiving a certain light-dark contrast which also influenced how exciting or notthat combination was. It was an additional layer of stimulation that needed to be taken into account.

Light-dark contrast can range from high to low, and it goes hand in hand with the amount of stimulation it creates: the stronger the light-dark contrast, the more stimulating the combination. The lower the contrast, the less stimulating it becomes.

As shown in the picture above, imagining color combinations in black and white will roughy indicate the amount of light-dark contrast. Another method is to pay attention to the boundary that separates the two colors, noting how crisp, or soft, it is.

Note: a certain amount of light-dark contrast is necessary when working with text or other shapes that need to be easily recognizable. Conversely, if the light-dark contrast is low, the whole will appear more flat and the shapes will be harder to identify.

Vibrating combinations

There is, however, a notable exception to the low light-dark contrast and low stimulation correlation: vibrating color combinations, which seem to generate the highest but also the most unpleasant kind of stimulation.

The recipe for vibration is placing intense and contrasting hues of similar value side by side. In cases of specially intense hues (think screens), even a mid-low light-dark contrast can generate discomfort.

In Cromorama, Falcinelli explains this phenomenon occurs because of the contradiction between what the “channel” that differentiates colors perceives“I see two completely different things, great!” — and the information received by the “channel” that distinguishes light differences “Wait, what are you talking about?”.

Vibration can therefore be softened by increasing the light-dark contrast between the two colors, but also by reducing their overall intensity or bringing the hues closer together.

The three tools “cheat-sheet”

To have something at hand to quickly refer to, I created a cheat-sheet where I synthesized each tool by marking both extremes minimal and maximal stimulationand noting the ideal parameters in each case. It looked like this:

For maximum stimulation, use:

◆ Intense colors.
◆ Contrasting hues.
◆ A strong light-dark contrast, except if I deliberately wish to generate a certain amount of vibration.

For minimal stimulation, use:

◆ Non-pure, dull, desaturated colors.
◆ Close hues.
◆ Low light-dark contrast.

This way, whatever the color combination I was creating, I had a quick reminder of different methods I could use to either push up or soften its stimulation levels.

Quick stimulation boost

Let’s say I needed to boost the vitality of the following color combination. Using the “cheat sheet” as a guide, I could:

  1. Increase the overall intensity by, for instance, saturating the dull yellow.
  2. Increase the distance between the two hues by, for instance, swapping the red with a purple, which is now sitting further away from its orangy yellow companion.
  3. Increase the light-dark contrast by, for instance, removing white from the reddish tone.

Quick stimulation softening

If I was in the opposite situation and I felt a combination was a bit hard on the eye, I could soften it by:

  1. Reducing the overall color intensity by, for instance, gently desaturating both colors.
  2. Reducing the distance between the two hues by, for instance, using a yellow-green instead of the original contrasting green.
  3. Reducing the light-dark contrast by, for instance, lightening the red. This will have the additional effect of reducing the overall color intensity (yay).

Of course, all three methods can be used at once and balanced to create different effects, as illustrated in the following section.

Examples

The following color combination sets roughly go from maximum to minimum stimulation and are approximately positioned on the spectrum. Each page shows five examples with similar parameters, meant to be looked at individually. The captions explain how the three tools are used to create that particular amount of stimulation.

All but the first image begin with contrasting hues, followed by closer ones. You may note how the further right we go, the lower the overall intensity, while hue distance and light/dark contrast are used to further control the stimulation.

The highest and also less pleasant type of stimulation: vibrating combinations. The recipe: intense, contrasting hues and minimal light-dark contrast. To use with caution and — you know this already — not with text.
Intense, contrasting hues and a bold light-dark contrast naturally present between these particular hues results in powerful stimulation while avoiding bothersome vibration.
If the previous examples were a bit too much, try hues that sit closer in the color wheel instead. Besides, these will inherently have less light-dark contrast between them, which will also help soften the overall effect.
The addition of black to one of the colors reduces the overall intensity. Still, these combinations remain strong on the eye because the a) hues are distant from each other and b) the addition of black has created a strong light-dark contrast that pushes the stimulation back up.
If we wish to tone down the amount of stimulation, closer hues can be used instead.
A similar situation: adding white to one of the two colors. The intensity is softened yet the resulting increase in light-dark contrast and the strong distinction between the hues keep the stimulation high.
Again, if the previous effect was too impactful, the hues can be brought closer together.
Lightening one color and darkening the other further soothes the overall intensity. However, the contrasting hues and strong light-dark contrast compensate for it, keeping the stimulation in the mid-high range.
Using hues that are sitting closer together will create a similar but softer effect.
Vibrating colors but gentler, more tolerable for the eyes. Almost all the ingredients for vibration are present: contrasting hues and minimal light-dark contrast. However, the overall intensity is reduced by the addition of white to both colors, which also reduces vibration.
Notice how that gentle vibration nearly disappears when the hues are brought close together. That closeness, combined with the lack of light-dark contrast, makes the colors appear to blend.
The original harsher intensity is more subdued here through the darkening of both colors. Still, these call your attention because of their contrasting hues and the moderate amount of value contrast.
If the previous examples were too eye-catching still, reduce, again, the distance between the hues.
Another way to soften high intensity is to introduce desaturation. Here it is applied to only one of the two colors, for a more unusual result. Stimulation-wise the contrasting hues and the presence of light-dark contrast help boost the impact of these combinations.
Removing the hue contrast calms the combinations even more. Note how the saturated color shines next to its quieter companion.
Another example of gentle vibration, in this case combining an intense color with a significantly desaturated — and in some cases lightened or darkened — one of similar value. Even if the hues are distant from each other, the reduction of the overall intensity correspondingly reduces the vibration.
Similar parameters as previous examples but using close hues for a calmer result.
Taking these pairs even further from their original, intense version by adding white to one color and grey to the second — a mix of two tools. However, we are again compensating for the reduction in intensity with a strong hue contrast and a pleasantly moderate light-dark contrast.
Note how the effect is softer if the hues are brought closer together.
Let’s dull the intensity even more: desaturating and adding extra black to create a medium light-dark contrast which, together with the well-distanced hues, help give these palettes back some strength.
More gentle options are created by using analogous or close hues instead.
If these pairs were judged by their average intensity only, they would be dismissed as bland. However, the contrast in hue and the particularly sharp light-dark contrast make these combinations bold in spite of their low intensity.
Bring the hues close together for a calmer effect. Note: these might appear to be monochromatic (they’re not!), I have noticed how significantly touching up the intensity makes it harder to recognize the original hue.
Even in combinations of mildly desaturated colors with very desaturated colors, also called “neutrals”, complementary and close complementary hues enhance each other and give these palettes a gentle liveliness. The moderate light-dark contrast gives them additional support.
With close hues, a lot of that liveliness goes away. The hushed average intensities of the combinations are only sustained by the presence of light-dark contrast.
Combinations of muted colors —moderately desaturated and, in most cases, lightened. The gentle light-dark contrast nudges the stimulation up but it is the strong hue contrast that mostly give them a boost.
An even softer stimulation is obtained by keeping the same previous parameters but using close hues instead.
Contrasting hues still bring each other out in spite of the scarce intensity. The strength of the palettes would be even lower, however, if it was not for the visible light-dark contrast.
Even more restrained combinations, nearly only sustained by light-dark contrast.
Drowsier options. No light-dark contrast, barely any intensity left. The only thing to hang on to is the subtly visible hue contrast.
If the hue contrast is removed too, we are left with examples that produce a minimal amount of excitement.

Conclusion

Of course, other factors not discussed here influence the impact of a color combination. Take area, for example: a highly stimulating pin on a jacket or a quiet palette applied to a whole room might be just what one needs. Also, all examples have been shown in an almost clinical setting: equal amounts of color, white background. What happens if the amounts are different? What if they are placed on black, grey or another color yet?

Associations with certain color combinations play an important role as well. A palette of blue and green, which might recall a natural scenery, could appear less exciting than an orange and a red of similar parameters, which one might unconsciously relate to fire or blood.

In spite of its limitations, I believe this method is a good starting point when approaching color combinations as it reduces the overwhelming amount of possibilities and allows one to circle in a more manageable number of options. More importantly, it forces the designer to be more intentional with the effect and mood she wishes to transmit.

And, going back to the question that sparked this journey “Is there a logic behind attractive combinations that feel ‘just right’?”, I found out that understanding stimulation better, and the different ways to skew it, led me closer to understanding beauty as well. At least my own idea of beauty: something not too harsh, yet not too dull.

--

--

Ruxandra Duru
The Startup

Ruxandra enjoys experimenting with color, beauty and atmosphere, then writing about it. More at ruxandra-duru.com