<button class="c-initial">Color initial</button>
<button class="c-inherit">Color inherit</button>
<button class="c-unset">Color unset</button>

<hr>

<div class="c-blue">
  <button class="c-initial">Color initial</button>
  <button class="c-inherit">Color inherit</button>
  <button class="c-unset">Color unset</button>
  <p>The parent container has the color blue declaration.</p>
</div>
button {
  font-size: 1.4rem;
}

p {
  font-size: 1.2rem;
}

.c-blue {
  color: blue;
}

.c-initial {
  color: initial;
}

.c-inherit {
  color: inherit;
}

.c-unset {
  color: unset;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.