Вёрстка: Резервные значения для переменных CSS

Резервные значения для переменных в CSS используются для значений по умолчанию, если переменная не определена или имеет недопустимое значение. Это может предотвратить проблемы с макетом или другое неожиданное поведение в отсутствии значения переменной.

Для установки значения по умолчанию в функцию var() нужно передать второй параметр.

:root {
	--main-bg-color: white;	
}

body {
	background-color: var(--main-bg-color, #f2f2f2);
}

# альтернативный способ записи
body {
	background-color: var(--main-bg-color) || #f2f2f2;
}