CommunityNews

CommunityNews

Why I don't like Tailwind CSS

You’re at a restaurant, and there’s an odd item on the menu that you’ve never heard of before, but it piques your interest. It sounds like it might be worth a try, though you’re not sure.

When the waiter approaches your table, you inquire about the dish; he notes that while most people are initially repulsed by its appearance, they should still give it a try because the chef swears that it’s supremely delicious. So, trusting his judgment, you order the dish and wait.

When your meal arrives, it looks just as unpleasant as it did in the menu. But you’re not one to judge—you’re willing to try new things. You carve into a slice of it and take a reluctant bite. And… well, it’s really not that great.

In a nutshell, this was my experience with Tailwind CSS. It’s not the worst thing to happen to CSS, but it’s certainly not the panacea that its supporters claim it is—and, in fact, it has a lot of problems…

This thread was posted by one of our members via one of our news source trackers.

Most Liked

alanq

alanq

Interesting article, some well made points but it only confirms to me that Tailwind probably is the right approach for me.

Every single approach has a trade off, and that can be presented as a criticism. But that doesn’t mean it might still not be the best approach available. Are the alternatives, whose trade offs aren’t touched on in this article, really better for a particular use case?

Maybe it’s just me, but my HTML is a bit ugly and not very readable anyway. It doesn’t feel like much of a sacrifice to have more, and initially obscure looking, html classes in it.

An example of a criticism from the article that is actually a plus for me:

you’re lying to yourself if you think this is any better than writing CSS directly, or any more maintainable than directly applying inline styles. Because instead of repeating styles in your CSS, you’re now repeating them in your HTML, through class names. In fact, you’re likely repeating yourself three, four, possibly many more times now because you can’t chain selectors.

In my workflow, NOT having to open up a CSS file at all, being able to specify the presentation directly inline inside the view template, is a huge win and avoids disrupting my train of thought. It is massively better than writing CSS directly, for me.
And I can easily use helper methods to DRY up commonly repeated sets of classes (with Ruby on Rails view helpers in my case).

Opinionated is great, but this article reads quite biased to be honest. Just a warning to anyone who reads the snippet without reading the full article and considering for themselves whether alternatives really would be better.

dimitarvp

dimitarvp

I had almost the same thoughts reading it. I was like: “wait… putting style class names inside HTML is a bad thing?” WTF? I always did it like this – I am not a frontender and I only occasionally need to write HTML+CSS (mostly for hobby projects) and to me that’s actually a good thing. As you said, less interruptions.

I’d be open to something like LESS / SASS / SCSS as well though. But IMO for most small projects any of those would be a total overkill.

malloryerik

malloryerik

I’m personally liking Tailwind. My own pain points with it (minor pain, more like aches or itches…) are around stuff like combining Tailwind’s versions of CSS Grid and Flexbox which I already don’t use frequently enough to remember without constantly checking the docs, but which require enough understanding that now I’m checking two sets of docs instead of one.

Ah, this looks nice:

Where Next?

Popular Frontend topics Top

First poster: bot
Vue vs React: Best Choice for Startups. “I just have one question for you: Why Vue? I hope you’re not rolling your eyes thinking - “ah n...
New
First poster: PaigePalmer
Progressive Web Apps (PWAs) are starting to get some attention. For instance, Amazon is using it for game streaming service on iOS. PWAs ...
New
First poster: bot
Last year I created Pomodone, a small time tracking application based on the Pomodoro technique of working in 25 minute intervals. It’s a...
New
First poster: bot
Add WebAssembly, get performance. Is that how it really works? The incredibly unsatisfying answer is: It depends. It depends on oh-so-ma...
New
First poster: bot
At NoRedInk we have one of the largest Elm apps in the world. It serves millions of teachers and students, and our frontend code is almos...
New
First poster: bot
JavaScript has come a long way since I knew it as the “D” in DHTML. For anyone like me, who’s been reluctant to use the latest syntax tha...
/js
New
First poster: bot
ES2021 features list as approved by the Ecma General Assembly Logical Assignment Operators (&&= | Numeric Separators (1_000) ...
/js
New
First poster: bot
JavaScript is a great programming language, but thanks to the fact that its initial release was built in only ten days back in 1995, coup...
/js
New
brainlid
You are storing some Phoenix LiveView state in the browser. You want to retrieve that saved state as early as possible to improve the use...
New
First poster: OvermindDL1
I have to admit: as I’ve watched Tailwind enthusiastically adopted by more and more of the frontend community, I’ve remained skeptical. B...
New

Other popular topics Top

AstonJ
Or looking forward to? :nerd_face:
503 15149 280
New
AstonJ
There’s a whole world of custom keycaps out there that I didn’t know existed! Check out all of our Keycaps threads here: https://forum....
New
AstonJ
I ended up cancelling my Moonlander order as I think it’s just going to be a bit too bulky for me. I think the Planck and the Preonic (o...
New
dimitarvp
Small essay with thoughts on macOS vs. Linux: I know @Exadra37 is just waiting around the corner to scream at me “I TOLD YOU SO!!!” but I...
New
foxtrottwist
A few weeks ago I started using Warp a terminal written in rust. Though in it’s current state of development there are a few caveats (tab...
New
sir.laksmana_wenk
I’m able to do the “artistic” part of game-development; character designing/modeling, music, environment modeling, etc. However, I don’t...
New
AstonJ
This is a very quick guide, you just need to: Download LM Studio: https://lmstudio.ai/ Click on search Type DeepSeek, then select the o...
New
PragmaticBookshelf
Overarching tutorial for Python beginner and intermediate developers that teaches web development with the Flask framework. Miguel Gr...
New
CommunityNews
Open-source implementation of the classic GTA engine now running directly in your browser. Experience the reVC technology demo on DOS.Zon...
New
xiji2646-netizen
Woke up to this today: Claude Code’s complete source code exposed via npm source map. Not a snippet. All 512,000 lines. 1,900 TypeScript ...
New