Color Theory for Designer

I have problem with color for now. I’m so absurd when I designing some website I’m not happy yet when I see the result. Why? Because when I choose the color for the first time before I created that website I imagine would be a perfect design. In the fact when I finished designing “I don’t need to continue this”.

But why I write this article? If you ask me, did you have a good knowledge in color? My answer is “no”. Because “no” as my answer I write this article. I have little bit problem with my eyes, I’m so lazy to read some text and that is vonis from the doctor who check my eyes. He say I have lazy eyes. Hell yeah, lazy eyes :v. But it’s really. Then I try to fix that by write this article guys :). So, let’s go back to the topic.

Color is subjective in design. What evokes one reaction in someone may evoke a very different reaction in someone else. Sometimes this is due to personal prefernce, and other times due to cultural background. Let’s take a deep.

1. Warm Color

Warm colors grouped with red, orange, and yellow, and another variations of those three colors. These are the colors of fire, of fall leaves, and of sunsets and sunrise, and are generally energizing, passionate, and positive.

Red and yellow are both primary colors, with orange failing in the middle, which means warm colors are all truly warm and aren’t created by combining a warm color with a cool color. Use warm colors in your design to reflect passion, happiness, enthusiasm, and energy.


Red is a hot color. It’s associated with fire, violence, and warfare. It’s also associated with love and passion. In story, it’s been associated with both the Devil and Cupid. Red can have a physical effect on people, raising blood pressure and respiration rates. It’s been shown to enhance human metabolism, too.

In design, red can be a powerful accent color. It can have an overwhelming effect if it’s used too much in designs. Red can be very versatile, though, with brighter versions being more energetic and darker shades being more powerful and elegant.


Orange is associated with the fruit of the same name, it can be associated with health and vitaility. In design, orange commands attention without being as overpowering as red. It’s often considered more friendly and inviting.


Yellow is associated with hope, as can be seen in some countries when yellow ribbons are displayed by families who have loved ones at war. Yellow is also associated with danger, though not as strongly as red.

Yellow is often considered the brightest, and the most energizing. It’s associated with happiness and sunshine.

In your designs, bright yellow can lend a sense of happiness and cheerfulness. Softer yellows are commonly used as gender-neutral color for babies (rather than blue or pink) and young children. Light yellows also give a more calm feeling of happiness than bright yellows. Dark yellows and gold-hued yellows can sometimes look antique and be used in designs where a sense of permanence is desired.

2. Cool Colors

Cool colors included green, blue, and purple, are often more subdued than warm colors. They are the colors of night, of water, of nature, and are usually calming, relaxing, and somewhat reserved.

Blue is the only primary color within the cool spectrum, which means the other colors are created by combining blue with a warm color (yellow for green and red for purple). Le’ts take deep to them.

Green (seoncdary color)

Green is a very down-to-earth color. It can represent new beginnings and growth. It also signifies renewal and abundance. Alternatively, green can also represent envy or jealousy, and a lack of experience.

Green has many of the same calming attributes that blue has, but it also incorporates some of the energy of yellow. In design, green can have a balancing and harmonizing effect, and is very stable. It’s appropriate for designs related to wealth, stability, renewal, and nature. Brighter greens are more energizing and vibrant, while olive greens are more representative of the natural world. Dark greens are the most stable and representative of affluence.

Blue (primary color)

Blue is often associated with sadness in the English language. Blue is also used extensively to represent calmness and responsibility. Light blue can be refreshing and friendly. Dark blues are more strong and reliable. Blue is also associated with peace, and has spiritual and religious connotations in many cultures and traditions (for example, the Virgin Mary is generally depicted wearing blue robes).

The meaning of blue is widely affected depending on the exact shade and hue. In design, the exact shade of blue you select will have a huge impact on how your designs are perceived. Light blues are often relaxed and calming. Bright blues can be energizing and refreshing. Dark blues are excellent for corporate sites or designs where strength and realiability are important.

Purple (secondary color)

Purple was long associated with royalty. It’s a combination of red and blue, and takes on some attributes of both. It’s associated with creativity and imagination, too.

In Thailand, purple is the color of mourning for widows. Dark purple are traditionally associated with wealth and royalty, whlie lighter purple (like lavendar) are considered more romantic.

In design, dark purples can give a sense wealth and luxury. Light purples are softer and are associated with spring and romance.

3. Neutrals

Neutral color often serve as the backdrop in design. They’re commonly combined with brighter accent colors. But they can also be used on their own in designs, and can create very sophisticated layouts. The meanings and impressions of neutral colors are much more affected by the colors that surround them than are warm and cool colors.


Black is the strongest of the neutral color. On the positive side, it’s commonly associated with power, elegance, and formality. On the negative side, it can be associated with evil, death, and mystery. Black is the traditional color of mourning in many Western countries. It’s also associated with rebellion in some cultures, and is associated with Halloween and the occult.

Black is commonly used in edgier designs, as well as in very elegant desings. It can be either conservative or modern, traditional or unconventional, depending on the color it’s combined with. In design, black is commonly used for typhography and other functional parts, because of it’s neutrality. Black can make it easier to convey a sense of sophistication and mystery in a design.


White is at the opposite end of the spectrum from black, but like black, it can work well with just about any other color. White is often associated with purity, cleanliness, and virtue. In the West, white is commonly worn by brides on their wedding day. It’s alsoc assocaited with the healt care industry, especially with doctors, nurses and dentists. White is assocaited with goodness, and angels are often depicted in white.

In design, white is generally considered a neutral backdrop that lets other colors in a design have a larger voice. It can help to convey claenliness and simplicity, though, and is popular in minimalist designs. White in designs can also portray either winter or summer, depending on the other design motifs and colors that surround it.


Gray also neutral color, generally considered on the cool end of the color spectrum. It can sometimes be considered moody or depressing. Light grays can be used in place of white in som edesings, and dark grays can be used in place of black.

gray is generally conservative an dformal, but can also be modern. It is sometimes considered a color of mourning. It’s commonly used in corporate designs, where formality and professionalism are key. It can be a very sophisticated color. Pure grays are shades of black, though other grays may have blue or brown hues mixed in. In design, gray backgrounds are very common, as is gray typhography.


Brown associated with the earth, wood, and stone. It’s a completely natural color and a warm neutral. Brown can be associated with dependability and reliability, with steadfastness, and with earthiness. It can also be considered dull.

In design, brown is commonly used as a background color. It’s also seen in wood textures and sometimes in stone textures. It helps bring a feeling of warmth and whole someness to designs. It’s sometimes used in its darkest forms as a replacement for black, either in background or typhography.

Beige and Tan

Beige is somewhat unique in the color spectrum, as it can take on cool or warm tones depending on the colors surrounding it. It has the warmth of brown and the coolness of white, and, like brown, is sometimes seen as dull. It’s a conservative color in most instances, and is usually reserved for backgrounds. It can also symbolize piety.

Beige in design is generally used in backgrounds, and is commonly seen in backgroudns with a paper texture. It will take on the characteristics of colors around it, meaning it has little effect in itself on the final impression a design gives when used with other colors.

Cream and Ivory

Ivory and cream are sophisticated colors, with some of the warmth of brown and a lot of the coolness of white. They’re generally quiet, and can often evoke a sense of history. Ivory is a calm color, with some of the pureness associated with white, though it’s a bit warmer.

In design, ivory can lend a sense of elegance and calm to a site. When combined with earthy colros like peach or brown, it can take on an earthy quality. It can also be used to lighten darker colors, without the stark contrast of using white.


Maybe that’s too long pilosopi of color, but here’s a quick reference guide for the common meanings of the colors discussed about:

  • Red: passion, love, anger
  • Orange: energy, happiness, vitality
  • Yellow: happiness, hope, deceit
  • Green: New beginnings, abundance, nature
  • Blue: calm, responsible, sadness
  • Purple: creativity, royalty, wealth
  • Black: mystery, elegance, evil
  • Gray: moody, conservative, formality
  • White: purity, cleanliness, virtue
  • Brown: nature, wholesomeness, dependability
  • Tan or beige: conservative, piety, dull
  • Cream or Ivory: calm, elegant, purity

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s