I guess that's falling into the same trap people fell into when they rejected React because the html was wired directly to JS. There's now component level isola

I guess that's falling into the same trap people fell into when they rejected React because the html was wired directly to JS. There's now component level isolation that means you're not working at a global level anymore, and you can reuse those components. The issue with CSS has always been that you create these lovely generic styles, and as time goes on it becomes harder to make changes without breaking other components. Despite good intentions and large amounts of effort, things become coupled. The issue with your example above is that it doesn't handle all the cases. You can't deal with responsive layouts or hover states etc. Tailwind addresses these 2 issues. They reject global stylesheets by working at the component level. You can change a component knowing that you won't break anything else. By using classes, you get to have all the substates configured locally without having to use global stylesheets. A lot of what's happening in the CSS world now is about ditching the global cascading nature of CSS and trying to isolate styles. Like it or not, that's the direction it's moving, for very good reasons. All the CSS-in-JS solutions have tried to do it too, but honestly, for me, the dev experience sucks. Tailwind gives me css back and it's fun again.