WPblab EP79 – The Psychology of Color in Design w/ Meagan Hanes

In web design, brand creation, and even creative, the psychology of color matters. In this episode of WPblab, Designer and Developer Meagan Hanes will talk us through some of the considerations on how color affects us — as consumers.

Meagan Hanes

Designer/Developer since the 2000’s

Developers often struggle with design – color can be one of the most challenging aspects

Take a design magazine, rip it up and start making a pinboard in real life – it’s a great way to start training your eye


Communicating meaning in your brand’s colors

  • There is a lot of symbolism in color choices
  • Generally speaking, reds are passionate, greens and blues are soothing, nature colors
  • Happy and generous can be shown with warm yellow colors

McDonald’s chose red and yellow because they make you hungry but they are also bold, agitating colors that cause customers to leave quicker, which is desirable in fast food!

When communicating your branding, the colors you pick can make or break your message.  Best to pick a color or two and stick with them! Keep it simple!

Orange and Green have the highest click-thru rates

Contrasting color is important – you can get color fatigue when faced with a page or design that is based all on one color.  Your users may not notice a button if it’s in the same color as everything else on your page.

I use this a lot http://paletton.com/
WCAG is important too – Making sure there is enough contrast for visually impaired people can see it.

If you removed the color from your design, it should still work and communicate clearly in black and white

There are sites where you can test colors for accessibility to make sure people with different color blindness challenges can see it as intended

If you take off your glasses or squint at your page and can’t see what the page is doing because of color distraction, etc. you need to rethink your design

Everyone’s perception of color is ultimately different.

People are starting to understand warm and cool light and what that means.

Pinterest is a great tool for exploring branding and colors, use it for yourself and your clients

You can choose green for your eco-friendly company, but if you don’t back up your marketing with action, no one will believe you

Pick a main color and then maybe a secondary or tertiary color and stick to those – it gets especially hard to change colors as a company gets bigger

Supreme Red

Heineken Green


Brand Guidelines

“Like a reference guide to your company’s soul”

  • Standardized color definitions
  • Layout, sizing, fonts, etc.

Maybe go to art shows and listen to how people react to get a better idea of how people respond to art and color

Design should be somewhat rigid (color) but it should also be iterative – with feedback/time, sometimes your ideas/direction will change

Tiffany Blue

Colors also convey feeling and emotion – beachy colors can bring to mind memories of the smell of salty air or the feeling of sand between your toes and the sound of waves


Pinkest Pink



The Blackest Black Exclusive Rights



Graphics & Logos


Pantone 1665

CMYK 6, 86, 100, 1

Hex #d54e21

RGB 213, 78, 33

Official Logos and Typeface


Your color palette on your website should follow what you’ve established in your brand guidelines. If you don’t have one yet, you need to develop one or get help creating it!  Fonts, logo usage, size, proportions, colors, accepted uses, etc.  Even if you don’t have the money to hire someone to create it, you could even just start a google doc and start documenting the colors, fonts, etc that you decide to use.


Document what you use and save a record of what you do for your clients.  If they come back for repeat business (which they should!), it will save you a lot of time!


Weekly Watercooler Discussions about WordPress and it’s community.

17 responses to “WPblab EP79 – The Psychology of Color in Design w/ Meagan Hanes”










Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.