<div class="text1">
  Text 1
  <div class="text2">Text 2</div>
</div>

@property --my-color {
  syntax: "<color>";
  inherits: false;
  initial-value: #ff0000;
}

.text1 {
  --my-color: #0000ff;
  color: var(--my-color);
}

.text2 {
  color: var(--my-color);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.