Color codes

[jimbrodhead]

Looking at the CSS for the templates I am seeing color designations that I can't figure out such as:


Can you enlighten me on this or point me to the user manual that explains these designations?

I'm using the Slate template on www.paradigms.blogharbor.com and I am trying to darken the type to make it a little more readable.

[abacquer]

HTML color codes are expressed as hexadecimal numbers or names. The names are nice because they are easy to remember (i.e. bgcolor=yellow), but if you want very fine control, you need to use the numbers.

Typically the numbers are six hexadecimal digits long and preceded with a pound sign (#). (Hexadecimal is simply base-16, meaning that in addition to the digits 0-9 there are also the digits A-F having the values 10 through 15. So in base 10 we would read the number 34 as 3x10 + 4x1 = 34, but in base 16 it would be 3x16 + 4x1 = 52.)

HTML color codes are RGB encoded, meaning that the numeric code you see indicates a certain amount of Red, a certain amount of Green, and a certain amount of Blue, and by mixing these colors in varying amounts, you can generate any color you want. Each of these three colors corresponds to a pair of digits in the color code, like this:



So if you change the first 2 digits, you are changing the amount of red, and so forth. Because two digits make up each color, that means that each color value goes from 00 to FF (or 0 to 255 in base-10). So if you make the first two digits 00, you are saying NO RED. If you make them FF you are saying, AS MUCH RED AS POSSIBLE. Therefore you could code for solid red, green, and blue like this:





If all the digits are zero (#000000) it means NO COLOR which is of course, black. White on the other hand, is created by setting all the colors to maximum (#FFFFFF). If the amount of each color is equal, you will get a shade of gray (#1A1A1A, #EEEEEE, #0F0F0F, etc...)

There are lots of tools out there that will let you sample colors and will then give you the HTML color code for that shade. If you check this page you'll find a "color wheel" you can mouse over and see the codes for each shade.

As far as the 3-digit codes go? I'm not certain but I'm willing to bet that those are RGB encoded colors that use 1 digit for each color instead of 2. As such you get less variety with 3-digit codes because that means you've only got 16 levels of each color to work with as opposed to 256 levels.
_________________
-- Abacquer, A.K.A. Chuck Seggelin

[jimbrodhead]

Thanks. A little of what you told me I knew but most I didn't for example I didn't realize you could combine the three sets of double digits to customize. I had only been thinking in terms of the browser safe colors.

Thanks again!

[tigersi]

I can never keep hex colors straight so I cheat and use something like PhotoShop to help me define the color I want through visual picking, and let the application tell me the color code. Same when I'm trying to go backwards with a hex designation in a style sheet.

Dreamweaver can do the same but you can more easily show a broader color range with PhotoShop.
_________________
Thanks!
Kathy (aka, Roaring Tiger)
http://bigcatchronicles.blogharbor.com

[biggerfish]