I'm going to be unoriginal and be the nth person to recommend Tailwind!!
I used to refuse Tailwind's approach because I found it messy, and I was adamant about "separation of concern" (ie. CSS class names should describe content not presentation) etc. I tried as much as possible to stick to BEM. But as I work in a large web app where features are added, removed, and modified regularly, and I have to create quick prototypes (add to that, I also struggle with the visual side of UI design). Things get messy, I couldn't be as disciplined as I'd ideally be about sticking to the CSS methodology, and vaguely presentational class names like .card, .sidebar and .dropdown start to get thrown to the mix. Then I thought what the heck, might as well go the Tailwind route. And I never looked back! Tailwind is soo helpful for my use case.
I also happen to use Laravel, which has built-in postcss support so I can use the Purgecss feature by literally copy-pasting some 3 lines of code. Slimmer minified build css, more productive & happier dev!
I'm going to be unoriginal and be the nth person to recommend Tailwind!!
I used to refuse Tailwind's approach because I found it messy, and I was adamant about "separation of concern" (ie. CSS class names should describe content not presentation) etc. I tried as much as possible to stick to BEM. But as I work in a large web app where features are added, removed, and modified regularly, and I have to create quick prototypes (add to that, I also struggle with the visual side of UI design). Things get messy, I couldn't be as disciplined as I'd ideally be about sticking to the CSS methodology, and vaguely presentational class names like
.card,.sidebarand.dropdownstart to get thrown to the mix. Then I thought what the heck, might as well go the Tailwind route. And I never looked back! Tailwind is soo helpful for my use case.I also happen to use Laravel, which has built-in postcss support so I can use the Purgecss feature by literally copy-pasting some 3 lines of code. Slimmer minified build css, more productive & happier dev!
Tailwind also seems to use common names, like
flex,containeras well.A solution, though, if I need my own class name, is to prefix with something, like
a-, for example.