I say “variable” because CSS doesn’t natively support real variables. The debate is somewhat heated on whether it should or not. I’m not going to take a stand on that one, but there is a clever little hack bouncing around on how to accomplish about the same thing with one little extra step. For colors, anyway. It is as simple as including a commented section in your CSS such as this:

/*
   Light Blue: #afd2f0
   Dark Blue: #0f4574
   Bright Red: #fa0606

   Link Color: #3674bb
   Post Background Color: #fffbd8
   Post Title Color: #9a8f2e
*/

Throughout your CSS, you will use these hex values for the appropriate objects. Then, say you want to change the color you are using for your Link Color, just do a find/replace all of that hex code in any text editor.

One extra step than what a variable could accomplish, but it sure does beat hunting down where exactly to change what color.

Theoretically Related Articles:

• Better Email Links: Featuring CSS Attribute Selectors
• Overriding The Default Text Selection Color With CSS
• Guest Post: Alternative Style Links
• Designing the DZone Cross-Promotional Footer
• Un-bloat CSS by using multiple classes