How much thought have you given to the psychological significance of your website’s color scheme? If you just went with the colors you happened to like the most, there’s a strong chance that your website isn’t performing as well as it could — this is because colors have different associations, and a simple color swap can hugely change how a page comes across.
In essence, you need to think carefully about the themes and qualities you’re trying to convey, and choose colors that will represent them (with the right tool underpinning your site, changing color should be extremely easy). So what should you go with? Let’s take a look at 5 tips for picking colors based on your requirements:
Use red for vitality and action
You’ve likely heard of the term “seeing red”, and for good reason: red is the color of oxygenated blood, and when we get angry, our quickened pulses cause the blood vessels in our eyes to become more apparent. It’s also a sign of danger in others: someone with reddened skin could be a threat, and someone with a bleeding wound could indicate a nearby predator.
Because of this, red is powerfully associated with vitality and action. It ties into the primitive concept of fight or flight, making it perfect for buttons and general calls to action. Consider its use in the YouTube logo: the company wants people to get involved, to start channels and get commenting, so red is a perfect eye-catching fit.
On your website, try using red for CTAs and any other elements you really need to get attention. Use it very sparingly to avoid watering down its potency, and surround it with light contrasting colors to enhance its strength.
Use blue for insight and reason
Blue is cool, calm, and collected. It’s the placid color associated with large bodies of still water. This makes it perfect for websites that are all about professionalism, trust, and security — here are some examples. Whenever you need to get across important information, or reassure people about the quality of your brand, blue is a great choice.
An interesting example here is the Facebook logo. Because the company asks its users to share the details of their everyday lives, it needs to convince them that their data will be safe within its systems. If the logo were yellow, it would seem rather less stable.
On your website, try using blue for backgrounds, containers and outlines. That way, it’s there to support the key content while allowing showier elements to get vital contrast. It also combines excellently with white.
Use green for growth and prosperity
Green is the color of natural renewal, and we readily associate it with health and growth — but because of paper currency, we also associate it very strongly with wealth (at odds with red in this regard). On the whole, if you’re trying to inspire people to make positive and consistent changes, green is a very strong choice.
A perfect example of green used well is the Shopify logo. The whole point of the company is to empower aspiring entrepreneurs, giving them the tools they need to grow their businesses, but it’s still tough to take the first step — using color that alludes to steady growth can only help.
On your website, try using light greens for backgrounds to provide a fresh and natural feel, and deploy bold greens in contrast with reds for classic yes/no comparisons (e.g. comparing your brand, product or service to another).
Use purple for luxury and power
Purple has traditionally been viewed as a very regal color, largely because purple dye used to be so obscenely expensive that only the wealthiest people (often royals) could afford it. And even though the link isn’t inherent, it’s still lodged so firmly in the public consciousness that it’s persisted long after purple became a reasonably commonplace color.
If you’re offering something expensive but worth it, give purple a try. Think about the Cadbury logo: the presentation has always been about the superior quality of the chocolate and the brand in general, making it feel like a worthwhile indulgence.
On your website, try using dark purples as backdrops and overlays for a futuristic and innovative feel — or even light purples and pinks if you go for a pastel vibe in general. Either way, material design is a good direction to take.
Use yellow for energy and vibrancy
Yellow is an interesting color to use because it can fit different scenarios very well. Need to scare someone away? Yellow is great for warning signs. Want to show a childlike enthusiasm? Pastel yellows are ideal. Essentially, yellow conveys energy, and that can mean different things, including emotions ranging from fear to excitement.
So when should you use yellow? It’s really good for fresh ideas and creativity, so if you’re running a startup with radical ideas, it can highlight that. And that association to excitement is undeniable: take the Chupa Chups logo, the original form of which was actually designed by Salvador Dali of all people. The modern version has a bold yellow that really stands out to kids.
On your website, try using yellow as a framing color for pieces of content you want to feel intensely vibrant — using it for things like text doesn’t tend to work so well, but it makes a great background for text or imagery (it’s bold, but it still contrasts well with light and dark colors).
Color psychology is an often-overlooked element of website design. When figuring out your desired aesthetic, keep these tips in mind, and try to choose colors that will psychologically suit whatever you’re trying to achieve.
Rodney Laws is an ecommerce platform specialist and online business consultant. He’s worked in the ecommerce industry for nearly two decades, helping brands big and small to achieve their business goals. You can get his advice for free by visiting EcommercePlatforms.io and reading his detailed reviews. For more tips and advice, reach out to Rodney on Twitter @EcomPlatformsio.