The rage against Tailwind is absurd. Maybe it is overhyped but it’s an incredibly useful tool and framework; it also brings an enforced consistency that plain CSS doesn’t, which is especially helpful for responsive sites so that the page use feels consistent across platforms.
So, I avoid modern webdev, because... reasons.... but is the argument here, really, that this is better than. <button>click me</button> with the default styling applied to button { ... } in style.css?
Follow up question, wasn't the point of css so that you didn't have to write excessive html like this?
When using component frameworks like React, you typically put the styling for a button in the button component, and use that component. So then you don't need to have a global CSS class for a button. You just need to style the button once in the component.
But with the @apply function it's also still possible to create a new CSS class that combines other Tailwind attributes. That is sometimes useful for within a single component that uses the same styling for multiple elements.
I’m pretty tired of posts like this stating opinions as though they are objective truth, and using expletives to “get their point across”, seemingly because they can’t write a convincing argument for that opinion.
I know it’s intended to be funny (at least most of the time), but there’s usually truth under the expletives, I believe that humour factor has been lost.
I haven't used Tailwind, but as someone who regularly has to deal with CSS created by Tailwind, I have to wonder why they're even using CSS at all. It feels like going back to HTML 3.2 attributes. How is 'class="bg-white"' any better than 'bgcolor="white"'?
There is one thing that Tailwind is good for, and that's for making sure people can't override your CSS easily. Anybody who's ever used Stylus to override Tailwind-created CSS will know this pain.
(That said, I think this site is rather... abrasive. That doesn't help anybody.)
[edit: Also, in case it's not obvious, I'm not actually advocating for making sure people can't override your CSS. Please, please let me override your CSS.]
The problem with HTML and CSS is there are encapsulation boundaries where there shouldn’t be. Tailwind, by contrast, does not separate the layout from the styling; creating a more cohesive developer experience. Anyone making a point like this does not understand why Tailwind—and similar libraries—are superior to classical encapsulated HTML/CSS.
The accessibility argument backfires. Class names are not important for accessibility, it is actually important to use the correct HTML tags, labels, etc. It is also a disadvantage to have semantic class names and use them in tests for selectors. Using accessible attributes of elements in tests helps both the tests and the accessibility.
The worst thing that happened is LLMs make using tailwind _easy_. So now it's easier and easier to use and more and more tailwind.
CSS is pretty hard to be proficient in, and maintain, but there's an intentionality to it that improves the results, from my experience.
In contrast, tailwind is so easy to clone "beautiful" designs. A THOUSAND beautifully cloned designs slide into your app that nobody needs to care about. and it's a fucking nightmare of reality but no one cares because that's for the LLMs to sus out.
There's an ethos among certain circles (especially on HN, I feel) that basically boils down to "tools don't matter" (perhaps manifesting as "a tool isn't bad if it's ubiquitous" (e.g. Bash or CSS), or "learning curve and footguns don't matter" (e.g. C++)). Of course, it's true that there's a lot of essential complexity to many problems, and hey, maybe CSS really is a local maximum to layout design. And sometimes, a steep learning curve really is inherently necessary, like in functional programming or Rust or what have you. But if a tool is difficult to use due to historical accident, simply accepting that everyone should get good—when more ergonomic alternatives really do exist and are widely used—is simply defeatist. The mere fact that some mental model exists for a tool (in this case, maybe it's "HTML should be semantic") does not necessarily mean it's a good or useful one.
(I say all this as one who's been thoroughly Stockholm syndrome'd by Git, knowing full well that my own argument applies just as much to me in that regard....)
Everything should be Tailwind because all code is written by LLMs these days.
If you need a converter for a normal HTML/CSS component, my free extension SnipCSS is the best Tailwind converter. I haven't seen anything else come close.
Tailwind is not a bad CSS framework, because it doesn't try to change CSS at all, it's just a collection of (configurable) aliases / shortcuts for common used CSS statements.
Something that will usually happen in any big project to some extend. But when using Tailwind you don't have to think about it and you have a consistent way across many projects.
HTML and CSS are just fundamentally not separate concerns anymore. I'm not sure they ever were. You cannot use CSS to turn a correct HTML document into any visual display without adding tags. The separation is an incorrect boundary. Any polemic toward Tailwind is incorrect if its basis is that the colocation is incorrect.
Even less sensible is this "Tailwind's utility-first approach encourages developers to slap classes onto generic <div> and <span> elements, where semantic meaning is lost." No, it doesn't in any way.
Class soup is a valid criticism, but apparently a lot of people fail to realize that tailwind is meant to be used with a component system. I don't think anyone serious is advocating for using tailwind while writing a big static document, copy pasting the button styles into each button. That would be stupid.
23 comments
[ 2.8 ms ] story [ 38.9 ms ] threadThe author should take his own advice. It is a tool and a useful one at that, why all the rage bruh.
https://programming-motherfucker.com/
Compare these two sites:
1. https://justfuckingusetailwind.com/
2. https://fuckyouiwontusetailwind.com/
On mobile, the first site is infinitely more pleasant to use. It sells itself by comparison!
> <button class="bg-sky-500 hover:bg-sky-600 active:bg-sky-700 text-white px-4 py-2 rounded-lg">Click me</button>
So, I avoid modern webdev, because... reasons.... but is the argument here, really, that this is better than. <button>click me</button> with the default styling applied to button { ... } in style.css?
Follow up question, wasn't the point of css so that you didn't have to write excessive html like this?
But with the @apply function it's also still possible to create a new CSS class that combines other Tailwind attributes. That is sometimes useful for within a single component that uses the same styling for multiple elements.
.common-style { @apply flex w-4 h-3 bg-green; }
https://tailwindcss.com/docs/functions-and-directives#apply-...
I know it’s intended to be funny (at least most of the time), but there’s usually truth under the expletives, I believe that humour factor has been lost.
There is one thing that Tailwind is good for, and that's for making sure people can't override your CSS easily. Anybody who's ever used Stylus to override Tailwind-created CSS will know this pain.
(That said, I think this site is rather... abrasive. That doesn't help anybody.)
[edit: Also, in case it's not obvious, I'm not actually advocating for making sure people can't override your CSS. Please, please let me override your CSS.]
style="display: flex; width: 32px; height: 24px; background: green;"
In Tailwind:
class="flex w-4 h-3 bg-green"
CSS is pretty hard to be proficient in, and maintain, but there's an intentionality to it that improves the results, from my experience.
In contrast, tailwind is so easy to clone "beautiful" designs. A THOUSAND beautifully cloned designs slide into your app that nobody needs to care about. and it's a fucking nightmare of reality but no one cares because that's for the LLMs to sus out.
(I say all this as one who's been thoroughly Stockholm syndrome'd by Git, knowing full well that my own argument applies just as much to me in that regard....)
If you need a converter for a normal HTML/CSS component, my free extension SnipCSS is the best Tailwind converter. I haven't seen anything else come close.
https://www.snipcss.com
Something that will usually happen in any big project to some extend. But when using Tailwind you don't have to think about it and you have a consistent way across many projects.
Even less sensible is this "Tailwind's utility-first approach encourages developers to slap classes onto generic <div> and <span> elements, where semantic meaning is lost." No, it doesn't in any way.
Class soup is a valid criticism, but apparently a lot of people fail to realize that tailwind is meant to be used with a component system. I don't think anyone serious is advocating for using tailwind while writing a big static document, copy pasting the button styles into each button. That would be stupid.