Hex Hue

Can you read a hex colour code? Match 10 colours to their codes, and codes to their colours.

Level

EasyMediumHard

Colour0/10

Right0

Best–

Which hex code is this colour?

#3A7BD5

Hex Hue

Match 10 colours to their hex codes.

Click an answer, or press 1 to 4 (or A to D). Then press Enter for the next colour.Tap an answer, then Next colour.

Enjoying Hex Hue? Share it:Post on X

About Hex Hue

Every colour on a web page is written down as a code like #3A7BD5. Designers and front-end developers read these codes all day, and with practice you can see a colour in your head from its code alone. Hex Hue is a quick way to build that skill.

Each round has 10 questions. Some show a colour and ask for its hex code; others show a hex code and ask which colour it is. After every answer you see the right one with its RGB values, so each question teaches you something.

How to play Hex Hue

Choose a level: Easy (wrong answers are clearly different colours), Medium (wrong answers are nearby shades) or Hard (wrong answers are very close).
Press Start. A colour or a hex code appears with four possible answers.
Choose the answer you think matches. The right answer is then marked, with its RGB values.
Press Next colour to move on. After 10 questions you see your score.

Hex Hue controls

Keyboard
Choose an answer	Number keys 1 to 4, or A to D, or click it
Next colour	Enter (the Next button has focus)
New round	N
Sound on or off	M

Touch screens
Choose an answer	Tap it
Next colour	Tap Next colour

Hex Hue rules

How hex colour codes work

A hex code is three pairs of hexadecimal digits: red, green and blue, in that order. Each pair runs from 00 (none of that light) to FF (all of it, 255 in decimal). So #FF0000 is pure red, #FFFFFF is white and #000000 is black.

#3A7BD5 has a little red (3A is 58), a fair amount of green (7B is 123) and a lot of blue (D5 is 213): a mid blue.

Questions and levels

Each question has 4 answers and exactly one is right. The colours are random. The wrong answers are other colours a set distance away from the right one in RGB space: far apart on Easy, nearby shades on Medium and very close on Hard. Wrong answers are also kept apart from each other.

Scoring and records

Each right answer scores one point, out of 10. There is no clock, so take your time. Your best score and the number of rounds played at each level are saved in this browser on this device.

Colour vision and screen readers

Hex Hue is a colour game, so it is hardest for players with colour vision deficiency; nearby shades on Medium and Hard may look the same. With a screen reader, colours are described by their RGB values, which turns each question into a hex-to-RGB conversion.

Tips and strategy

Read the three pairs separately. The biggest pair tells you the main colour: a high first pair means red, a high second pair means green, a high third pair means blue.
Equal pairs make grey: #808080 is middle grey, and the higher the pairs the lighter it is.
Red and green together make yellow, red and blue make magenta or purple, green and blue make cyan or teal.
Only the first digit of each pair matters much. #3A7BD5 looks almost the same as #307DD0.
Low numbers everywhere mean a dark colour; high numbers everywhere mean a light, pale one.

Frequently asked questions

What does a hex colour code mean?

It is the amount of red, green and blue light in a colour, each written as a two-digit hexadecimal number from 00 to FF. Browsers mix the three to show the colour.

How do you convert a hex code to RGB?

Convert each pair from hexadecimal to decimal: the first digit times 16 plus the second. For #3A7BD5 that is 3 × 16 + 10 = 58, then 123, then 213, so rgb(58, 123, 213).

Can you really learn to read hex codes?

Yes, roughly. Nobody sees the exact shade from a code, but with practice you can tell its hue, how light it is and how strong the colour is, which is enough to spot a mistake in CSS.