How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

Katerina Kopylova

How often do we initially judge a product based solely on its color? How many times our buying decisions have been based on the product color alone?

Let’s take a moment and look at fascinating science behind why something as abstract as color can influence us so much:

When our eyes take in a color, they communicate with a region of the brain known as the hypothalamus, which in turn sends a cascade of signals to the pituitary gland, on to the endocrine system, and then to the thyroid glands. The thyroid glands signal the release of hormones, which cause fluctuation in mood, emotion, and resulting behavior.

In this post, we are going to cover how to choose the right color scheme for your eCommerce and make the most of those 90 seconds while a customer forming an opinion about your product as they land on your page.

Color: Fundamentals

Learn color components

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

What if I say that you are not looking at colors right now but at hues? Right, there is a difference between hue and color. You will need this information later in the article as you will follow the links to designers’ tools to create your own brand colors.

Hue refers to the color spectrum – red, orange, blue while color (web color) is a combination of hue, saturation, and luminosity. Saturation is how “colorful” the color is. “Rich” or “pure” might be better words. As the color becomes closer to gray, it is less saturated. Luminosity is a measure of how bright or dark a hue is. Each of the three properties has a value (depending on a color space, but we won’t go into that one today). For example, the pastel mint values are 147,19,100.

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

Get started with your eCommerce website color scheme

First, it is important to understand the interplay between the three key elements – base, accent, and text:

  • A good starting point is to choose the base color for your online store. This is the fundamental color you will build on. On top of it, you will add other colors and combine hues and shades
  • Accent color –used for emphasis and contrasting effects
  • Text color in black, white or grey – depending on the background color, the text color should be adjusted for good contrast and readability. In terms of readability, it is convenient to have a black-to-white ratio of about 60 to 80%.
How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

Do’s: the less color is used, the more likely it is to stand out. Good to know for calls-to-action.

Don’ts: do not use complementary colors for text and background. Good to know for readability and visual aspect. *Complementary colors are those colors directly opposed to each other in the color spectrum.

Apply color harmony rules in your eCommerce website

Colors that look good together are called a color harmony. Artists and designers use these to create a particular look or feel. You can use a color wheel to find color harmonies by using the rules of color combinations. There are six rules of color combination:

Complementary – two colors that are on opposite sides of the color wheel,

Split-complementary – in addition to the base color, it uses the two colors adjacent to its complement,

Analogous – three colors that are side by side on the color wheel,

Triadic – three colors that are evenly spaced on the color wheel,

Tetradic – four colors that are evenly spaced on the color wheel,

and Monochromatic – three shades, tones and tints of one base color.

Five rules of color combination for website store
Rules of color combination for website store

Color combination rules for eCommerce websites

“Practice is the best of all instructors”, so let’s see color combination rules in action:

Target, furnishing and decor brand, goes with complimentary (main colors, red and cyan, are opposite each other on the color wheel). Such scheme adds vibrancy to your webpage:

Complementary color scheme for online store
The complementary color scheme for online store

London Philips, men’s clothing brand, looks strong and persuasive with the monochromatic color scheme:

Monochromatic color scheme for online store
The monochromatic color scheme for online store

And Gymboree, kids clothing brand, cause enthusiasm and excitement with tetradic one:

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]
The tetradic color scheme for online store

Create your color palettes with free online tools

Now it is time to go and experience unlimited possibilities of creating your own color palettes for your brand. Use these free online tools:

Adobe Color CC – Apply the knowledge you have received in this article about color components, Hue, Saturation, and Luminosity, and create your own color! Next, complement it with other colors using one of the color combination rules and, vualá, you have your first color theme!

Color Explorer and Canva – With these tools, you can quickly extract individual colors or a complete color palette from any image (like screenshots of webpages).

Color Calculator – This interactive color wheel will show you which colors work together and why.

Or, you can use palettes created by others with Color Hunt.

Color: Psychology behind eCommerce use

Now that you have mastered the techniques of color combinations, it is time to consider the psychological implications of using some color schemes, instead of others. You already control the “how” and the “what”, but let’s dive deeper, to discover the “why” behind your choices.

Certain color schemes are pleasant to the eyes and subject to favorable perceptions, while other color schemes are “ugly” and negatively perceived by most people. Your selection of color palette depends on the message you want to convey to your users, its tone and intended impact.

Yellow Color Palettes.This color conveys brightness, cheerfulness, energy, and optimism. However, it should be carefully used, to avoid eyestrain.

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]
Yellow color palettes in eCommerce

Orange Color Palettes. Orange is the color of enthusiasm, passion, energy, and joy. Vitality, fun, and abundance are strongly expressed by orange, altogether.

Red Color Palettes.Red – a simple, yet powerful color, that appears nearer than it is, and gives the impression of increased velocity. It suggests luxury and abundance, strength and warmth.

Pink Color Palettes. As a variation of red, the pink color has won a distinct name due to its expressive power. It is often associated with femininity, it is soothing and emanates a sense of warmth.

Violet Color Palettes.The violet color is generally associated with spiritual awareness and contemplation, and the power of introspection.

Blue Color Palettes. The blue color is best known for its soothing, calming effect. It also conveys security, trust, and communication.

Green Color Palettes.The green color is often associated with nature, natural, freshness, growth, balance and peace.

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]
Green color palettes in eCommerce

Black Color Palettes. Black is often associated with elegance, mystery, power, and authority. It can also be associated with the unknown.

Brown Color Palettes. The brown color instills a sense of reliability, support, earthiness.  It approaches the characteristics of black.

White Color Palettes.White means cleanness, purity, hygiene, both simplicity, and sophistication. It has the property of making spaces look wider.

Consider your eCommerce website audience demographics

This is one of the most crucial considerations. If your business targets a broad demographic, it can be difficult to pick an appropriate color scheme. It speaks to the importance of niching down and catering to a well-defined group of people. When you have a narrow niche, factors such as gender, culture, and age do have an impact on color preference. You have to consider the people you serve.

Gender

Let’s say your business targets women. Then you want to use feminine colors. Here’s how Sefora markets to young female audience:

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

If you’re marketing to men, these are the colors to stay away from: purple, orange, and brown. Instead, use blue, green, and black. These colors — blue, green, and black — are traditionally associated with maleness. However, it comes as a slight surprise to some that brown isn’t a favorite pick.

Age

“With maturity comes a greater liking for hues of shorter wavelength (blue, green, purple) than for hues of longer wavelength (red, orange, and yellow).” – Faber Birren.

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

As you can see, blue, green, and purple are the most popular among all age groups. What’s interesting is the preference of green in the younger age groups and the preference of purple in the older age groups.

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

Notice the color orange and its lack of popularity among older people.

Consider your eCommerce website industry

Certain colors appeal to certain markets. Some colors are more appropriate for luxury products while others are more appropriate for food items. Color psychology is not an exact science but you can leverage it to move in a general direction on your site.

Luxury goods

If you are selling luxurious goods, want to appeal to a classy audience, or are creating a business that’s bold in some way, then consider black as your primary color like this Swiss company:

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

Eco-products

Brands with a health and eco-conscious focus, like Babyganics, gravitate towards greens, blues, and yellows:

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

Food

Although blue is pretty much an all-round great color, it should never be used for anything related to food. Dieters have used blue plates to successfully prevent them from eating more. Evolutionary theory suggests that blue is a color associated with poison. There aren’t very many blue foods — blueberries and plums just about cover it. Thus, never use blue if you’re selling foodie stuff.

Children’s products

Orange helps to stimulate physical activity, competition, and confidence. This may be why orange is used heavily by sports teams and children’s products.

CHERRY ON TOP

The more unusual and unique color names can increase the intent to purchase. For instance, jelly beans with names such as razzmatazz were more likely to be chosen than jelly beans names such as lemon yellow. This effect was also found in non-food items such as sweatshirts.

As strange as it may seem, choosing creative, descriptive, and memorable names to describe certain colors (such as “sky blue” over “light blue”) can be an important part of making sure the color of the product achieves its biggest impact.

Closing

Not exactly rocket science but creating the perfect color scheme for your website does take a lot of knowledge and expertise. Therefore, we recommend you use pre-made design solutions available on our marketplace.

How to Choose the Right Color Scheme for Your eCommerce [Guide for Beginners]

With your customer psychology in mind and many years of web design experience behind, we have developed 17 conversion-oriented store themes that are made to grab your customers’ attention and guide them through the buying process. And if you need help with fine-tuning a theme, send us a free custom quote form! Communicate your needs and wants, the magic is on us…

FREE QUOTE FORM!

Share:
Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on pocket

Black Friday 2020

Big Sale starts on Nov. 25