Uso de variables en CSS

En CSS variables are finally landing in Chrome to help you clean up your code nos cuentan que Google Chrome 49 ya incorpora las variables de CSS, que permiten hacer cosas como esto:

:root {
 --main-color: #06c;
}

#foo h1 {
 color: var(--main-color);
}

Esto ya se podía hacer con el uso de SASS o LESS, preprocesadores de CSS. Ahora se puede hacer lo mismo, pero directamente en el navegador.

¿Se puede usar ya? Por ahora no es una buena idea, porque ni Opera ni Microsoft Edge lo soportan, pero seguro que en unos meses todos los navegadores modernos lo soportarán.

Más información en CSS Variables: Why Should You Care?