Blog Post

Turning the Current Color

Before CSS Custom Properties, CSS had a variable of sorts called currentColor that can still be used today. It corresponds to the current element or its parent’s foreground color. This becomes handy when you want to set border or drop shadow colors on the current element or even more useful when you can set the color on a parent and have it cascade through the children. It’s also a way to reduce duplicate code. You can set the colors for a class so that they cascade through, then use an id or additional class on that element to set the text color and watch different colors cascade through with a minimal amount of additional code.