What are HEX Color Codes? (Unlocking the Code)

In today’s video and post, we unlock the mystery of what HEX color codes actually mean.

What You’ll Need to Follow Along

No fancy tools required to follow along with today’s tutorial – just a healthy supply of curiosity and interest to learn.

Why This Matters

I’m a believer that it’s always better to understand the tools that we use – especially ones that we use regularly – and I use HEX codes all the time.

From Procreate and Photoshop all the way to Excel and Word, these quirky color codes pop up everywhere, so while working on another fun color research project, I decided to try to decode these six-character mysteries.

What are HEX Color Codes?

HEX color codes are six-character alphanumeric values that represent colors.  They’re used by artists, designers, developers, and anyone who works with color to create and specify colors. 

Here are a few examples: 000000, FFFFFF, FA2355

Are They Just Random Codes?

This is where things get fun – even though they seem like a random sequence of letters and numbers, we can understand them. 

Cracking the Code

The first step to deciphering these six-character sequences is to divide each full HEX color code  into three pairs.

So…

Becomes 

The next step to cracking the HEX color code convention is to understand that each of the pairs represents a specific color in the additive RGB color spectrum.

The first pair in the HEX color code represents the red color value, the second pair the green color value, and the third pair is blue.

So another way to visualize the code above would be like this

Now that we understand this concept, you might be wondering…

What’s Up With Those Letters?

The next step in deciphering this HEX color code mystery is to understand that the letters in the codes actually represent numbers.

We’re used to using a scale of numbers from 0 to 9, but what if we used some letters to expand that range?

Say if we used the letter A to represent the number 10, B to represent 11, all the way up to F which would represent the number 15… 

This scheme is actually a defined number system called the “hexadecimal system” and allows us to represent a wider range of numbers (256 of them) using just two digits or characters (like FA in the example above).

Building the HEX Color Code

Now that we understand that each pair of letters or numbers in the code represents an amount of Red, Green, and Blue to be mixed and that the letters translate into numbers (note that translating the letters to numbers can be a bit wonky – I explain more in the video and in the free guide that you can download below), there’s only one mystery left to understand. 

How on earth to Red, Green, and Blue combine to make all of the colors we’re familiar with – like yellow for example? 

In school, we usually learned that the primary colors are red, yellow, and blue and that we get all the other wonderful colors by mixing those… 

The key to unlocking this final mystery is in a word I mentioned earlier – RGB is an additive color scheme. 

RGB is the color system that’s used on our digital devices like phones, monitors, and TVs and, without getting into all the sciency details, this is how the colors combine:

• Red + Green = Yellow
• Red + Blue = Magenta
• Blue + Green = Cyan

In HEX color codes, these color combinations merge to make all the colors and hues we’re familiar with the amounts specified by the each RGB hexidecimal pair in the sequence.

Congratulations, you now understand HEX color codes!

Test Your HEX Decoding Skills

As a quick test, can you figure out which colors each of these represent?

• 000000
• FFFFFF
• 00FF00
• FA2335
• 212121
• DADADA

Watch the end of the video to check your answers.

I’ve also created a handy HEX Color Code Guide – you can get it (and a ton of other creative resources) by joining my newsletter community here:

Note: This post and the photos within it may contain affiliate links. If you purchase something through the link, I may receive a commission at no extra charge to you.

Visit the Shop

Check out the collections of Procreate brushes, calligraphy instruction toolkits, mockups, and more by visiting the shop.

Whether you’re picking up a pen for the first time or have been writing for years, learn all the skills you need to enjoy the magical art of broad nib calligraphy with The Blackletter Masterclass. With over 10 hrs of video instruction and lifetime access, comfortably explore the massive library of content and learn at your own place