Member-only story
Your super-simple intro to CSS Variables
Get started with this powerful CSS feature
![](https://miro.medium.com/v2/resize:fit:700/1*WPW6rcgxyhnrC4v9r0CBDw.jpeg)
I’ve been using CSS variables for quite some time now. They save me a bunch of time and headaches when it comes to writing CSS.
But maybe, you’re not familiar with them (yet 😉).
Maybe you are a little late to the CSS Variable game.
Or you’re just starting your journey as a web-developer and stumbled on the term “CSS Variable” or “CSS Custom Property” somewhere.
Maybe you just want to freshen up your knowledge on the concept.
In this article, I’ll go through why you should know what CSS Variables are and how you can use them to level-up your CSS skills as a developer.
So what are CSS Variables?
CSS Variables (or CSS Custom Properties) are entities defined by CSS authors that contain specific values to be reused throughout a document.
Sounds a little technical, right?
Let’s break it down.
A CSS Variable will look a lot like a regular line of CSS.
But instead of using an already existing property like “font-size”, “margin”, or “padding”, we will create our own custom property.