First Look at The Modern attr()

April 7, 2025

CSS

CSS attr() function syntax with labeled components: 'data-color' as the attribute name, 'type(<color>)' as the type, and 'red' as the fallback value

You might have used the attr() function in CSS before to get the text content for a pseudo-element.

…

However, when we want to use a value other than text, it will not work. In the following HTML, I added data-color attribute to the p element.

…

Now, we can use attr() and define the type of value we want to use.

Source: First Look at The Modern attr()

Get the low down on the new CSS attribute which goes far beyond what we’ve been able to do until now. As always an excellent article by Ahmad Shadeed