From MDN DOCS: Here you can get all the info you need about
data- attribute in general.
The syntax is simple. Any attribute on any element whose attribute
name starts with data- is a data attribute.
I just encountered an attribute called “data-icon” that I’ve never seen before, so I started fiddling with the values and noticed that different letters will yield different icons. Is there a reference page for this attribute somewhere that lists all the value:icon combinations? I tried googling data-icon and wasn’t able to find anything about it.
<button class="play" data-icon="P" aria-label="play pause toggle"></button>
<button class="stop" data-icon="S" aria-label="stop"></button>
<div class="timer"><div></div><span aria-label="timer">00:00</span></div>
<button class="rwd" data-icon="B" aria-label="rewind"></button>
<button class="fwd" data-icon="F" aria-label="fast forward"></button>
That is some developers mark up. It is nothing special in HTML