Not to be too snarky: but what feature of CSS variables can't be emulated just as cleanly with a little jQuery? There is always going to be a spectrum between "style" and "behavior" attached to elements, and it strikes me as much more productive to try to solve the problem at the level of a programming environment instead of a no-longer-quite-as-static-as-originally-envisioned style description language.

Doesn't jQuery require client-side javascript? If so that precludes its use for crucial parts of CSS in my mind.

Hasn't anyone thought of implementing a "static" version of jQuery that makes modifications at compile-time on the server?

ycfeeds.com uses server-side jquery and (although ycfeeds.com does not do it much) can manipulate dom styles and add class names to elements using CSS3 at "compile time".

How does server-side jquery work? Are you running it through Rhino or SpiderMonkey or some other javascript implementation before it hits the client?

Rhino, using John Resig's "env.js"

Awesome. Thanks :D

I think most Web frameworks have some means of templating CSS files.

Elegance.

OK, I call shenanigans here. In what was is adding a feature to a non-programmable, designed-by-commitee data format instead of using a tight, well-defined and very powerful feature of the pre-existing development environment ... elegant?

My original question was, after all, an aesthetic one. I guess I just simply don't understand your thinking here.

Elegance here means having much meaning a small space. Variable replacement is hardly programmable. More of a macro expansion.

To my eyes, this has lots of meaning:

    div { color: var(CorporateLogoBGColor) }

To my eyes, this has very little meaning and forces me to consult a reference doc every time I look at it:

    div { color: #e852aa }

I think the var() syntax is non-elegant, it's a bit fugly. I think Perl's $ might visually look more elegant.

Advantages: DRY works. Designers can make sweeping changes to a page with a small change.

I don't think designers are going anything but more flexibility in having this available.

I posted about this before on HN, but I've implemented CSS variables using PHP as an intermediary. This implementation is coded to the same spec that webkit is using, so the stylesheets will be usable once more browsers support it. You can peep it here:

http://interfacelab.com/variables-in-css-via-php/

Probably pretty easy to port to another runtime.

Cool! Though, this will be one of those features which is only useful in years to come when Firefox 4 and IE9 supports it, sadly. But once it has a wide audience it will be an amazing feature!

Agreed. But alas, I hate it when these features are announced, because they will only tease me for years to come until it's widely released.

I read somewhere that the W3C originally didn't want to do this because it deemed that CSS shouldn't become a programming language. Ten years of nightmarish style sheets later...

This change definitely won't make it a programming language - they're not even real variables, they're more like XSLT's definition of variables. Also known as constants.

CSS variables also here

http://moonfall.org

Long overdue. But it's good to see it implemented!

Great!

They will make my life easier.

Only if HTML implemented the same concept, one can dream.