How to Create a Custom Colour Palette for your Snug Theme

Each theme from Snug Designs is easy for you to customise with your own colour palette, and the designs are crafted to make sure the whole design will look beautiful with your own colours!

The Elements of Your Colour Palette

Each colour palette has six colours in there for you to choose from and they are arranged from lightest to darkest (Colour 1 to Colour 6). Each colour matches up with certain areas on the theme to make sure it is used in the best way.

See how this works below:

  1. Lightest colour to be used for main backgrounds and light text
  2. Second lightest colour
  3. Lighter medium-toned colour
  4. Darker medium-toned colour
  5. Second darkest colour
  6. Darkest colour to be used for dark background areas

If you already have a brand colour palette and have less than 6 colours, you can either select slightly different shades of the colours you already have or feel free to select the same colour for two of the shades. This creates a more minimal look on the design but if that works for your brand, that’s all good!

How to Create a Great Colour Palette

Don’t have a colour palette already? Well here is how to create one which fits perfectly with your brand:

  1. Do a bit of brand discovery. Have a good hard think about your brand values, your audience and the mood you want to portray with your brand. Make some notes if it helps!
  2. Set up a Pinterest board. The fun bit! Make a Pinterest board and turn your brand discovery into something visual. Pin patterns, graphics, photos and design which inspire you AND fit in with the brand discovery.
  3. Pick out palettes. From your board, you should be able to see some themes in colour and style. You may even have found a colour palette graphic which you love which you can take from.
  4. Find the HEX codes. Use the colour picker extension from ColorZilla to pick out the HEX codes of the colours you love.
  5. Create a style guide. Use the free colour guidelines you get with the theme to paste in your colour and the HEX codes so you can use them in the future!

Now you have your palette, you can add it to your theme…

Adding Your Colours to the Theme

To add your colours to you theme start by opening up the site editor (Appearance > Editor). Once you’re in the editor click Styles to open up the global styles panel, then click on Colors.

Here you’ll see you have the option to manage the colour palette for your website. The first thing we’re going to do is set up the colour palette for your website. To do this, click on the colour palette.

Here you will be able to see the default colour palette for your theme. You can replace each of the colours in this colour palette with colours from your own colour palette. To change a colour, simply click on the colour you want to change and then either use the colour picker tool or enter the hex code of the colour you want to use.

Once you’ve chosen your colours, they will update on the website and you will be able to see your new colour palette in the preview window!

Download our free colour brand guidelines!

Want a handy style sheet so you can pick your brand colours and make sure you use the same ones every time? We’ve created an easy to use guidelines sheet to go hand in hand with this blog post! Sign up to our newsletter below to download the cheatsheet for free:

Pin this post on Pinterest!