Tutorial: Color Theory


I'm happy to see a lot of return visitors and new visitors coming to my blog everyday.  Thank you for spreading the word!  Please keep coming back and telling your friends about this blog as well as my photography/design website BoomShot Studios

Today's tutorial is more of a lesson, or lessons, in color theory.  I've taken some of the best tutorials and quick guides on the subject that have helped me in my designing and broken it down into a crash course on color.

Color can either make or break your photos or design.  I've seen some amazing concepts that had everything going for them, only to be ruined by a certain color that clashed with the overall feel of the photo.  I'm guilty of that sometimes.

There's a lot of resources on the internet to help us not make those mistakes.

Ground Zero in this case is Kuler, by Adobe.

Kuler is "the web-hosted application for generating color themes that can inspire any project. No matter what you're creating, with Kuler you can experiment quickly with color variations and browse thousands of themes from the Kuler community." (1.)

I don't use this application too much when I'm doing photography since I'm trying to stay as close to the original as possible.  But when I'm designing CD art, photo manipulation, poster, or a logo design, Kuler is my Holy Grail.  Check it out.  You'll never design without it.

Now, this color word... what exactly is it?  The basics: color and light go hand in hand.  They would be that couple who compliment each other, hold hands, and finish each others sentences.  Without light, there could be no color, without color, we would have no light.

So what exactly is color composed of?  There are 3 different parts that make up color: Saturation, Hue, and Brightness.  That list is going to look familiar if you use the Hue/Saturation tool in Photoshop.  Saturation, is the amount of gray in a particular color.  A bright color that has very little gray in it, is considered highly saturated, while a color that has more gray is less saturated.  Hue is that actual color of something, and brightness is how much black or white is in the color.

This little diagram will help:

The S is saturation (amount of grey) B is brightness (+/- black) and H is hue (actualy color)

So there it is.  Color.

And now there's the color wheel, which introduces all sorts of exciting things called color harmonies.  As depicted in my illustration below, it's a lot of fun.

The color wheel is the circular organization of colors based on hue. This is based on the primary colors (red, yellow and blue) and shows the mixing between the said primary colors.

Now onto color harmonies (told you this would be a crash course!)

(image from enchantedlearning.com)

Monochrome (meaning "one color") color harmonies include only one color in different value (the lightness and darkness of a color) and intensity (the brightness or dullness of a color). An example of a monochrome color scheme could include any color mixed with white, gray, or black. For example, red, rose and pink (red mixed with white) are monochrome.

Adjacent colors (also called analogous colors) uses colors that neighbor each other on the color wheel. An example is a color scheme that includes various values and intensities of reds and oranges.

Colors opposite each other on the color wheel are called complementary colors. For example, violet and yellow are complementary colors. So are red and green, and blue and orange.

A single split complement uses a primary color plus colors on either side of its complement. An example is a color scheme that includes various values and intensities of greens, violet-reds and red-oranges.

A triad uses colors at the points of an equilateral triangle (three colors spaced equally on the color wheel). These are sometimes called balanced colors. An example of a triadic scheme could be red, blue, and yellow; green, orange, and purple, etc.

A double split complement (also called tetradic) uses two pairs of complements, one apart on the color wheel. An example is red, green, orange, and blue.

The BEST, and I mean THE BEST, online color harmony matcher is the Color Scheme Designer.

This program does it all, and does it well.  It's a lot like Kuler (mentioned earlier) except you can create your own palettes.  It creates real-time color harmonies.  It also gives the RGB number's so you can easily plug the color in to your design and get crackin'.

If you already have a picture that you want to create a design around, MailChimp has created an amazing online tool called Pictaculous.

What this program does it take your picture and finds the dominant colors and creates different color harmonies for you using Kuler and ColourLovers. It will give you the RGB number and you can download an adobe swatches well.  What's really cool with this program is you can use it for your iPhone as well!

Note:  There's a website for scrapbookers called Scrapbook.com that uses a similar technology that matches scrapbooking products to the colors in your photos.  Really impressive technology worth checking out.  It's called Scrap By Color.

Now, how can I use this in my photography?  Great question!  When you're color correcting your portraits, you can color match the background colors to harmonize with the skin tones, or the eye tones.  It really goes a long way when these things match.

Of course there's tons of other resources to help you understand color, and color harmonies better.  I'd suggest using Kuler, Color Scheme Designer, and Pictaculous in your next project.  It'll take a lot of the trial and error out of your next design!

1. http://www.adobe.com/products/kuler/

Tutorials/ReviewsMerek Davis