[intro]When you have completed this Guide, you will know how to use colours on your EKM online shop, learn how to find hex codes and use the Colour Picker tool.

[/intro]

[summary]

  • How to find out what your hex codes are
  • The Colour Picker Tool

[/summary]

If you’ve not owned an online shop or website before, it’s important to learn how to identify different colours from images and text to be able to incorporate them into your project. Before you begin designing your EKM online shop, it's essential - especially if you've not yet designed your logo - to select a colour palette for your shop. Ideally, this should consist of no more than four colours that complement each other. Not every colour should be used in the logo but limiting your palette to four colours helps your brand be easily identifiable, even if your logo isn't always visible in the area that your customer is currently viewing.

[tips]If you’re still formulating the colours of your shop branding, websites such as Color-Hex are a fantastic resource. Simply type in the name of a colour into the search bar to see lots of different shades of that colour with the hex codes listed beneath. You can also click 'Palettes' on the top right-hand side of the page to see suggestions for different colours that work well together.[/tips]

Online, colours are labelled with hex codes which are used in coding to create websites and in graphic design. If you’ve not seen a hex code before, they are comprised of a hashtag symbol and six digits, comprising of letters and numbers, like this:

#000000 = Black

#ff00000 = Red

#0078ff = Blue

#4ad811 = Green

How to find out what your hex codes are

Before you begin, you ideally need to have the hex codes for each of your chosen colours. If you already work with a graphic design program such as Photoshop, you can easily find out what your hex codes are on there.

However, if you’re not using a graphic design program, you can also find out what hex codes your colours are quite easily using a free extension on Google Chrome (an extension, if you’ve not used one before, is an app you can add to your Google Chrome browser which will help you perform specific tasks. Many of them are free of charge and very useful!).

1. If you click here, you can install the ColorPick Eyedropper extension to Google Chrome. When installed, you’ll see it as a little colour wheel symbol in the top right-hand corner of Google Chrome:

2. To use the extension, simply click the colour wheel symbol and hover your cursor over an online image to see what colour it is, like this:

Therefore to get the hex codes for a specific colour, view the image, logo or colour online and use the ColorPick Eyedropper on your browser to identify the hex code of the colour to use this colour on your own EKM online shop in elements or within Design Images.

[tips]For best results, ensure that your images are well-lit - especially if the colour is on a photograph - so that the colour is as ‘true’ as it can be.[/tips]

The Colour Picker Tool

1. Throughout the EKM online shop platform, you’ll see the Colour Picker Tool. It is usually indicated as a small box, like this:

2. When you click the box, this opens the Colour Picker Tool. You can drag the circle in the largest window to select a shade, and use the slider to the right to select a base colour. There’s also a field for you to add in a specific hex code if you know it. When you have finished selecting your colour, you click the green tick button to apply it:

[more]

[/more]

[contact] If you need our help with your EKM online shop, contact your Ecommerce Expert or the Customer Support Team, who will be able to point you in the right direction. We're open from 8am-6pm weekdays and 9am-5.30pm weekends. If you'd like to suggest a feature or an upgrade on any of the EKM platforms, please let us know on the EKM Suggestions Board. If you have a non-account-specific question to ask the EKM Team, join us in the EKM Community. [/contact]