How to Use Website Colors Properly

Fiona Leung
Fiona Leung • Posted on Jul 14, 2015

Colour Palet

How to use website colors properly and stand out from the crowd.

Color is powerful. We speak of color as a means of conveying a mood, sparking an emotion and deciphering meanings in our everyday lives.

Do you remember the last time you colored something inPerhaps you have painted your kitchen wall of your newly furnished apartment before or color coded important meetings on your calendar? Well, you would understand, in turn, that color does much more than create an aesthetically pleasing wall or calendar. As a matter of fact, color directly affects how we interact with the object at hand or even react to it. A red colored kitchen wall can increase one's appetite while a red color coded appointment in a calendar signifies importance or urgency and thus requires more attention.

Color is powerful because it controls our perceptions and affects our mood and, most importantly, our interactions. 

Color and Usability

Now let's talk color in the context of website design. In addition to making a website look good, color can also help your audience use the website. Essentially, color in web design can shape and enrich a visitor's experience and interaction with the website. 

Here's an example to demonstrate how color can enhance a user's experience:

Website: Private Wealth Management LLC

advisor websites

Private Wealth Management utilizes a royal blue-gold color scheme that not only paints a luxurious, warming and inviting theme but also uses its complementary color pairing to help potential customers persuade them to take action. For instance, the gold navigation menu at the top stands out against the blue background image. This entices viewers to click on the menu buttons as it draws their attention. As you scroll down the homepage of the site, the buttons become royal blue since it complements the pale gold/orange tone in the background.

Colors, when paired in the right way, can enable effective call to actions. 

Color and Engagement

Not only can color aid in usability of a website but can also focus user's attention and coax them into engaging with it. With the right colors, you can pull users into the design and content of your site. 

One of the major rules of website design is to avoid frustrating the user to the point where they simply want to leave the site altogether. This often occurs when a visitor cannot figure out how to navigate through the website themselves. Thankfully, color can help them start off on the right foot. Check out these examples below:


AllGood Financial applies a consistent color hue, varied in saturation and brightness levels, to different elements, helping the user better engage with the website. The magenta colored buttons are consistent in functionality and thus avoids any confusion on the user's side. Hence, enriching the engagement level of the site.

Final Tips

To wrap this article up, here are some essential tips on how to color your website:

  • Think of color as not only a means of creating an aesthetic appearance but also for capturing viewers' attention and guiding them through the site.
  • Use a complementary color palette to help viewers use your site effectively and with ease.
  • Consistency is key. If you are using orange colored buttons, use the same color for the rest of the buttons of the site (keeping in mind consistency in functionality of course) unless you want to emphasize importance to a particular button. In that case, try using a complementary color to grab users' attention.
  • Simple is more. Don't overload your site with an array of colors. For example, if your logo is purple and green, try to apply these colors throughout your site as accents.

Happy coloring! 


For more information on how you can get your own financial website, book a demo today.


About Advisor Websites

Founded in 2012, Advisor Websites specializes in helping financial advisors stand out and grow their business online with conversion-friendly, personalized websites and targeted digital marketing solutions, all which follow FINRA and SEC guidelines.

Disclaimer: The content of this article is for informational purposes only. If you are planning to implement a new marketing practice and are unsure what the regulations are, always contact your compliance department first.

Recommended Articles