How Color Affects Brand Perception

As visual beings, our eyes are drawn to the interaction of different hues, which are powerful enough to create emotions, convey moods, and represent brands.

We react to color in a natural, often subconscious way. Users will rarely be able to express how color affected them, but make no mistake: it has, does, and will continue to shape their experience.

To help you make the best use of color in content creation, I will share a few scientific findings around color meanings. Many of these studies come from psychologists, who have found powerful behavioral and attitudinal triggers in certain hues. Although the scientific method isn’t free of flaws, the insights in the list that follows have all been carefully selected and are published in reputable academic journals, backed by rigorous experimentation protocols, and defended by leading experts:

Red, orange, and yellow

These three colors evoke so-called active emotions, or feelings that involve physical arousal. The opposite of active emotions are passive ones, and those imply some kind of sedation.²

Red

Relative to other colors, red leads men to view women as more attractive and more sexually desirable.³

Yellow

Yellow also has been independently linked to happiness and excitement because it evokes the sun and summertime.⁴

Blue

Blue is associated with low anxiety levels, calm, and comfort. Now, based on what you just read about arousal and activation, you will understand the following: red provokes more anxiety than blue, and that affects the way users perceive wait times. A study found that users exposed to a blue background screen while waiting for a download perceived it as quicker than did participants exposed to the red background screen.⁵ In line with this idea, a group of researchers demonstrated that red (versus blue) can activate an avoidance (versus approach) motivation and subsequently can improve performance on detail-oriented (versus creative) cognitive tasks. Blue effectively enhanced performance on a creative task.⁶

Furthermore, in a study on environmental color, more positive retail outcomes occurred in blue rather than red environments. More simulated purchases, fewer purchase postponements, and a stronger inclination to shop and browse were found in blue retail environments.⁷ It comes as no surprise, then, that the results of a study on website structure and color showed that websites of blue hue, medium brightness, or medium and high saturation received the highest overall aesthetics ratings.⁸

Black

Black is consistently seen as defiant, and not associated with words like tender, calm, and cheerful.⁹ Researchers at the University of Illinois found that yellow, white, and gray are associated with weakness, whereas red and black are associated with strength.¹⁰ Researchers found that red leads to attractiveness via perceived sexual receptivity, whereas black leads to attractiveness via perceived fashionableness.¹¹ In a classic study on color and affective stereotypes, cluster analysis showed that red, orange, and yellow were associated with outgoing exuberance; red, yellow-green, and purple, with hostility; and purple, gray, and black, with asocial despondency.¹²

Green

This color evokes mainly positive emotions such as relaxation and comfort because it reminded most of the respondents of nature.¹³ In a study on brand personality and logo colors in the fashion industry, researchers found that blue logos were associated with competence (confident, corporate, reliable), whereas green logos were associated with ruggedness (outdoorsy, rugged, masculine).¹⁴ The color green-yellow had the lowest number of positive responses because it was associated with vomit and elicited the feelings of sickness and disgust.

Color can affect the way in which we process faces. French researchers found that a red background resulted in more negative face perception than a green background, whether the poser was female or male.¹⁵

Purple

In a fashion industry study, logos in purple were significantly associated with sophistication, including traits like “feminine,” “glamorous,” and “charming” (Ridgway and Myers, 2014). In a study on the bio-psychological effects of color, many subjects felt calmed by purple.¹⁶

Brown

Evokes stability. When asked about colors that matched a certain brand’s qualities, respondents associated stability with blue/brown, fun and energy with yellow, and excitement with red/purple.¹⁷

Table 6-1 summarizes these findings for future reference.

Creating Compelling Color Combinations

If your content marketing machine is well oiled, you will have systematized the use of color and have a palette on hand that gives you the ability to move quickly through design decisions. This means that you will need to decide which colors make sense for your marketing palette and how to combine them to project certain moods.

Some designers specialize in crafting color palettes for brands, which involves synthesizing insights from fields as diverse as psychology, vision, and business. There are, however, ways to approach the topic practically. Fortunately, color theory has been studied enough to provide us with a few combination principles to start the process. Essentially, there are five types of color combinations: monochromatic, analogous, complementary (opposite), split complementary, and triad. To make matters simpler, we will focus on the first three types.

A monochromatic color combination uses different shades of a single hue. Light blue, blue, and dark blue is a monochromatic color combination, for example.

An analogous combination is made up by hues that are next to each other on the color wheel—think pink, purple, and blue.

A complementary (or opposite) combination is formed by hues that lie directly opposite each other on the wheel. Orange and blue is a classic example.

In general, the farther two colors lie from each other in the color wheel, the more contrast they will create when placed next to each other. Makes sense, right? After all, they are far away for a reason. Placing nearby (analogous) hues next to each other creates less contrast, as well as using different shades of the same hue (monochromatic). That being said, you can create great color combinations that are analogous or monochromatic if you play with each hue’s intensity. A really light blue placed against an extremely dark navy will create high contrast despite being a monochromatic palette.

Defining a system of color combinations is a smart way to optimize for good results every single time. To begin easily, check out any of the available color palette generators. Three that I have found to be user-friendly are Adobe Color CC (formerly known as Kuler), Pantone’s mobile app (Figure 6-1), and Coolors.

Figure 6-1. Pantone’s mobile color app

Typography and Brand Personality

Typography refers to the art and science of arranging type. Traditionally, typographers had to arrange words, letters, numbers, and symbols by hand for publication. Because modern computers did not exist, they were forced to place (set) individual blocks of movable type in a specific order to form sentences and phrases. Typesetters stored hundreds of letter blocks that would allow them to build templates for text. A typeface is the complete family of variants in a single style (e.g., Times New Roman). Meanwhile, the font is a specific size and width within that family (Times New Roman, 12 point, bold). For the purposes of this book, I will use the terms font family (typeface) and font (specific variant) to avoid confusion.

Fortunately for us, digital typography is now accessible to pretty much everyone—experimenting with typefaces, placement, spaces, and size is just a click away. That kind of availability is both a blessing and a curse. Having so many options can easily confuse someone who has not defined what the content reading experience should be like. If you have not defined your brand’s aesthetic, looking at a catalog of 1,500 fonts can quickly become overwhelming. The trick to smart typographic decisions when designing content is the same as that of many other disciplines: preparation.

To make sound choices to enhance your content, there are two building blocks: understanding the implications of certain type choices for the user experience, and knowing your brand’s particular preferences with regard to typography.

Exercise: Unveiling Your Brand’s Visual Style

You will find a list of words that describe opposing visual styles below. For each line, mark an X to indicate how closely the term resembles your brand’s sense of visual style. The closer your mark is to the word, the stronger you feel about how it relates to your aesthetic. If you wanted to indicate that your brand reflects a remarkably bohemian (versus corporate) style, you would mark the box closest to “Bohemian”:

If you feel less strongly about it, consider marking boxes that are closer to corporate on the same line.

Over to You

Time to check one box in each of the following lines. Ignore the letters and numbers for now.

Analyzing Results

A moment ago, I said, “Ignore the letters and numbers.” Now is when you stop ignoring them. Look at the numbers above the marks you made and add them as follows:

1. Add your numbers for lines A through D. This is your visual character score.

2. Add your numbers for lines E through H. This is your visual contrast score.

3. Add your numbers for lines I through L. This is your visual geometry score.

In my experience using this tool, any given brand’s aesthetic can be described as a combination of three elements: character, contrast, and geometry. Whereas character points to the brand’s visual personality, contrast tells the story of how it deals with color and typography to create tension. Does the brand’s content yell, “Look at me!” consistently, or is it much more of a minimalist appeal? Finally, geometry helps you to understand which types of shapes best represent your aesthetic. Essentially, there is a clear divide between the crisp, symmetric look that many brands want to project and the more jagged, weathered feel that others do.

You can use Table 6-2 to interpret your scores. Just find the number you added up (for A–D, E–H, and I–L) and match it to the element to which it corresponds. As you find your spot, remember that none of these styles are prescriptive—in reality, there is a wide spectrum that might combine several of them. They do, however, reveal your brand’s aesthetic tendencies; thus, they will prove useful when you’re designing new pieces of visual content.

Eight Brand Visual Styles: Find Yours

Depending on the combination of results you just got, you will find your brand falling under one of the eight visual styles shown in Table 6-3.

Visual Styles in Action

Were you able to find your brand’s visual style? Table 6-4 offers specific ideas regarding inspiration sources, typography, and color choices. I hope these pointers make it much easier to create visual content that matches your brand’s true essence.

Table 6-4. Design recommendations for your brand’s visual style

Visual style name	Design tips	Real-life example
	Try out subtle handwritten fonts and graphics with muted, warm colors. Search for hand drawn, handwritten, nature, or hand lettering fonts.	Panera Bread
	Thin, modern fonts that reflect youth with neutral color palettes. Search for art deco, hipster, geometric display, geometric grotesque, monoline, or modern fonts.	Chipotle
	Vibrant, eye-catching, hand drawn fonts combined with high contrast backgrounds. Search for brush, graffiti, or script fonts.	Peet’s Coffee & Tea
	Solid font families with a playful vibe. Overlay with lively, saturated color palettes. Search for humanist sans-serif fonts.	Dunkin Donuts
	Elegant textured serifs with uneven edges. Pair with pastel or neutral tones and plenty of whitespace. Search for vintage serifs, handmade serifs, or hand drawn thin script fonts.	Anthropologie
	Thin geometric sans-serifs. Search for Swiss style, neutral, corporate fonts. Go for shades of gray and plenty of whitespace.	Calvin Klein
	Flowy, bold script fonts in highly saturated dark colors. True blacks or primary colors. Embellished or energetic backgrounds. Search for signature, street art, and bold script fonts.	Ray-Ban
	Thick, condensed sans-serifs with sharp edges. Search for thick, narrow, collegiate, or poster fonts. Combine with rich, highly saturated colors.	DKNY