CSS currentColor value

Friday, July 16, 2021 - Posted in

A few days ago, I started to learn CSS and HTML. I already played with CSS and HTML but I had a very very limited knowledge.

As I don't like to repeat a code or a property value, I found recently that you can apply a color (defined once) in different properties.

Let's see an example:

div {
    color: blue;
    border: 1px solid currentColor;
}

With the currentColor property you indicate that you'll use the value of the color property in other properties that accept a color value.

With my example, the border color will be blue.

You can even use it in a cascade:

body {
    color: blue;
}
div {
     border: 1px solid currentColor;
}