If you’re like most brands, you’ve probably spent a lot of time studying who your customers are and what they prefer. Your brand colors are ones you’ve tested thoroughly and used as you built your company’s image. Those colors have an emotional impact and people expect to see them aligned with everything you do.
One older study conducted by Kissmetrics found 92.6% of people feel visual affects their purchase decisions more than any other sense. Around 90% of their assessment is based on color. Colors have a powerful emotional influence on people. Depending on your target audience, they can make or break your conversion rates.
What happens when your brand colors hinder your web design instead of helping it? For example, you established your business and embraced a color palette in the early days, only to find those colors don’t translate well online. Perhaps you chose yellow and lime green and the colors just wash out your pages.
Fortunately, there are many things you can do to use your brand colors for recognition while still giving your site excellent user experience (UX). Here are some of our favorites along with a few examples so you can see how other brands embrace the effort.
1. Limit Bright Hues
If your brand colors embrace eye-catching shades of red, orange, fuschia or some other vivid hue, limit how much you use it. Perhaps your logo is an explosion of color, so you need to tone down your background a bit.
Think of your website in terms of layers. If you plan to have a bright logo on top, you’ll want a layer under that offers some contrast, such as white or pastel. You may also want to limit the number of colors on your page and combine complementary shades for your calls to action (CTA) and accents.
Stoov uses a bright orange for their logo. Instead of adding in too much orange and overwhelming the viewer, they use it in their logo, in the tags on the products showcased and for the CTA. Note how they used a very muted and soft green background to allow the orange to pop. Green is complementary to orange, giving the page a fun appeal.
2. Be Consistent
Whatever layout you choose, make sure you’re consistent throughout your site for an excellent UX. You don’t want to use a color logo on the home page and then swap to a black and white logo on other pages. Of course, rules are made to be broken, but it’s important not to confuse your customers.
3. Add Neutrals
One of the easiest ways to implement your color scheme on your website is to use it as accents and implement neutral shades to give the eye a break from all the pops of color. Note how big brands use whites, blacks, grays and tans to showcase content without overwhelming the user.
Think of your neutrals as part of your negative space on your site. Tap into a white background and high contrast black text for your body paragraphs. Use your brand colors for images, headings or CTAs.
Nev’s Ink has brand colors in blue and a deep purple-pink. Note how they use a white background to make their clickable links pop. The blue draws the user’s eye. The entire site has a navigational hierarchy the user comes to rely on. CTAs are fuschia. Descriptive icons are blue. Headlines might be either.
4. Tap Into Emotions
Understand the psychology behind the colors you choose. Each hue elicits different emotions in the user. These can vary based on personal life experiences, though. While one person might love the color red and feel excitement, another may associate it with blood or a bad experience and shy away from the shade.
Take the time to survey your customers. Conduct split testing to see if slight variations in tone make a difference. How well do the shades contrast with other elements on your page? Can you adjust your brand color palette slightly so it appears similar to your actual colors but contrasts better or pops on your website?
5. Consider Gender
Different genders prefer some colors over others. For example, both sexes love the color blue. However, men are more drawn to browns and greens. Approximately 33% of women dislike orange and 20% dislike brown.
If you sell products better suited to one demographic than another, it is wise to choose colors the audience best relates to.
Thrive uses blues and a pop of different shades of pink. The site caters mainly to women, so it makes sense they’d tap into the colors most beloved by their audience. The combination gives the site a festive, uplifting feel.
6. Use Color Palette Tools
Still unsure of which colors might look best in your design? There are dozens of free color palette tools available on the world wide web. Punch in the main color or two for your brand and see what complements your brand’s look.
You may find some combinations look better than others. Ideally, you’ll use your choices on your website, social media and in newsletters you send out via email. You want to create a consistent look across all mediums, so don’t be afraid to try different combinations until you land on the one that works best for your users.
If you still aren’t sure how well your brand colors are converting site visitors into customers, ask for feedback. Talk to your regular customers about what they like and don’t like. If someone abandons their cart, send them an email and ask for feedback. Try different colors and designs until you hit on the ones getting the results you want for your site.