How to find the hex code of a colour

Do you ever need to find out the hex code of a particular colour? Then, you need a colour palette generator. Canva has a great one that’s free to use! Here’s how to use it.

There are other options than Canva which I’ve included in my final paragraph.

 

What is a hex code?

Hexadecimal Colour Coding (Hex Codes for short) is the way that hues (colours) are precisely defined by a graphic designer to communicate to others the exact shade, tone, tint and value of colour they want to reproduce.

Using Hex color codes it’s possible to pinpoint and name 16,777,216 individual colours!

Without going into too much detail a hexadecimal code is a six-digit number used to define precise colours on a computer - most graphic designers will be using either SVG (Scalable Vector Graphics) to design with or HTML (Hypertext Mark-up Language) to build websites, so the Hex system is the most widely used, although other systems are also available.

This is just an example of the 16,777,216 individual colours you can choose from:

Hex colour Chart

There is no real difference between RGB and HEX colors; they are simply different ways of communicating the same thing – a red, green, and blue colour value.

HEX, along with its sister RGB, is one of the colour languages used in coding, such as CSS. HEX is a numeric character-based reference of RGB numbers.

 

Transcript

Hi, this is Kim Morrison from Be Your Own Graphic Designer. Do you ever need to find out the hex code of a particular colour?

Then, you need a colour palette generator.

I should start by saying, that a hex code is a six-digit alphanumeric code that gives you an easy way to specify a colour online. Using the hex code, which always starts with a hash, or pound sign, if you’re in the USA. You’ll get an exact match every time.

But, if you don’t know the hex code or the colour you want, or you want to pick out a specific colour in an image because you want to use in the text, or to match it somewhere else. Then, you need to use a colour palette generator which will give you the hex code you need.

 

Canva’s Color Palette Generator

And I’ve just discovered a colour palette generator from Canva. I think it’s been around for some time, but I’ve only just discovered it. As the previous one doesn’t seem to work anymore. I was doing a search online, on Google, as you do, and discovered a Canva option which is great because I do so much in Canva anyway!

 

A Demo Example

I thought the best way to demo this was to use an example of something I’m currently working on. I’m going to go to my design screen in Canva, and here you can see the design I want to change. I’ve already done one for November. This is the October social media quotes sidebar. It’s a copy of a sidebar I’ve already made.

I’m now just going to click on it, so it goes into the design screen, and I’m going to start to edit it. This is my cheat’s way of doing things. Rather than starting again from scratch, just copy and paste and change it!

 

Editing your design

The first thing I’m going to do is change the month, because it’s going to be for November, and I want to keep the sidebar format. And I use this for Pinterest, as well as it’s a good size and shape for Pinterest, too.

I’m going to use it. I’ve changed that (the title) to November, and now I need to upload the November image. Actually, I have done this already. I can just get rid of this one. And, I’ll insert this one.

So, just drag this over. I could have just clicked. I’m going to make it a little larger, so it fills the sidebar a bit better. And then, because I have no eye for these things, at all, as you can see, I’ve now used the grid lines on Canva, which are fantastic. I actually just lined that up.

But, my images for November have a blue background. So, I want to match the other sidebar that Sammy has done for me, the November Social Media Planner, so that they look the same. Rather than having two contrasting colours.

 

How to Use the Colour Palette Generator

I’m going to go back to the colour palette generator, and I will include this URL in the post,  https://www.canva.com/color-palette when I actually post the video. I will upload an image. But, first of all, I’m going to try it with one of Canva’s demo images.

I’m just going to click on this. So, you can do this to experiment. It will load an image, and as you scroll down, it gives you the exact colours. So, you’ve got this pale goldenrod, the engine red … Oh, yes, it was the ladybird!

This has picked up five of the main colours from the image, and it gives you five, but that should be exactly what you need to be able to match something to it. Whether you’re trying to add a background or whatever you are trying to do.

Over here it says, upload another image which I’m going to go to. I’m going to upload my other sidebar. As you can see, this other November sidebar has got a blue background, and that’s the colour that I want.

This is called light sea green. I’m not sure I ever would call this light sea green, because, to me, it looks very blue. That’s what Canva’s color codes called it but, it’s the colour I want! So, I’m just going to hit copy. It’s now been copied.

 

Changing the background colour

I’m going to go back to my sidebar. I’m going to click the outline of that. As you can see, the colour bar’s come up, and matches the colour that’s in the background already.

I click on this, go to plus, and then all I have to do is copy the hashtag in. If I do this correctly. That colour in. The best-made plans. So, it’s very easy to do. But, you can see I do make mistakes.

I’m going to rename this, just so I know I’ve got the correct description. I’ve taken the copy out, renamed it to November. It’s so easy to do, as you can see.

It’s the quickest way I found of finding the colour you want. And the good thing about the Canva color palette generator is it actually lets you copy the colours really easily. Whereas the ones I used previously didn’t let you copy the code So, you just had to remember it or write it down. This is really straightforward. Very simple.

And that’s all there is to it. I’m just going to download that, and then I can actually put my sidebars on my website.

I hope you found that useful. If there are anything, other hints and tips I can give you on Canva, do let me know, and I’ll put together some short videos to help.

 

Other Color or Colour Code Options

Here’s a link to another hex color finder website at w3schools.com.

On this website, you can select any colour you like from the full selection available and it will give you the code - just copy it down and you can be guaranteed to replicate that colour again and again and again perfectly!

You also can add something like the ColorPick Eyedropper extension to your Chrome browser toolbar. This is a zoomed eyedropper and color chooser tool that allows you to select colour values from webpages and more. It gives you instant access to both the hex and the RGB code of any colour.

Takeaway Tip:

Canva’s Colour Palette Generator lets you find the exact color code for a colour in an image

Canva's Colour Palette Generator lets you find the exact hex code for a colour in an image #Canva Click To Tweet

If you like the images in any of our blogs, similar images are available for you to buy and download from our Collection, together with instructions on how to make your own images in our How-To section.

And remember, I’d love to hear from you, so please leave a comment below or come and join us at Social Media Made Stylishly Simple, our FREE Facebook Group, and leave a comment there.

Kim

Pin It on Pinterest

Share This