Here I show you how you can CSS variables (or custom properties) them to scale your layout spaces across different media queries. The advantage: shorter, lighter, easier-to-maintain CSS files.

CSS variables one of the next big things in CSS. They aren’t still supported well enough across different browsers (spoiler: Internet Explorer is missing) but it’s time we start playing with them. They might be useful when developing our next big project!

I’ve created a pen named CSS vars based layout spacing, open it to have an idea of what I’m going to talk about.