Colors That Convert: How to Use Color to Optimize Conversion

Published: | By Zarah Zhao

In an age of minuscule attention, consumer retention and interaction are highly important to e-commerce business owners. I fall into YouTube video holes and am guilty of abandoning online articles halfway.

Subtle nuances such as font, text size, and image placement are all factors that influence the amount of time that customers spend exploring your site and interacting with its various features. According to a Marketing Insider Group study, people subconsciously make conclusions about products within 90 seconds. For almost 90%, this estimation is based on color only. Because color is psychologically linked with our perception, they generate more instinctual, split-second reactions than most other elements.

Thus, it’s no surprise that one of the essential elements in branding is color--when to use it, how to use it, to optimize its effects. Because our reactions to colors depend on our culture, environment, and even personal preferences, there is, unfortunately, no magical (no matter how long I wait for that Hogwarts letter…) or even direct connection between colors and the emotions they evoke. Therefore, our guide serves primarily as just that--a guide that urges you to consider and make practical color decisions. We’ve seen first-hand all the time and energy you spent pouring over the details of your website and perfecting your product, and we’re here to provide that final push to help you maximize sales and interactions with your labor of love.

1. Try blue to cultivate trust

Blue is one of the most prevalent colors in the marketing and advertising world. It’s seen as a color of peace and order and has even been shown to reduce blood pressure and improve creativity. According to Joe Hallock’s Colour Assignments, blue is also the color most highly favored by both men and women, making it an apt choice for all targeted audiences. It also creates a sense of security and trust in a brand, so it’s easy to do blue work for you, regardless of your desired message or emotion.

Squarespace (1)




2. Contrast, contrast, contrast: your button color needs to POP!

There’s been much research on the best button color, and there’s no ‘one size fits all answer. However, due to a psychological principle known as the Isolation Effect, make sure it’s prominent because something that stands out on a page is more likely to be remembered. Because it’s your call to action, increase the contrast between the button’s color and the colors of the rest of the page. This matters whether it’s in a form, a popup, a banner, or on a sales page. That contrast can be generated by a difference in warm and cool tones and color palettes to maximize a consumer’s desire to interact with your buttons. A study by DMix of 600 participants revealed that when a red button was used against a webpage with accents of green everywhere else, conversion rates increased by 34 percent.

3. Limit red

Red evokes the strongest emotions of all the colors and is said to stimulate appetite. Hence it’s often used by companies seeking to target our basest instincts. Our eyes are drawn first to red because of its intensity; thus, the color creates movement, excitement, and action. Having such an immediate reaction to color means that that reaction is often irrational; red can even reduce rational thought in triggering our emotions. Therefore, using red in moderation as an abundance appears aggressive and hostile.

4. Avoid yellow

Long is a color of controversy among consumers because the human eye processes yellow automatically; this is usually used as a warning color or to generate a visceral reaction. It’s also often cited as making people angry! That might sound surprising, but it’s not all sunshine with yellow. Just like the color implies, use yellow with caution.

5. Adjust vibrancy

Vibrant colors generate a sense of energy and urgency among users and thus evoke stronger emotions. However, neutral or darker colors help with comprehending and retaining text-heavy pages that may require more mental processing.

Color Vibrancy-1-1


Color vibrancy 2-1-1


6. Green to balance and soothe

Because it requires no adjustment when it hits the retina, green is the most calming shade for the human eye. A color of balance, right in the middle of the color wheel, beyond being associated with nature and health, green is used by financial companies to depict wealth. Reassuring and pleasing to the senses, we like to think of green as the color of a zen state.

7. Test!

A/B test everything! Because everyone has such deep-rooted psychological reactions to color, it’s essential to test the results of any changes you make. You are conducting trials such as A/B tests with both a control and a variable group allows you to closely monitor and evaluate the effects of both minute nuances and large-scale modifications on your audience. While Monetate found that an orange button performed worse than a blue one by 9 percent, Hubspot found that a red button outperformed a green one by 21 percent. However, all of these results should be interpreted with a grain of salt, as they are all contingent on the color of the rest of the landing page and the product sold. What works for others might not work for you, so always test against a control group!

Ultimately, it’s essential to create a cohesive message between the different elements of your company. Does your color choice match the perceived appropriateness of your product? Studies have shown that this is far more important a factor than the inherent color. Evaluate the message you want to convey to your consumers and align that with your choice of colors, as even the most subtle of color tweaks can influence brand loyalty and sales.

Share this Article: