I think I like how the article tells you that this comparison is basically like comparing Legos with IKEA furniture. But in reality I think more apt comparison is
getting wood and tools from HomeDepot vs buying make your furniture kit from IKEA. Writing plain old CSS would be like go to forest and cut down your own tree.
People who are dissing on TailwindCSS come across as more emotional than sensible. Tailwind is a far better fit for any large application that needs to be unique in its design which is basically any major website today. An e-commerce site today does not need 10 different types of buttons but it rather needs 5 buttons and one button that completely stands out.
Tailwind has gotten the complexity out of writing CSS to do all the common things yourself but it has not created and opinionated design philosophy either. It is not meant for your weekend project, but I do think nearly every large site will eventually move to a more Tailwind like framework.
I gave Tailwind a shot but ultimately settled with Bootstrap. It wasn't because Tailwind was bad-- I thought it provided a lot of value. The issues that ultimately made me switch to Bootstrap were:
1. I don't need a build tool for JS/CSS, so introducing one _just_ for Tailwind was a pain.
2. In order to really take advantage of Tailwind and speed up development, you need the Tailwind vim plugin (which doesn't work in vanilla Vim, only Neovim from what I can tell.. I don't use Neovim).
3. The html gets bloated pretty bad and it does get hard to read.. especially without the extra tooling like the Tailwind plugin to sort class names, auto complete Tailwind class names, etc.
Utility classes still encapsulate some complexity and responsive styling. They also generate colors from the global palette. Finally, they’re less verbose without losing much meaningful information.
It is easier to find how to do things using tailwind documentation than with native CSS documentation. As someone who is not very good at CSS it makes my life easier.
I think the word "coping" is inappropriate here, it's a tradeoff and in addition a matter of preference.
You might like not having 24000 permutations of
display: flex;
align-items: center;
in your code.
There are good alternatives to Tailwind and also small projects where "just write CSS" is enough. In larger projects, most people need at least strong naming conventions, other tools, and/or an opinionated "template" such as Bootstrap.
Many people using Bootstrap don't even bother to configure a theme.
That's where the real specificity wars begin then (not necessarily applicable to you).
And once people have started to define their design system in terms of overrides, pain is ahead (if you need any non-trivial CSS, that is).
After switching jobs, I now mainly use CSS-in-JS (which frees me of many problems, and in my case, creates fewer other problems).
I am perfectly versed in Vanilla CSS and the cascade, wrote my first stylesheet around 20 years ago (when layout in CSS was not really a thing)
Why is doing things differently from your preference "coping"?
I'm not even disagreeing with that.
I saw the tradeoffs of Tailwind too.
And yes, I also agree with the core of your critique: Tailwind is a (yet another) DSL on top of CSS, which makes it smelly.
But as I see it, the reason for using Tailwind is not that this DSL was easier, in fact it's the opposite, I constantly had to use IDE autocomplete and/or the docs in order to use it.
Tailwind is a nasty DSL inside the class attribute, yes. And still, this DSL can be and often is a relieve from other custom CSS that grows exponentially and causes bugs due to selector complexity.
Tailwind IMO solves the same problem that styled-components, CSS Modules and ShadowDOM try to solve.
> Why is doing things differently from your preference "coping"?
It's not.
> There are good alternatives to Tailwind
Yes, just write the CSS. If you are going to use Tailwind, just write CSS. If you are going to use Bootstrap or any of those sorts of resources the equation is different. You're no longer writing CSS in a class attribute but pretending it's a style tag and that you're somehow doing things "better". You're just writing CSS without writing CSS.
The difference is that high level languages actually bring a level of abstraction not present in assembly. Tailwind does not exist on a higher level of abstraction. It's at the same level but written in a different vernacular
To me the biggest reason is selector specificity, especially when it comes to authoring component libraries. Inline styles written with the style attribute are impossible to override without using !important, which only exacerbates the specificity problem.
If you find yourself at a point in your life where you're selecting between Tailwind and Bootstrap, you need to stop and think hard when did things go so wrong.
No. Tailwind does not give you any button specific css, you are supposed to write it yourself. Where as bootstrap comes with .btn classes. So I think the article is correct.
CSS used to have many little corners. It doesn't these days.
What it has is an excess of features, that may be hard to recall. But large language models are surprisingly good at bridging this gap when you need a hand in writing a snippet for a given layout.
I suspect people waste more time learning Tailwind than they would write plain CSS. And by "plain CSS" I do not exclude tools like SCSS/SASS/LESS, whose utility is confirmed by the fact CSS itself is adopting some of their features and syntax (variables, nesting).
Imagine CSS adopting some of Tailwind's syntax, though... Wow. Sorry for the disturbing mental image.
Sometimes I wonder, when did HN went so wrong and is full of comments that do not further the discussion but purely result into flamewar and ridiculous homilies.
I've only been here since 2015 so I'm not bringing much more than an early middle-aged viewpoint, in HN years. But I noticed a big uptick of this starting to happen when cryptocurrency people began proselytizing aggressively around 2016, 2017, so much so that I actually made an account to push back on it in some small way (my handle was originally blockchainoffools, but the hn handle limits knocked my block off) having been only a lurker for a couple years prior. Then it seem like the S/N regained some of its old strength for a bit. However the noise (and the halo of meta-noise such as this very comment) surged again to a degree that dwarfs the intensity of the crypto invasion, when first twitter and then reddit announced the end of free 3rd party API access.
But asking me to take Tailwind seriously as a CSS framework is like asking me to take Flat Earth Society seriously in a science forum. Everything has a threshold where you cross from the plausible to the absurd. To me there's a non-zero chance Tailwind is (or at least started as) a parody of bad software design.
We just had a submission the other day that "the JavaScript ecosystem has a talent problem". It's a real problem.
CSS's very goal is to separate styles into reusable, readable rules, and here comes Tailwind, inlining them into an endless combination of increasingly obscure and indecipherable abbreviations. Are you not entertained? It seems deliberate.
Bootstrap is no longer associated with Twitter. They used to be called Twitter Bootstrap since the people who made it worked at Twitter but it is almost 10 years since the quited and started for themself.
Based on the comments by other folks here, looks like lot of folks are using Tailwind incorrectly and then blame it for not being the right tool.
Tailwind classes might be verbose but you are not supposed to use them directly in the markup. Always create wrapper classes that are specific to your design and simply apply the utility classes in them.
In short make your own Bootstrap like framework using Tailwind's primitives. Tailwind has made this trivially simple.
People who are dissing on TailwindCSS come across as more emotional than sensible. Tailwind is a far better fit for any large application that needs to be unique in its design which is basically any major website today. An e-commerce site today does not need 10 different types of buttons but it rather needs 5 buttons and one button that completely stands out.
Tailwind has gotten the complexity out of writing CSS to do all the common things yourself but it has not created and opinionated design philosophy either. It is not meant for your weekend project, but I do think nearly every large site will eventually move to a more Tailwind like framework.