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.
Found any of this Stuff Helpful?
If you found any this helpful and want to show some love, you can always buy me a coffee!