This isn't a long article, just a quick thought I just had.

It's no secret that one can use <custom-element>s in HTML without defining them in JS and use them only for styling.

One of the cool things about this is, ironically a restriction: Any element can only have one tag name, not several. A tag name isn't just a long list of different things that apply to an element, it's a singular statement on what it is.

That leads to an obvious question though: Isn't this what classes should be? And if that's how classes should really work, what should HTML/CSS classes be called instead?

I don't have strong thoughts on what it should be called; could be traits="...", could be mixin="...", could be anything else.

Point is, class="..." is a terrible name and should be thought of as one of those big mistakes in early web technology design, next to calling it "border-radius" rather than "corner-radius".

And despite the naming confusion, it is nice that we now have the tools to distinguish what an element is from what it does.