<div class="blue">
  <div class="color">divが反映されます</div>
</div>
:root {
    --contents: #f00;
}

div {
    --contents:#0f0;
}

.blue {
    --contents:#00f;
}

.color {
    color: var(--contents);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.