DEV Community

Takuya Kikuchi
Takuya Kikuchi

Posted on

Color property global value "inherit" 🎨

When to use

When you want to inherit color of its parent element, instead of giving the same color.

.parent {
  color: red;
}
.child {
  color: inherit;
  /* color: red; */
}
Enter fullscreen mode Exit fullscreen mode

Demo

.inner cicle having boarder-color: inherit, changing color as its outer circle color changes

inherit-demo

codesandbox 👇

Discussion (0)