I have been working on understanding CSS (Cascading Style Sheets) better as they appear to be where it is at for good web design. I really enjoy looking around the Zen Garden Project and the Word Press CSS Contest. These are awesome examples of style separated from content.

One of the things that tended to confuse me was the use of three character colors in Cascading Style Sheets. What did #fff mean? Well it took a bit of digging, but I think I have it now. The math majors tell me that if you use a six character red, green, blue (or RGB as commonly referred to) color scheme, you need six characters to form 16,000,000 colors. Conversely if you limit yourself to a 256 color web-safe palette, you need only use three characters. So the CSS wizards decided you could avoid needless repetition by simply using the shortcut method.

In case there is any confusion, you simply give the first letter of each color pair (example f in a three character RGB color would become ff) is simply repeated. So it is #RRGGBB. Hex numbers are represented by the characters 0-9 and letters A-F, for a total of 16 characters. So long as you are satisfied with staying within the color cube, using the three character color codes in CSS will make for smaller file sizes and less typing.

This article was posted on Saturday, March 20th, 2004 at 3:31 pm