Color

When it comes to visual work we do not pick color combinations arbitrarily, just because we like them or because we think that they look nice; instead we abide by certain rules. The most important of these is based upon the color wheel, and the second is the 60 - 30 -10 rule

That said, there is also a third way of putting together a color palette and for that we use photographs

Below you will find brief outlines and diagrams that show you how all this works. The videos above explain all of it in greater detail.

 

The color wheel

Although this technique of combining colors has been used for many millenia, and across many cultures, the one who formalized it in accordance with the laws of physics is Isaac Newton in 1704. 

The principle is that colors get selected from certain angles of a circle, around which the rainbow of colors has been placed. These angles are 180 degrees, 120 degrees, 90 degrees, and 60 degrees - all of which are values that divide the 360 degree circle into equal parts.  Angles which stand at opposite halves of the circle (180 and 120) will form contrasts, whereas angles which stand within one half of the circle (90 and 60) will create harmonies.

Further tones are then created not from the "hues"  themselves, i.e. not the color itself, but from higher / lower values of brightness and saturation.

Monochromatic

monochromatic-strio.png

Hues come from only one point on the wheel.

Complementary

complementary-strip.png

Hues come from 2 points that are 180 degree on the wheel.

Analogic

analogous-strip.png

Hues come from a 90 degree segment of the wheel.

Triadic

triadic-strip.png

Hues come from 3 points that are 120 degrees apart on the wheel.

Tetradic

tetradic-strip.png

Hues come from 4 points that are 90 degrees apart on the wheel.

complementary-wheel.png

The 60 - 30 - 10 Rule

 

This is an effective principle for creating a well balanced color palette. Although it's primary usage is in interior design, in recent times it has also increasingly been applied to other design fields. 

The application is quite simple — when you choose a new color palette, 60% of the palette should be dedicated to one color (usually this will be a neutral color), a  semi-neutral color makes up 30% of the palette, and then a third color which is usually quite contrasted to the first two is used for the remaining 10% of the design.

When it comes to graphic design in general, and more specifically to web design, the 60 will correspond to the color of the page itself, and the text that is placed on it. The 30 and the 10 will then be distributed among vectors, shapes and especially photographs and videos.

Creating a color palette from an image

 

This can also be a clever way of putting together a color palette, provided that you choose the photograph wisely. In other words, the colors in your photo should adhere to one of the color wheel combinations, and preferably also to the 60 - 30 - 10 rule. The photo on the left is like that: Lots of neutrals that fulfill the requirement of 60 - 30 - 10, and then the blues and the greens are analogic colors that come from a 90 degree segment of the color wheel.

Screenshot 2022-04-23 153117.png

Resources