Color Theory for Designers & Digital Photographers

Reason behind this article is that, a few days back, I bumped into an old acquaintance, who is building his career in skilled photography and he asked me that he is facing some drawback with color management.
The combinations of colors used in photography are just as important as framing, choosing orientation (horizontal and vertical compositions), depth of field etc. which often overlooked.
In this article I’ll try to cover all necessary color-related things for every designers and photographers to take their work to the next level.
Different colors can tell different things about your photograph or design. It has emotional and physiological effects. For example, some increase pulse rate, some is associated with calming nature, some to create harmony etc.

To understand the best how our brain perceives color, you need to understand some of the science of color, and the best way to start with it is Color Wheel.

COLOR WHEEL:

A color circle or color wheel is a visual presentation of colors organized according to their chromatic relationship. Most of us learn about color wheel in elementary school.

color, color management, color theory, designer, photography
There are three different types of color segments.

  1. Primary Color: Red, Yellow and Blue are known as Primary colors. They are the colors that cannot be obtain by mixing two or other colors together, and they form the base of a color wheel. All other colors are derived from these three colors.
    Photographers, since their medium is light, they prefer to use the RGB color mode, about this I’ll discuss on the color mode section below.
  2. Secondary Color: When we mix any two primary color in equal amount, the color we obtain is secondary color. For example: Red+Yellow=Orange, Yellow+Blue=Green, Blue+Red=Violet/Purple.
  3. Tertiary Color: Tertiary colors are the mixture of primary and secondary colors. For example: Red+Orange=RO, Yellow+Green=YG, Blue+Violet/Purple=BV/BP

Complimentary Color: Complementary colors are those which positioned opposite to each other in color wheel. For example:
Red+Green=RG, Blue+Orange=BO, Yellow+Violet/Purple=YV/YP. Below photograph is a good example of Complimentary color.

color, color management, color theory, designer, photography
These colors create high contrast and draw in the viewer.

Analogous Colors: Analogous color are those which located next to each other on a color wheel. Using these colors creates a more low contrast color scheme. In the photograph below you can see the good use of analogous color.

These colors create high contrast and draw in the viewer.

Monochromatic Colors: Monochrome is useful for images in which you do not want a single element to stand out by contrasting it with other areas.

color, color management, color theory, designer, photography

Though monochromes usually refer to as black and white, they are made up of shades from just one color as a result this type of colors create a soothing mood, which you can see in the below photograph.

color, color management, color theory, designer, photography
Warm Color & Cool Color:

color, color management, color theory, designer, photography

Warm Color: Red, yellow, Orange are known as warm colors. These colors excite the mind. They are indicative of fire warmth, sunlight and danger. Warm colors are vivid to nature and are bold and energetic.

color, color management, color theory, designer, photography
Cool Color: Blue, Green and Violet are known as cold color. Viewing these colors soothes the mind. They are relative to water, sky, greenery etc. Cool colors are basically soothing in nature. They give an impression of calmness.

color, color management, color theory, designer, photography
Hue, Saturation, and Luminosity:

A color can best described in three ways: its name, how pure it is, and its value of brightness or lightness.
While manipulated any photograph’s color using photo editing software like Photoshop, Lightroom etc., color systems divide all colors into three measurements i.e. Hue, Saturation & Luminosity.

color, color management, color theory, designer, photography, color mode, rgb, cmyk
Hue: In basic terms, Hue is what we normally name the colors i.e. red, yellow, green and blue, or a combination of any two of them.
Saturation: Saturation refers to the color’s intensity in other words the purity or vividness of a hue.
Luminosity: Luminosity (also known as Value or Lightness) is the measure of the amount of light (brightness or darkness) reflected from a hue.
In Photoshop Hue, Saturation & Luminosity are represented in the Color Picker in following way:

Color Modes:

Color mode or color management is one of the complex part of Digital Photography and even in designing. It is the process of coordinating colors from nature to camera to monitor to print, so that you can be sure of the color that will be produced in your final images
There are two different mode/methods, how color is applied in design i.e. RGB & CMYK.

RGB: Most of us already know that RGB stands for Red, Green & Blue. It is the most common computer graphics color model. The main purpose of the RGB color model is for the web purpose i.e. displaying of images/photographs in electronic systems, such as mobile, televisions and computers, where the colors we see on the screen are created with light using the RGB color method.

color, color management, color theory, designer, photography, color mode, rgb, cmyk
In this color mode the sum of all color creates white, which is the best indicator of light, where all the rays of lights reflects, and in elementary school we already read that when light falls on an object and reflect back to our eyes, than only we can see that object. And that is why RGB color mode is also known as Additive color mode.

There are 256 possible value of each of the three color in RGB color mode ranging from 0-253.
Also note that human eye has three forms of color sensors corresponding to red, greens and blues. And this is the physical fact that allows us to reproduce colors using just three pigments in a monitor.

CMYK: It is an acronym for Cyan, Magenta, Yellow & Black (Key), and pronounced as separate letters.

color, color management, color theory, designer, photography, color mode, rgb, cmyk

Some people says that the “K” in CMYK chosen because B already stands for Blue in RGB color mode, and “K” comes from the last letter in “black“. However, some people disagree with this because in four-color printing, printing plates of cyan, magenta and yellow are carefully keyed with the key of the black key plate.

Though in CMYK “K” stands for black, but remember key black is lighter in shade compared to original black. In the image below I’ve placed both black and key black next to each other, you can see the difference in shade between them.

color, color management, color theory, designer, photography, color mode, rgb, cmyk

 

CMYK color mode is highly used for print media. Because in this color mode the sum of all creates black. And that is why CMYK is also known as Subtractive color mode.

color, color management, color theory, designer, photography, color mode, rgb, cmyk

Why not RGB instead of CMY for printing?

This is where it gets a little bit complicated. Though in elementary schools we taught that we can make any color using Red, Yellow, and Blue, than why not for printing?

But the fact is that Magenta, Yellow and Cyan are the new and improved versions of their historic Red, Yellow, and Blue counterparts. In CMY each color overlaps two colors. For example, Cyan overlaps blue and green, Yellow overlaps green and red, and Magenta overlaps red and blue. With these overlapping colors we can subtracting light waves to create specific colors.

And in another as opposite to light CMYK is created with ink, It absorb Red, Green & Blue and when you absorb Red, Green and Blue you get Black as discussed before.

R-G-B = Black (Ink)

Why not CMYK instead of RGB for web?

Well in this case actually the answer is pretty straight forward and simple. As we discussed above RCB is used for web media created with light. To put it simply, on a monitor light is being emitted, which is important and when you emit or add Red, Green, and Blue they create White (light), whereas CMYK creates Black, which absorb light.

R+G+B = White (light)

This is the foundation for understanding why print media use CMYK color mode, while TVs and computer monitors using RGB color mode. And also remember CMYK can’t produce bright colors same as RGB, that’s why when you print any photograph you can see a difference in color between the photograph you clicked and the photograph you printed. It takes both time & knowledge to make sure your images look identical on screen and in print.

Hope you found this article useful & I would appreciate if you share it. You might also like “What Should Be The Color Of Your Logo?”, another article, in which I described about the meaning of different colors to boost your understanding of color.