<div class="one">I should be black</div>
<div class="two">I should be black</div>

:root{
  --bg-color: red;
}
div{
  margin: 2em;
  height: 7em;
  text-align: center;
  text-transform: uppercase;
  font-family: Verdana;
  font-weight: 900;
  color: white;
}
.one {
  --bg-color: green;
  background: var(--bg-color, blue);
}
.two {
  background: var(--bg-color, blue);
}