The currentColor Keyword

The currentColor holds the value of an element’s
color property.

It can be used on elements that don’t inherit color by default. Here are some properties that default to currentColor:

• border-color
• text-decoration-color
• outline-color
• box-shadow

An interesting thing to know about the
currentColor is that it can be used on the parent
element level, or for the child elements.

<h1>
  This is a title
  <span>I'm a child element</span>
</h1>

h1 {
  color: #222;
  background-color: currentColor;
}