Есть ли переменные в CSS?

CSS позволяет объявлять переменные прямо в стилях и использовать их в любом месте.

Определение:
CSS-переменная (CSS variable, custom property) — это именованное значение, которое можно переиспользовать в разных местах CSS.

Пример объявления

:root {
  --main-color: #3498db;
}

Пример использования

button {
  background-color: var(--main-color);
}

Как работает

1. Переменная объявляется через --.

2. Используется через var().

3. Может наследоваться.

Где применяется

1. Темы оформления.

2. Дизайн-системы.

3. Повторяющиеся значения.

Вывод

CSS-переменные позволяют централизованно управлять стилями и уменьшают дублирование кода.