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
1 2 3 4 5 6 7 | .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.