How does color decision affect landing page conversion?

Probably, you know that the human brain is more sensitive to visual perception. Therefore, visual images with appropriate slogans produce a much stronger impression than the slogans themselves.

According to Vladimir Smirnov, a well-known UI/UX designer and design director at Spiilka Design Büro: “The first thing we pay attention to is color. The second important criterion for assessing/identifying something in the form and the third is the internal content, the location of the elements.”

That is, if initially, people see a repulsive combination of colors, then they immediately leave the web resource or form a negative attitude towards advertising. Moreover, the failure rates are quite high – 60% for advertising a product or service and 40% for a commercial website. From here comes low conversion and ROI.

However, sometimes is found advertising, which literally fascinates and online store, whose popularity is impressive. So, what is the secret to success? In my opinion, it consists in understanding the properties of individual colors, the principles of their combination and the ability to convey the primary idea/value of your business, product or service through visual images. It is especially important for creating a landing page design where we motivate the user to take a certain action (subscribe to a newsletter, make a purchase, request a consultation, etc.).

From the color and combination of individual elements depends on what decision he will take in the first few seconds: agree or refuse. So…

What should be considered when you are planning the design of a landing page?

The most important factors are the specificity of the proposal, the ratio of gender, as well as age and social groups in your target audience.

Specificity of the offer

The authors of the study “Exciting red and blue: the importance” state that as soon as you choose a specific color palette to represent your brand, users form strong associative links.

Using color is one of the most effective ways to visualize the key features of your brand.

For example, Apple products are firmly associated with white, and when we talk about Ferrari, we always imagine red models. Therefore, select the primary and secondary colors to suit your business.

Color increases brand recognition by 80%, which directly affects consumer confidence.

In this context, it is also necessary to mention the associations caused by certain groups of goods: food, clothing, shoes, children’s products, car parts, educational webinars, development services.

For example, pages with a description of products for children aren’t recommended to be made in gray and cold colors, but bright, warm colors will be most welcome – the same applies to most pages with a description of women’s clothing. Shoe description pages can be styled in beige or white with black elements (depending on the style).

Industrial colors and motifs are perfect for selling auto parts and info-services. Although, landing pages for info business and development services will also look great in blue and purple.

As for food advertising, menu design, or a landing page containing an offer to receive a discount coupon or a gift certificate for a restaurant, it is important to use colors that stimulate the appetite, and not vice versa. If the offer looks “delicious”, then visitors won’t take long to wait. Hit in the associative array is the key to high conversion.

Gender features of perception

Many women are used to showing their emotionality, sensuality, and romance, more vividly than men. Consequently, the craving for various shades of red, lilac, yellow and green.
The creator of Victoria’s Secret brand took into account this feature of perception and used to emphasize the fundamental properties of his products. Follow his example if you aim to a female audience.

As for men, they are accustomed to behaving more restrained, so that calm black, gray, white, and blue colors are convenient for promoting men’s goods. Combination of dark and golden elements is often used successfully for visual emphasizing of premium lines. Blue and purple decorations on a black background also look great.

Age and social peculiarities of perception

You may use the most extensive color palette and the most daring combinations of colors for the sale of both men’s and women’s youth products. Besides, you should take into account adjustments for the mainstream and informal currents.

Therefore, each page on the website may have its own shades and design features. In this case, you need to focus on the style and color scheme for a particular product in order to place it on the right background for the most favorable perception by potential buyers.

When selling children’s products, you have to consider that mothers, grandmothers, aunts buy them. Therefore, the most effective color palette options are bright (gradations of yellow, green and purple) and pastel (beige, pink, blue). The older age group like the last shades.

The higher the status of your audience, the more cautious you should be to choose colors. Give preference more muted, pastel options for the basics of the page design and carefully add the bright contrasting details.

If you are launching an advertising campaign for a specific business for the first time and aren’t sure about the desires of your target audience, use universal colors (with shades and gradients): blue, green, black, white.

Reasons for making spontaneous decisions

According to the study “Impact of Color in Marketing”, from 62% to 90% of spontaneous decisions and judgments about a product are formed on the basis of the color that creates a mood.

When a person needs to make a decision quickly, he is particularly susceptible to the influence of an external stimulus, in the role of which a pop-up or button can act. Bright details that stand out against the general background traditionally attract attention.

Therefore, it is recommended to highlight CTA buttons with a contrasting color to increase conversion. A great example of such a solution is the Mailchimp landing page.

Use this principle to design buttons for subscribing and/or sending a request on your landing page.

What else do you need to know about CTA buttons?

In the example above, a mix of red and orange colors was used to highlight the CTA buttons. This is due to the fact that the red color is considered the most energetic, causing excitement, creating the effect of urgency, the need for quick decision-making. This technique is often used during sales.

Orange is another “aggressive” color that motivates to carry out an action. It’s great for creating CTA elements and increasing sales in the US market. A more “calm” version of the same palette is yellow. It is equated with joy and helps to attract the attention of users without the direct inducement to purchase.

The colors from the blue palette create a feeling of reliability. Therefore, it’s most efficient to use it to design CTA elements on the websites of financial structures (banks, insurance companies, investment funds) and large retail networks/organizations.

In turn, the green color is associated with health and tranquility by Americans and Europeans. Therefore, the design of landing pages for the promotion of products and services regarding wellness in this color scheme will be an excellent solution.

*These results were obtained as a result of a study of the effect of colors on customer reaction conducted by KISSmetrics employees. They are most reliable for residents of the North American continent.

The effect of color on different types of consumers

The impact of the color scheme is interconnected with groups of consumers that we receive through dividing visitors according to the principles of their behavior on a website. There are 3 main groups:

  1. Impulse Shoppers – most affected by red, orange, royal blue, and black colors;
  2. Shoppers on a Budget – react better to deep rich dark shades from the blue-green palette (navy blue, teal);
  3. Traditional Buyers – respond to pink, rose and blue colors.

Using colors that correlate with the preferences of a particular group of clients, will allow you to create a knock-on effect in the volume of purchases on a commercial website.

Furthermore, change in the color of CTA elements may increase conversion by 20-30%. The Performable company experience confirms this thesis.

In their case, changing the color of the CTA buttons from green to red led to a 21% increase in conversion. It’s not difficult to guess that the company’s profits also increased due to the adoption of this decision.

How to evaluate the effectiveness of design decisions

After making such changes, it’s crucial to track its effectiveness. To test how the change of colors and the location of elements affects the conversion, you may use 3 approaches:

  1. Checking analytics on visits, transitions, targeted actions and failures before and after the changes made;
  2. Using heat maps to track user behavior;
  3. A/B testing (implies the use of dynamic design techniques).


For the most reliable results, I recommend combining approaches. The combination of the first and second options is convenient for analyzing the behavior of visitors and, as a result, the effectiveness of a static landing page, or small changes on it.

Combination of the second and third approach will be optimal when creating a dynamic one-page website with two color variants. Then new options will be shown alternately to unique visitors.

After reaching a certain number of shows (at least 1000), the reactions to the first and second design options are analyzed for decision making. The effectiveness of all subsequent minor and major changes in the design (the inscription on the CTA-buttons, the color of the headers or background) may be traced through resorting to a new A/B test.

Experiment, increase your brand recognition and conversion on the website, and most importantly – be successful!


Created by Yudzhyn Balynets
Senior Designer



Color Psychology and How to use it in E-Commerce

Infographic: How Colors Affect Conversions