Color theory 102: Color meanings

In our previous post we talked about color harmonies and how to use them to create pleasing color arrangements. So we learned which colors match, but we didn’t talk about how to select colors to convey certain messages. Let’s find out 🙂

Non-verbal communication

Colors, apart from giving visual interest and contrast, also give the design a message/meaning. This meaning stems from the viewer’s prior knowledge, experiences, and cultural background. The colors’ message should support the shapes’ message. Let’s illustrate this with an example: The logo of Japan Airlines is composed of several components. First we can see the shape of a bird, more specifically a crane. The crane symbolizes flight and in Japan the crane is also a symbol of longevity and good luck. This message is emphasized by its color. Red represents power, but in Asia it also symbolizes good luck. The shape of the crane is rounded to mimic the Japanese flag. So one way to interpret the logo is: “A powerful Japanese flight transport company, that wishes you good luck on your journey”.

Common color meanings

It is important to stress that color meanings can be very subjective and can differ from individual to individual, but there are some common meanings that are universally attributed to each color. We will talk about these In the following sections.

Red

The color red attracts attention and evokes emotion and is universally seen as the color of romance and warmth. It can also represents danger and aggression. It’s been proven to increase appetite so it’s commonly used by food companies. It also gives a sense of urgency so it’s often used in sale advertisements.

Common meanings: Confidence, passion, strength, power, attention, love, excitement, energy, action, aggression, “Stop!”, danger, and hot.

Orange

Orange is associated with playfulness and enthusiasm. Similarly to red it’s thought to stimulate appetite. Orange is also used in some warning labels. But this color is not very popular in the United States, since the prison uniforms are also orange.

Common meanings: Happy, energetic, sociable, friendly, affordable, enthusiastic, sunny, and in some cases warning.

Yellow

Yellow is happy and optimistic (remember the smiley face?). It’s cheerful and warm, which encourages communication. Because of its brightness it can be used to catch attention. In some cases it can be too bright so it is recommended to use it in combination with other colors. It can also mean wealth (think gold).

Common meanings: Logical, optimistic, progressive, confident, playful, and creative.

Green

The first thing we associate green with, is nature and vegetation aka. greenery. It is a color that represents life, freshness, and growth. Its commonly used in eco-friendly companies or biological companies, and it’s also associated with “go/start” or success.

Common meanings: Nature, life, freshness, tranquility, success, environment, harmony, new, wealth, and “start/go”

Blue

Blue is one of the most popular colors. It communicates security, scalability, and dependability so it is commonly used in corporate logos. It is often associated with the sky and water which we often connect with serenity, peace, freedom and cold. The color can also be regarded as conservative and a masculine color.

Common meanings: Trust, conservative, dependable, secure, scalable, calm, serene, cool, and peace.

Purple

The classic color of nobility and emperors is associated with wealth and luxury. Historically it was the hardest color to reproduce. It can also mean fantasy, mystery, magic, and can evoke a feeling of wisdom and imagination. It is commonly used in beauty brands and it is also a color that resonates well with children, so it’s used by toy and candy companies.

Common meanings: Royalty, luxury, mystery, magic, creativity, uniqueness, and majesty.

Pink

Pink is generally associated with femininity and is used with brands that target women. It is also associated with sweetness and is seen in logos for sweet foods like ice cream or donuts. It also evokes a sense of playfulness.

Common meanings: Femininity, sweetness, playfulness, energy.

Black

Black is used in high-end, exclusive brands. Black gives brands a sense of sophistication, formality and seriousness. It is used by brands that deal in luxury products. Logos that only use black may come off as plain. It can also be associated with death.

Common meanings: Elegance, seriousness, exclusivity, style, formality, expensive, authority, and death.

Multiple colors

Brands that use multiple colors want to communicate diversity. Colorful logos attract children, so many toy companies use this kind of logos. Multi-colored logos also give of a sense of easygoingness. Such logos are commonly used in IT and internet companies.

Common meanings: Diversity, fun, childlike, multi-disciplinary, and multi-functional.

Colors and branding

Colors should support the brand of a company. Research shows that people make subconscious judgments about a product, person, or company within the first 90 seconds of initial viewing. Somewhere between 62% and 90% of this assessment is based on color, which means that colors may have a very large impact on your brands identity.

Let’s try this out with an exercise. The following is a logo of very known brand. Which brand do you think it is? If you guessed Coca-Cola, you’re right. This is the Chinese Coca-Cola logo. A lot of the recognizability comes off shape, but the color really makes it obvious.

In conclusion

The color needs to support the design and the idea it wants to convey. It’s also important to note that these rules aren’t set in stone, merely guidelines, and sometimes breaking the mold can be a very successful move. Some such logos can be seen in the example logos so don’t be afraid to try things out.

While writing this post we were inspired by this page – have a look 🙂

Color theory 101: Make your own color palette

Were you ever working on a design or website and wondered what colors to use? In this blog post you’ll learn about the color wheel and color harmonies, that you can use to create pleasing color arrangements. And of course we also share some useful tips. 😉

The Color Wheel

The color wheel is the foundation of Color theory. The wheel shows the visual relations between different colors. The basis are the 3 primary colors: red, yellow and blue. By mixing those colors together we get secondary colors. For example orange, purple, green. Sequentially by mixing secondary colors with primary colors tertiary colors are formed. Colors on the wheel are also divided into warm and cold colors. Warm colors are generally more energetic but can also be irritating, while cold colors are soothing but can feel cold and boring.

Basic terminology

To describe our position on the color wheel, and sequentially a specific color, we use the terms hue, saturation and value. Hue tells us on which angle on the wheel we currently are. Saturation tells us how intense/vivid the color is (how close to the center of the wheel we are), while value tells us how bright or dark the color is.

Color harmonies

Color harmonies or color relations are pleasing arrangements of colors that can be used when creating color palettes. Color harmonies try to balance different colors so that they are still visually complex without being overbearing. The following sections will present a few of the most common color harmonies and give examples of photos that use such harmonies. The photos given in the examples are taken from unsplash.com, each photo also has the link to the respective photographer.

Monochromatic

The monochromatic color harmony uses only one hue or hues that are very closely together. The difference in color comes from the saturation and value. Use this harmony when you want a unified feel and message.

Analog

Colors are analog when they are next to each other. There shouldn’t be any larger break in between them. Use this color scheme when you need a larger variety of colors but still want to achieve a similar feel throughout.

Complementary

Two colors are complementary when they are each on opposite ends of color wheel. This maximizes the tension between colors while retaining balance in between them. Use this when you want to present two contrasting messages or when you want different visual elements to pop from the background. You may have already noticed that many movie posters use this color palette, especially the combination of orange and light blue.

Split complementary

The difference between complementary and split complementary is that one of the colors is split in two (in the example below the color orange, which is complementary to blue, is split into shades of green and red). The angle between each split color and the complementary color needs to be the same. So if we move one of them, we also need to move the other equally in the opposite direction. Use this color harmony if normal complementary colors don’t give enough variety.

Triad

Colors form a triad if the angle between them is the same. Pay attention to the ratio of these colors in your designs, they shouldn’t be equally represented. The following photography shows a good example.

Double complementary

Double complementary uses two sets of complementary colors. The derived color palettes are very colorful. Pay attention to the saturation of colors. Don’t oversaturate them or your design will be too overbearing.

Tips and tricks

  • Don’t use more than 5 different colors in your color palette.
  • Use similar saturations and values for your colors. But pay attention to the contrast between each of them so you don’t use colors that are too similar.
  • When creating color palettes think of how many different elements there will be on your design and how much contrast you will need between them. Than you can decide how many colors you need.
  • Black and white can be used with any color palette. You don’t need to add them to your palette.
  • If you are making a portfolio page or an image repository (so you don’t know which colors will appear on the page) use a achromatic (colorless) color theme.
  • A good way to tackle color palettes is to construct them from an image. Find an image you like and use its colors.

Useful links

Adobe Kuler – A online tool for creating color palettes. Most of the described color harmonies are already integrated into the tool. Also don’t be afraid to try the custom option. It can also retrieve colors from images that you can edit later. It also has a vast library of already made color palettes.

Color scheme designer – A similar tool to Adobe Kuler, it comes with a variety of color presets like pastels, grayish or shiny… while also retaining those color harmonies.

Now that you know the basics, you’re ready to experiment and explore! 🙂