juniorCSS

What are CSS Custom Properties (Variables)?

Updated Apr 28, 2026

Short answer

CSS variables allow you to store specific values to be reused throughout a document.

Deep explanation

Declared using '--' and accessed via the 'var()' function, CSS custom properties cascade and inherit like standard CSS properties. Unlike SASS variables, they are dynamic and can be manipulated at runtime via JavaScript.

Real-world example

Creating a dark mode theme by dynamically swapping root CSS variables via JavaScript.

Common mistakes

  • Not providing a fallback value in var(--my-var, fallback), causing layout breaks if the variable isn't defined.

Follow-up questions

  • Can CSS variables be updated via media queries?

More CSS interview questions

View all →