I’ve been having the same issue. I’ve used utility CSS in the past for modifications/overrides on top of OOCSS classes, but never used it to style the entire app.

It seems excessive, disorganized, and counterintuitive. While being modular and “optimal” (when paired with Purge), its reduced things like code readability. Takes 5 mins just to parse all the props mentally (and tie them to DOM nodes), when I could attach them to a class name mentally. I could see the argument for the complexity of The CSS mental model, but this is by far the solution.

And anyone who says to use @apply — no. At that point you might as well use CSS properties and CSS vars (custom properties). It’s crazy watching people go all the way into a CSS file just to still write utility shorthand that’s a few characters shorter than the original CSS syntax.

And wrapping the Tailwind in a React/Vue/etc component is sweeping a mess under the rug. You still have to deal with that mountain of utility classes sometime.

I am a big fan of “utility style props” (aka Styled System, xStyled, Restyle) which are basically like Tailwind combined with React props, but more efficient with CSS in JS managing class names and chunking CSS.