I wanted to like Tailwind, but it seems a bit disingenuous. It's like using inline style tags, just with shorter names.
From time to time I've made an effort to learn how CSS works, but after a while I forget the details. It's more productive if I can browse a catalogue of visual examples, with concise markup that is easy to copy and paste.
Bulma seems like the more "modern" take on Bootstrap: https://bulma.io/
The goal of tailwind is the DX, and it seems to only acheive that with people that enjoy it. I know the statement seems obvious, but there are instances where you don't like a language or a framework, but it doesn't fight against you hence why I consider that a good DX.
`<div css={Css.mx2.black.ifSm.mx1.$}>...</div>;`
That must be one of the most horrid things I've ever seen done to CSS.
Definitely use whatever you like, but just like vim bindings, which look "omg wtf" to newbies but then become "cannot live without" once you learn them, once you learn the Tachyons-style abbreviations, I/we find that they fade into the background/become 2nd nature, and the succinctness ROI is worth it.
But happy to have you disagree/stick with TW.
I like that it helps reduce the walls of class names since the classes are on their own line in the tailwind styled component.
Wrote about Vanilla-Extract shortcomings here https://news.ycombinator.com/item?id=33793944
I thought it wouldn't be a big deal but after seeing unnecessary long walls of class names I'm really tired. Anything other than basic styling is an absolute pain with tailwind and I don't understand why /my company specifically/ can't just use typestyle/styled-components/css modules to separate walls of text from components. With time, I degraded to the point I where I use classnames library just to split longer class string into 3-4 smaller ones so I can split the component into multiple rows to make it look better