Modern CSS

The attr() function
Three practical use cases

The attr() CSS function is used to retrieve the value of an attribute of the selected element and use it in a property value, similar to how the var() function substitutes a custom property value.

01

Custom Progress Bars

Total Progress
Customer Spending
Project Progress
02

Staggered delays

  • Example Item 1Dolor sit amet consectetur.
  • Example Item 2Sed do eiusmod tempor.
  • Example Item 3Labore et dolore magna.
03

View transitions