Understanding Color In Your Designs

    November 28, 2006

Most people can grasp the basics of getting the right colors in the right places and ensuring that you are following simple principles when you are designing an item for print or designing a web site.

For those of you that don’t consciously know why you should be using what color where or are curious about better understanding the fundamentals and psychological aspect of color. This article is made for you and will help you better make that next logo, site design or print design.

Color wheelThe first step is of course understanding the color wheel, which is of course one of the primary aspects of design. The color wheel is a blending of one color to another as they could be made if you were using paint. As you well should know most of us aren’t using paint and are using CMYK or RGB colors for use in our design work. (There are others of course that I won’t discuss here.)

Color Models

Subtractive color modelCMY(K) color model is Cyan, magenta and Yellow. The reason black is in parenthesis is because it isn’t actually a part of the color model. In order to get white when designing with this model you would have 0% of cyan, magenta and yellow. When printing instead of mixing 100% of cyan, magenta and yellow to get black, black is actually used to get a more pure black and better define the shadow areas on a print job. As I’m sure you have picked up on, CMY(K) is an subtractive color model and made primarily for print jobs.

Additive color modelRGB color model is red, green and blue and is made of the primary colors that most of us are probably use to seeing. RGB is typically used for work on the computer and is a additive color model, meaning you have to have 100% of red, green and blue to get white. This is because your monitors use light to display everything you see on your screen. In order for it to product white it had to include red, green and blue. In order for the monitor to be able to product black it just doesn’t include any of the RGB colors and produces a clean black.

Basic color theory is also good to know as well, this can help you make other decisions on your design and to better understand the foundations of color.

Color Theory

Color temperature diagramIt is important but not completely necessary to know the differences between warm and cool colors. Basically Red is the warmest color and blue is the coolest color. There isn’t much more to it then that but I have included a diagram to give a basic idea. This diagram of course is not colorimetrically accurate but if you are interested in learning more about warm and cool colors you can see a more accurate diagram here.

Achromatic colors are colors that don’t have any chromatic content, basically unsaturated colors. The most obvious is of course black, white and gray. Knowing this also helps you to know that black will increase the saturation/brightness of colors that are paired with it and white will show off hues to an equal effect of the brightness.

Nuances are when you have any two colors that have the same saturation and lightness. Colors that are nuances are the easiest to combine regardless of hue. Most of the colors that are used in design are muted, earthy or pastel because they are easy to add other content to without disturbing the design.

Tints and shades are basic but still need to be touched on. Shades are created when adding black and tints are created when adding white. Both of which can drastically change the design that you are working on in different ways. You can easily create different color schemes entirely by using a different effect.

Most of that information is pretty basic but it is always good practice to start with the basics, it is easy to look over some of the more rudimentary things. When you do you can easily miss a vital step or idea that would better help you with the whole of your work.

Color Schemes

Moving on from the color wheel you step into color schemes and the three basic styles that are used to produce designs. These are the fundamentals of putting together any kind of design that is used publicly and they all fall into one of these three categories.

The first category is Analogous which is basically designing with colors that are adjacent to each other on the color wheel. If you pick any of the colors that are directly next to each other and make your design completely around and with those two colors then you have successfully created an Analogous color scheme. The only down fall of this scheme is that if you pick two colors that are too close to each other they can blend together and create a messy look for the design. You want to be sure that you are not just using a tint of the same color when you are using this color scheme.

The next type of color scheme is Complementary, which will consist of colors that are opposite of each other on the color wheel. This is what people mean when they speak of color contrasting with each other in order to make things stand out better. When you have designed a complementary design you create simultaneous contrast that will make each color look much more vibrant when placed side by side. There are two major down falls when using this color scheme, the first is that if you place the colors on top of each other this will create the illusion of movement. This is a bad ideas if you are using a complementary color scheme for text because it makes it very difficult to read. The second is that if you use colors like Cyan and Red you can create discord in your design. These colors that put together are known as discordants and can cause some nasty effects in a design if you decide to use them together.

The third and final color scheme is of course Monochromatic which is when you mix white with another pure color and create a tint of the color. It is similar to Analogous but different enough to be classified as its own color scheme into it self. One of the most classic examples of this is Target which uses red with white added to it throughout the web site.

Most of this can help you to understand different methods in which to use colors and labeling the way you design things better it can also of course help you with different ideas that you may have for a design by using warm colors or using a complimentary color scheme. These all lead you to understanding the ways in which the human eye sees and identifies color but may not help to understand how the human brain interprets color. Which oddly enough has a regional change based on culture and and history.

Color Psychology

In order to understand the psychology of color you must understand that it isn’t a science but an ongoing study of the effects that color has on the human psyche. Although some colors will universally spur different emotions within a certain region there may be varying results depending on age groups also.

Red is the most emotional color that will deliver any one of the following feelings to your visitors/readers depending on the mannerism you use it and intents you have to use it: Energy, strength, passion, eroticism, fire, lust, desire, blood, risk, war, danger, attention and romance. When you think of this color you should be thinking about hearts, stop signs and fire trucks.

Pink is an easy one and is more of a soft color that will deliver the following feelings: Romance, love, friendship, femininity, truth, passivity, good will, emotional healing, peace, calming, affection, emotional maturity, caring, nurturing, sweet tasting, sweet smelling, ethereal, delicacy. It can also give the emotion of devoting to breast cancer. For obvious reasons you can see why the National Breast Cancer Foundation chose this color for the breast cancer awareness month. You should be thinking about women, breast cancer, romance and candy when you think of this color.

Orange is a stimulating color and is used to be associated with life and health. In restaurants it is used to encourage appetite. Orange is also associated with being tropical, fresh and invigorating. Orange usually is associated with the following feelings: warmth, energy, vibrancy, the sun, friendly, intense, joy, tropics, growing things, heat, creativity, autumn, earth, appetite stimulant, and youth. When you think about orange you should be thinking about fresh oranges, sunsets and sunrises.

Brown is an earthy tone and usually is associated with growth and life. When using brown it is usually to associate with health and nature. The typical emotions derived from brown are: earth, materialistic thoughts, home, outdoors, inexpensive, reliability, credibility, comfort, endurance, stability, simplicity, comfort, longevity, intimacy, tranquility, masculine, nurturing, contentment, fertility, generosity, dirt, substance, practicality, and hard work. Brown is best used with a texture to imply these things, otherwise it is simply just to plain of a color. When thinking of brown you should be thinking about dirt, wood and general nature.

Gold is a color that exerts wealth and has a general sense of class associated with it. In order for it to be used properly to get these connotations though it must be shiny in some mannerism otherwise it looks cheap. The obvious and only think that comes to mind when using gold is money and alcohol. But mostly just money and wealth are the two main and universal associations with the color gold. When thinking about gold you should be thinking about wedding bands, class and wealth.

Yellow is said to stimulate mental activity and be one of the primary colors of attention. When using yellow it is best to not use it too lightly or loses it’s stimulating effects. The typical emotions that are derived from yellow are: intelligence, light, cooperation, sunshine, joy, happiness, intellect, energy, cheerfulness, optimism, purity, warmth, honor, caution (only when used in small amounts), cowardice (although only within the last thirty years or so), imagination, hope, summer, philosophy, uncertainty, restlessness, glory, and enlightenment. When you are thinking of yellow you should be thinking of the sun, religion and caution signs.

Green is an earthy and calming color that can also imply intelligence also. It also has the implications of money with it but typically only in the US. Typically green is associated with the following emotions: earth mother, physical healing, monetary success, abundance, fertility, growth, renewal, youth, stability, endurance, freshness, nature, environment, tranquil, refreshing, quiet, hope, immortality, health, healing, good luck, renewal, youth, jealousy, trees, grass, vigour, growth, harmony, envy, calm, contemplation, and friendliness. When thinking about green you should be thinking about money, health and tranquility.

Blue is the color of wisdom and trust, it is also the favorite color of over 2/3 of the world and is least disliked by most cultures. This may be because the sky is blue and the water reflects the sky making most things seen on the planet blue. It is generally associated with technology and progressive creativity. The most common feelings that people have with blue are: communication, wisdom, protection, spiritual inspiration, calmness, reassurance, fluidity, water, sea, creativity, peace, calming, higher thoughts, the sky, devotion, progress, freedom. trust, loyalty, intelligence, reassurance, artistry, compassion, sadness, tranquility, confidence, security, cleanliness, order, comfort, cold, technology, intellect, ideas, sharing, empathy, relaxation, affection, inspiration, friendship, patience, contemplation, infinity, harmony, non-threatening, and dependability. When thinking about blue you should think about the ocean, technology, and tranquility.

Purple is a color typically associated with royalty and is also the most liked color of pre-adolescent children over any other color. When thinking about purple the most common feeling are: influence, spiritual power, self assurance, dignity, high aspirations, royalty, spirituality, nobility, ceremony, mystery, transformation, sophistication, arrogance, dreams, imagination, wealth, extravagance, magic, creativity, energy, ego, ambition, fame, luxury, and power. When thinking of purple think of monarchy, children and luxury.

White is a pure color and is typically associated with being good and is the most religious color. The typical emotions that are derived from white are: spirituality, peace, higher self, purity, virginity, reverence, simplicity, cleanliness, humility, precision, innocence, youth, birth, winter, snow, good, sterility, cold, clinical, sterility, clarity, perfection, innocence, goodness, light, fairness, safety, positivity, faith, coolness, charity, union, self-sacrifice, holiness, feminine divinity, pristine, chastity and positivity. When thinking about white think about church, goodness and pristine.

Black is a color that has mysterious and sometimes negative connotations that can create the wrong image if used improperly. The typical feelings that are derived from black are: protection, repelling negativity, power, sexuality, sophistication, elegance, mystery, fear, evil, anonymity, unhappiness, depth, style, evil, sadness, remorse, anger, underground, space, secretiveness, night, emptiness, dramatic, authority, prestige, grief, anger, and serious. When thinking about black you should think about space, evil and mystery.

There are of course other derivatives of these colors that can mean different things but I could easily write forever about the psychological effects of color and bore everyone to death. The previous 7 paragraphs don’t need to necessarily be ready but are there as a helpful place to look back at to ensure that you understand the psychological connotations of various colors. These are not necessarily the things that your audience will immediately think of it is more of a subconscious thing then anything. It just helps to build that rapport that you want to establish with whoever is going to be looking at your designs.

A lot of this is very basic but when it comes to color: things are pretty basic, either it looks good or it looks like crap and that is typically left to the designer on whether they can develop that skill or if they are going to fail to impress their audience enough for them to enjoy the design or bare with it to get the content they want from the web site quickly and efficiently. Which category does this site fall into? (BTW, this article is the reason I should break articles up into parts and not try and type it all into one very long article: 2,417 words.)



Add to Del.icio.us | Digg | Yahoo! My Web | Furl

Bookmark WebProNews:

Dustin Brewer is a web and graphic designer with a passionate interest
in everything that is technology. He currently is the webmaster and
editor for tech filter, a technology news web site, as well as a writer
for Gadgetell– a similar web site about technology news with a strong
focus on new gadgets.