Quick Tip – 13: Quickly Apply Colors Using currentColor
If you've ever wanted to do something like set the borders on a container to the same color as the text within it you can easily do it using currentColor
.
currentColor
can be used for anything that accepts a color value like box-shadow, background-color, etc.
The CSS
.parent {
color: red;
}
.child {
border: solid 3px currentColor;
}
The Demo
My border should have a color of red which matches the color of my text
Browser Support
CSS currentColor has pretty good browser support working in all modern browsers. Not supported in ie8 and below.