How to use the best colors for your landing pages

The visual appearance, the colors on the site contribute in a big way to how customers identify with your site. 

A whopping 42% of visitors base their purchase decision based on the site’s design alone. 52% didn’t return to the site because of poor design experience. If you want to sell, you better look good.

There’s a lot more to the color story you need to know and experience before you begin to use them.

Case in point, culture plays a big role with respect to color perception.

Culture And Colors

Choosing the best color depends on what people believe to be true around a certain color. This means you need to correctly understand the target market.

Colors lend to different meanings in different countries. For some white means spirituality. In India and China it is associated with death. The color black is associated with death. In Brazil though purple owes that honor.

To make your landing pages convert at the best possible rates you need to first understand who’s your target audience and what they want. This gives optimal conversion rates on your landing pages.

Here are all the important things:

Colors and the theme of your site

We want colors that align with the branding and overall vision of our site. When you use a color pattern you leverage the familiarity principle for web design.

According to the familiarity principle, people like and are attracted to things that they feel familiar to. That’s why the color scheme you use should be familiar to their personality and cultures.

Blue is the color of the sky and sea. The color symbolizes trust, intelligence, fathi and wisdom.

Blue is for the mind and body and produces a calming effect.

The color orange is about determination, success and positivity.

The calls to action should be in general big orange in color.

As another example, if you’re selling saltwater fishing tackle online, then you probably wouldn’t want to offer your visitors a brown and green motif. Instead, you’d probably prefer something like cobalt blue and white. Those are colors that are familiar to saltwater fishermen.

Finally, if you are a site that is focused on making entrepreneurs money, like Quick Sprout, green is an excellent choice.

Shopping cart colors and the design of the landing pages should follow the same theme and build on the same color-coding seen elsewhere on the website. Whatever landing page software you use, say Unbounce, make sure to use a theme that matches the site’s design.

Colors In North America

Colors are bold. They signify good mood. Colors can also have different attitudes based on where they’re used.

Specific colors are assigned to specific feelings throughout the western world.


There are several applications for red in the West. It can mean stop, love, or Christmas. It’s often used to create a sense of urgency or convey the idea of energy.

Red also inspires hunger. Most fast food restaurants overwhelmingly use the color red on their logos and menu cards. No accident.

The color red is one of the best choices you can make for a call to action button on a website. It’s one of the most successful colors that nets conversions.


Yellow is an eye-catcher because it doesn’t occur that often in nature. It conveys a sense of happiness and optimism. It inspires creativity.

If you want someone to see things positively consider using this color. It soothes you.

Too much of a color can be bad and that applies to the color yellow. It’s seen as a loud color and may take away attention from the intended action as a result.

Yellow offers contrast. The color scheme can draw attention to most important parts of pages.


Everywhere around the world the word green means go.

The color also brings to the fore the beauty and everything else around nature.

It’s good for sites that focus on camping and hiking activities.

It;s also great for sites promoting environmentalism.

Green is also the color of money. When selling a course it’s a marketing tactic you can often use to build up the idea of wealth.

Green is also a color that’s pleasant to the eye and as such is easily noticeable. It provides much needed background contrast for your CTA buttons.

When choosing a call to action button color the next most popular choice after orange button is the green button.


Blue figures mostly in web design and is one of the prominent standout choices for WordPress themes.

Blue conveys trust and shows that the site has integrity. You can do business with them. Businesses that choose blue are telling people that yes you can do business with us. We won’t take you for a ride.

Blue also shows a deeply serene location. If your business targets those locations use blue as the primary color.

Blue color can be used a lot without overpowering the vision of your visitors. As long as you choose a lighter shade you can go with blue as much as you want.

This is great for websites that focus on healthcare and assorted services. Different shades of blue on a site have a calming effect.



Orange is another warm color you can use. It conveys both warm positive feelings and a hope that things will get better in the future.

Amazon uses the big orange button for its call to action. The big orange button is thus a great choice for delivering conversions.


Purple is a color that since old denoted soothing and has had a calming effect. With yellow, too muych of purple isn’t great for websites or for conversions.

The royalty the color purple indicates is great for selling beauty products. You can use the color in different shades through the site. However make the call to action stand out fromrest of the color schmea on the site.

It’s great for menus and borders and matchees the different aspects and site design very well. Pink

The connotations pink has slides overwhelmingly for femine prdicuts and products selling products to young ladies. If you are targeting a female audinec ethe color pink is very effective.

Pink is the favorite color of many young ladies. For that reason, it’s often considered a feminine color.

If your site targets young female pink should be the color of choice.

Example Children’s place using pink

Darker shades of pink are however men’s favorite because they show deep romance and love.

It should be noted, though, that darker shades of pink can appeal to a male audience because they exude romance and love.


White is a symbol of purity and is wholesome. That’s why white is a good choice for any large business of repute.

White is the default background color for corporate settings. It’s going to go well with any cta  color choice that’s of a different color.

Example white background


The color black makes an extremely bold statement. It’s a powerful color. It’s used to market luxury items. You can see several websites comfortably using the color on the site.

Example JustLuxe website

The Red/Orange vs. Green Studies

These are the basics around colors. And now let’s look at the effectiveness of color combinations and also for the important call to action button.

There are various studies touted on the effectiveness of the red or orange call to action button compared to a green button.

A Dmix study presented red and green call to action buttons to 600 visitors. When the red button was added as a call to action button the conversions improved by 34%

In another study by HubSpot, they compared traffic sending the buttons to 2000 visitors. The red button showed a 21% increase in conversions.

In the VWO test three buttons were compared, a white on green text, a red button on white text, And an orange button. It showed a margin improvement of 5% only

So it might mean that the orange button is way better than all the colors and all the buttons available.

Orange vs. Blue

When Monetate compared orange button against blue in the a/b test they found that the blue button performed better at 9%^

There’s no single right answer to the question.

The optimum choice of button color depends a lot on the context.

The green button for instance in the Hubsopot study blended in with the rest of the page and that’s teh reason for the low conversions. Low contrast?

The red button came up with more contrast than the green button and it improved the conversion rate.

The results can’t be generalized and there’s not a single button color that’s best above all.

Other tests show similar problems. The green button was tested against a button that was barely notivealbe and that showed a better conversion rate.

That’s why you can;t rely on studies to determine if one single color will beat the odds and be better than other colors for a website.’

The best thing to do? Find a better button color that stands out in contrast to the rest of the page. T’s easier to see that particular color.

Split Testing

Determine which button color is the best choice with a/b testing or split testing. It’s difficult to find out the best color with the help of hypothesis alone. So experiment and see what works.

Always be testing

Narrow the number of call to action buttons and choose the one that offers the most significant contrast. Choose a color that provides good contrast and not something that may be negatively attributed to by the people seeing the colors.

Start by narrowing the field of potential call to action button colors down to a few options that are in line with your theme or present a significant contrast. 

Color itself is a less significant play. If you don’t have compelling copy no matter which color you choose it’s not going to be able to save you.’


Color design is one part of the overall marketing game.

The colors of choice on landing pages or the shopping cart is going to make a big difference in conversion rates. The right colors that make or break your site depends heavily on people visiting your site, their demographics and everything else. So split testing based on informative research is what you can do to create a design that works.

  • Have a color scheme that matches with the rest of the site
  • Keep the background free of distraction
  • Don’t use colors that have negative meanings in the said culture.
  • The call to action should be large and above the old. 
  • Reduce distraction.
  • Make sure you calls to action are large and above the fold


Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>