How to Update Your Website Colour Palette Using Showit

Free Resource Library

Start your website transformation with our collection of free Showit templates. Click the button below to get INSTANT access.

Sign Me Up!

yes, please!

How to Update Your Website Colour Palette Using Showit

Today, I am going to show you how to update your website colour palette using the Showit platform. 

Colour is extremely important when it comes to creating the overall vibe and style of your website. As a key component of your visual identity, it has the power to increase brand recognition, build trust and establish brand loyalty.



Once you have determined your brand’s colour palette, maintaining consistency throughout your website, social media posts and other promotional material is essential. 

Fortunately, the Showit Platform makes it very easy to maintain a cohesive colour palette throughout your site. You can find your colour palette settings under Design Settings on the left-hand side of the dashboard. 


Prefer to read instead? View the video transcript below.

The colour palette section is made up of a selection of eight colours. When creating your palette however, I would recommend only using up to 4-5 of the colour fields. You want to avoid colour overload. Too many colours in your palette can create a sense of confusion. 

As you can see here under the ‘Site Style’ tab, the colour palette is up the top of the screen and the font selection is down the bottom. I will be doing another video on how to select and update the fonts which I will post a link to below once it goes live. 

In my case, I have a colour palette which consists of 5 main colours. When you have a bold colour palette such as this one, you want to offset it with white as much as you can. White is your friend and using it to your advantage will help you to create a clean and professional style. 

Trying to add all of these colours onto one page, could be very off-putting and overwhelming. Therefore, I tend to use the dark grey for text, pink and green as my main accent colours and the remaining colours very sparingly throughout my site. Remember, less is usually more. We don’t want to bombard our audience with a colour overload. 

You may have noticed that each colour is assigned a number. If we go back to the homepage and select our call to action button, we can see that the colour number 4 has been selected for this particular design element. 

If we decide to change the primary palette at any point, this will update the colour selections for the entire site based on these number assignments. We can either drag the cursor over the colour selection or enter what is called the HEX code if we have it. 

Bonus Tip: Found a colour you love, but not sure of the HEX code? A free tool called ColorZilla will allow to easily extract the colour code from any website page so you can save it for future use. I’ll post the link below. 

If we go back to the Call to Action, you can see that using an additional colour outside of the main palette is possible. However, I generally wouldn’t recommend doing this. As I said before, using too many colours can create confusion and consistency is key when it comes to creating an impactful visual identity. 

So there you have it! I hope you have enjoyed today’s video. Please leave a comment below if you have any questions. I am happy to help! I will be releasing a brand new Style Sessions episode every Tuesday so don’t forget to subscribe to the Style Maker Studio channel to receive an update as soon as it goes live. See you next week!

*This post may contain affiliate links. Please see our Disclosure for more information.

Love this post? Share it!

Download now

Perfectly crafted offering? Check. Website traffic? Check. Leads? Nowhere to be seen! Stop sending your fans to a website that doesn't work! Download the Website Transformation Roadmap and turn your site into a selling machine. 

The Winning Website Roadmap

Turn Browsers into buyers