![](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15130907\/colors-2-fi.png\")
<\/p>\n<\/p>\n
Color can affect us in unexpected ways. It can:<\/p>\n
If it can do all that, can it change purchase habits?<\/p>\n
<\/p>\n
Yep.<\/p>\n
The emotional effects of different colors are well documented.<\/p>\n
![\"the](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083247\/the-emotional-power-of-colors.png\")
<\/p>\n
Source<\/a><\/i><\/p>\n Obviously, each of these colors is a two-edged sword – it\u2019s easy for blue to come off as cold, or red to scare folks off.<\/p>\n But done right, color can be leveraged to affect conversions.<\/p>\n The effect can be stark.<\/p>\n For instance, 85% of shoppers say that color is their primary reason for buying a product. And 66% of people won\u2019t buy a product unless it comes in their preferred color<\/a>.<\/p>\n Speaking of which, what exactly are people\u2019s preferred colors? Can they be predicted?<\/p>\n Yes, but only vaguely. People choose colors based on how they feel at the time, though there are some constant trends.<\/p>\n Source<\/a><\/i><\/p>\n If certain moods can make us think of certain colors, the opposite is also true. Colors can trigger changes in mood:<\/p>\n Source<\/a><\/i><\/p>\n Which means we can use website design elements to trigger emotional changes in our visitors, increasing conversions.<\/p>\n Additionally, colors can strongly affect how a business is seen by visitors and customers. Colors contribute best to conversions when they reinforce brand personality.<\/p>\n It\u2019s a tightrope.<\/p>\n The right color will increase your conversions. And the wrong color will turn people away.<\/p>\n How do we make sure we’re using the right colors?<\/p>\n Here are 6 with a solid track record.<\/p>\n Scientists at the University of Durham published research in 2005 that showed that athletes who wore red were more likely to beat their opponents: \u2018We find that wearing red is consistently associated with higher probability of winning,\u2019 wrote Russell Hill and Robert Barton<\/a>.<\/p>\n Red\u2019s associated with urgency, danger and power. That sounds like a potent combination that you might want to step lightly around, and you\u2019d be right. You should use red sparingly. But you should absolutely use it!<\/p>\n Red triggers action. If you\u2019ve already primed someone to buy with great design (that isn\u2019t all bright red), and solid copy, then your red \u2018buy now\u2019 buttons can work great.<\/p>\n Every bricks-and-mortar sale ever: all sales signs are red, and it\u2019s not just a convention. By the time Black Friday rolls around, people are already geared up to go find something at 99% off and buy the heck out of it. The trigger they need is to buy from this store rather than that one, so sales signs are bright, urgent, act-now red.<\/p>\n Red is more effective for impulse purchases, so it\u2019s a common buy button choice on ecommerce websites. But it\u2019s more effective for B2B software vendors too. When HubSpot A\/B tested CTA button color for Performable, red out-converted green by 21%.<\/p>\n Source<\/a><\/i><\/p>\n Red seems to perform best across the board.<\/p>\n Source<\/a><\/i><\/p>\n Blue boosts sales indirectly. It\u2019s associated with calm, tranquility and stability, which means it\u2019s a popular color for financial institutions.<\/p>\n It\u2019s also a popular color whenever you want to make people think of security and serenity. So big-ticket items that have a lot riding on them often use blue.<\/p>\n Blue can boost sales indirectly, by dealing with anxiety before it arises. With red, we\u2019re trying to trigger nervous system arousal – we want people to sit up, take notice, and realize that now is the time to buy. With blue, it\u2019s the opposite – instead of exciting purchase intent, we\u2019re quelling anxiety.<\/p>\n That makes blue a good choice for background and conversion elements on websites that deal with intrinsically scary things like finances, medicine or insurance.<\/p>\n Most financial and insurance sites will use blue. Lighter blues give a sense of freedom and security, while darker blues are associated with tradition, seriousness and intelligence. Paypal makes hay with both, while other financial services sites go with royal and navy blues for their association with sober security.<\/p>\n Source<\/a><\/i><\/p>\n Note the use of a contrasting color – with the opposite emotional associations – for headings.<\/p>\n Check out Versions, too. Offering to open up SVN to designers and developers who aren\u2019t familiar with it (or want an easier interface), Versions uses both blue and green buttons – one for download, the other for buy.<\/p>\n Source<\/a><\/i><\/p>\n Use blue where your sales depend on projecting an image of reliability and seriousness. It makes good conversion elements against a white background, and blue and yellow text together are regarded as the most readable<\/a>. So despite being calming colors, they may be the most visible – and the majority of colorblind people are red-green colorblind and can see blue and yellow.<\/p>\n Green\u2019s associations are with the environment – \u2018green\u2019 is a one-word reference for the whole spread of natural, organic, environmentally friendly. So it gets used by businesses that want to appeal to similar audiences or that align with similar interests, even if there\u2019s no direct connection.<\/p>\n Is this yoga studio particularly environmentally friendly? Maybe. Probably it just appeals to people who regard that as a positive.<\/p>\n This instinctive association does have some evidence to back it up: studies suggest that being exposed to green, as opposed to other colors, can make people more creative<\/a>.<\/p>\n As well as its outdoorsy and environmental connotations, green is the \u2018go\u2019 signal on stoplights. Green conversion elements make sense for purchases that feel less like urgency, and more like permission – like buying high-end consumer tech.<\/p>\n Green makes a solid CTA and buy button choice.<\/p>\n Way back in 2010, RIPT Apparel decided to try their first A\/B test, replacing a black buy button with a green one.<\/p>\n Source<\/a><\/i><\/p>\n The result was a 6.3% conversion jump<\/a>.<\/p>\n Computing giant Dell seems to be reading this article. On their product pages, they use blue for reliability and intelligence – and a red offer banner to make me feel like it\u2019s urgent that I click it now.<\/p>\n Scroll down, though, and you can see that all their conversion elements are green.<\/p>\n White space and contrasting colors, or in places where it can dominate the visual hierarchy and command attention without screaming. If you think your buyers are more likely to need a green light than a fire sale, green buy buttons are worth testing too.<\/p>\n Green seems to work best on sites that sell consumer electronics, where it slightly out-performs red.<\/p>\n Source<\/a><\/i><\/p>\n Purple is associated with royalty, wealth and power – once, there were laws forbidding ordinary people to wear the color. In modern times, it\u2019s a bold color that isn\u2019t freighted with the \u2018do it now!\u2019 urgency of red, or the \u2018we\u2019ll help you with your taxes\u2019 seriousness of blue. It also comes with connotations of spirituality and creativity.<\/p>\n It\u2019s worth taking a look at who likes purple:<\/p>\n It\u2019s in the top three for women:<\/p>\n \u2026 and the bottom three for men.<\/p>\n Source<\/i><\/p>\n So we can think of it as a kind of \u2018pink for grown-ups\u2019 – don\u2019t brand with purple if your audience is mainstream adult males, and don\u2019t expect those people to be anxious to click on buy buttons in purple either.<\/p>\n Purple is a bright color, and it\u2019s complementary with yellow-green and analogous with pinks and blues. (Don\u2019t make your site green and purple unless you have designs on Gotham City.) So it often gets used on sites with lots of white and black as a stand-out splash for branding, menu items or conversion elements.<\/p>\n Roku, the TV streaming company, uses purple for its branding. It\u2019s also used for menu elements on the site.<\/p>\n On a practical note, purple gives a great standout color for branding and conversion elements in sites that use a muted blue – cream – brown color scheme intended to convey seriousness and competence. That\u2019s a common choice for financial businesses, but educational organizations like Pearsons use it to the same effect.<\/p>\n Bear in mind that the shade or tint will strongly affect how your purple elements come across. If you don\u2019t want them to read feminine, go for high saturation and deep shades, and pair them with blues. If you do, take it the other direction into strong, light hues and pair them with pinks and reds.<\/p>\n One thing about purple? It stands out. Make it bold for the right reasons, and you have a solid alternative to the BOB.<\/p>\n You wouldn\u2019t think that black would play much of a part in most websites\u2019 color schemes. And you\u2019d be right: most sites opt for white space, and a couple of strong colors. But black can be powerful.<\/p>\n The brands that use black to good effect are luxury or high-end brands, retailing to a mainly male audience. Rolls-Royce. Lamborghini. Rutgers University.<\/p>\n Notice the trend?<\/p>\n Black doesn\u2019t make great conversion elements because it\u2019s tough to see except as an outline. But a black and white color scheme automatically gives you contrast. Squarespace uses a white button on their black backgrounds:<\/p>\n On their lighter colored backgrounds, the button is black with white text:<\/p>\n That decision frees them to use a range of colors and hues in their imagery, knowing their black\/white branding will stand out among all of it.<\/p>\n Check out any high-end luxury brand with a male-oriented clientele and you\u2019re likely to see a lot of black. For instance, Rolls Royce:<\/p>\n![\"the](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083225\/the-colors-we-feel-wheel.png\")
<\/p>\n![\"the](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083211\/the-emotional-triggers-of-colors.png\")
<\/p>\n1: Red<\/h2>\n
What does red do for sales?<\/h3>\n
Where can you see it in action?<\/h3>\n
Where should you use it?<\/h3>\n
![\"performable](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083259\/performable-red-and-green-ctas.jpg\")
<\/p>\n![\"buy](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083218\/buy-add-to-cart-button-color-distribution.png\")
<\/p>\n2: Blue<\/h2>\n
What does blue do for sales?<\/h3>\n
Where can you see it in action?<\/h3>\n
![\"Paypal](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083251\/paypal-screenshot.png\")
<\/p>\n![](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083232\/credit-made-clearer.png\"){kind=spacer}
<\/p>\n![\"versions](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083144\/versions-homepage-screenshot.png\")
<\/p>\nWhere should you use it?<\/h3>\n
3: Green<\/h2>\n
![\"yoga](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083228\/treetop-yoga-studio.png\")
<\/p>\nWhat does green do for sales?<\/h3>\n
![\"non-colored](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083215\/non-colored-call-to-action.png\")
<\/p>\n![\"green](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083222\/green-colored-call-to-action.png\")
<\/p>\nWhere can you see it in action?<\/h3>\n
![](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083243\/dell-screenshot.png\")
<\/p>\n![\"Dell](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083207\/dell-checkout-page.png\")
<\/p>\nWhere should you use it?<\/h3>\n
![\"buy-button-colors-top-100-alexa-ecommerce-sites.png\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083254\/buy-button-colors-top-100-alexa-ecommerce-sites.png\")
<\/p>\n4: Purple<\/h2>\n
![\"colors](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083305\/colors-targeting-women.png\")
<\/p>\n![\"colors](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083307\/colors-that-target-men.png\")
<\/p>\nWhat does purple do for sales?<\/h3>\n
Where can you see it in action?<\/h3>\n
![\"roku](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083132\/roku-stream.png\")
<\/p>\nWhere should you use it?<\/h3>\n
![\"Pearsons](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083155\/welcome-to-peason.png\")
<\/p>\n5: Black<\/h2>\n
What does black do for sales?<\/h3>\n
![\"Squarespace](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083150\/squarespace-screenshot.png\")
<\/p>\n![\"Squarespace](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083124\/sqaurespace-screenshot-pink-background.png\")
<\/p>\nWhere can you see it in action?<\/h3>\n
![\"Rolls](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083203\/the-house-of-rolls.png\")
<\/p>\n
![\"Don](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083239\/being-unquestionable.png\")
<\/p>\n![\"keep](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083256\/keep-in-touch-orange-cta.png\")
<\/p>\n![\"feel](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083235\/feel-the-beat.png\")
<\/p>\n![\"red](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083159\/red-homepage-background.png\")
<\/p>\n![\"orange](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083303\/orange-call-to-action-example.png\")
<\/p>\n![\"orange](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083301\/orange-call-to-action-on-blue-background.png\")
<\/p>\n![\"Harley](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/15083138\/harley-screenshot.png\")
<\/p>\n![\"crazy](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/05\/26145241\/blogabtesting.png\")
<\/p>\n","protected":false},"excerpt":{"rendered":"