Some Things You Might Not Know About Custom Counter Styles | CSS-Tricks
January 27, 2025
You’ve more than likely dabbled with custom counters using counter-reset and counter-increment. Or maybe your way of doing things is to wipe out the list-style (careful when doing that!) and hand-roll a marker on the list item’s ::before pseudo.But have you toyed around with @counter-style? Turns out it does a lot of heavy lifting and opens up new ways of working with lists and list markers.
Source: Some Things You Might Not Know About Custom Counter Styles | CSS-Tricks
The ability to manage counters, allowing for the numbering not just list items but things like headings has been around since the beginning of CSS.
But as Geoff Graham explores here, @counter-style brings us many more options.
