Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Customizing Colors and Fonts Use Color in CSS

AJ Goldstein
AJ Goldstein
1,182 Points

Could you please explain how to calculate the quantified value of two hexadecimal numbers?

I'm having trouble conceptualizing how the actual numerical conversion takes place to assign a specific intensity value to each individual color.

For example, what are the corresponding red, green, and blue values for #6ab47b? In the video, Nick explains 6a as being a "medium" amount of red, b4 as being a "high" amount of green, and 7b as being a "medium" amount of blue. My confusion is how exactly he quantified those two digits per color to come to those qualified (i.e. medium/high) determinations.

4 Answers

It helps to convert the two-digit hex values to decimal. (If you're confused about this check here.) For this color we get 106 as the red value, 180 as the green value, and 123 as the blue value. The maximum for these value if 255 so the color is approximately 42% red, 71% green and 48% blue.

Rob Bartlett
Rob Bartlett
6,741 Points

Getting exposed to base-16 is a bit of a mind bender.

In base-16 once you've gone from 0-9 the letters pick up a-f, so b in hexadecimal is equivalent to 11 in base-10.

So, in base 10, a two-digit number can be one of 100 values (counting 00), but base 16 allows you to represent 256 values with two digits.

In base-10, the first digit of a two-digit number represents a multiple of 10, but in hex/base-16 it's a multiple of 16. In the case of 6a, "60" in hex is equivalent to 96 in base-10, and "a" is equivalent to 10. So, "6a" is 106 -- the 107th value out of 265 counting 00... a fairly "medium" value.

Don't worry about memorizing hexadecimal numbering, just have a basic understanding of of what the values represent, and look them up online. :)

I like to use http://www.color-hex.com -- it gives you variations of each color, complements and helps you use a coherent color scheme.

To be honest, I have no idea how to explain it. I have a great understanding of binary, however I sort of ignored hexadecimal. I did however find this site https://learn.sparkfun.com/tutorials/hexadecimal . You sparked my curiosity, and that site does a great job of explaining things.

Edit: I actually think I misunderstood what you asked. Not sure.

Rob Bartlett
Rob Bartlett
6,741 Points

Here's the color-hex.com breakdown of Nick's "Treehouse Green," for example: http://www.color-hex.com/color/6ab47b