How to tell what color the hex code corresponds to?

Question

How can I understand what color a hex code corresponds to? For example, how can I tell what color is #424242?

Answer 1

Well, you can approximate.

Hex codes contain 3 pairs, each one corresponds to the Red, Green or Blue channel in additive color mixing. So you can think of the hex #424242 as being equal to the RGB channels. 42 = red, 42 = green, 42 = blue. Or for #FF0000 FF = red, 00 = green, 00 = blue. So now that you know to split it into 3 pairs, representing RGB colors you can start to guess what color it is going to be.

If all three pairs are the same then you are a shade of white to black. The lower the numbers to more black, the higher, the more white. In this case you're a kind of graphite gray color. #ccccff would be a light blue.

So since hex is 0-9a-f you have 16 possible values for each position. That means in a pair you have 16 * 16 = 256 positions. Since we start with zero that means each hex pair translates to a normal number range of 0 - 255. Which is the range RGB values take. So 00 translates to 0. FF is 255.

So it's really just kind of knowing what the relative amounts of red, green, and blue give you, and then figuring how high or low the numbers are to know how much of each is in the mix. The more you work with color the easier it gets.

Alternatively, CSS does accept RGB values. You can do:
p {
color: rgb(255, 0, 0); // red
}

Answer 2

Thanks Adam, that was pretty useful! What about 0F and F0 couples? would I consider both of those at about half? how would you turn that into RGB?