DEV Community

Tailwind CSS might not be for you

Benoît Rouleau on May 08, 2021

Disclaimer: This article is my version of Tailwind CSS: Adds complexity, does nothing. I respect the original author’s opinions, but I think there’...
Collapse
 
rabeehrz profile image
Mohammed Rabeeh

I don't agree with the color example you took. If you're building using Tailwind at scale, You would define your colors as primary, secondary, warning, success, etc., and use that instead of directly using Tailwind's color palette. Something like bg-primary-500 would be used and the color would be changed.

I've been using TailwindCSS for a long time and I absolutely love it. I have no complaints whatsoever. It makes my CSS files so much more smaller and makes websites load even faster. It makes development fast because I don't have to keep switching between CSS and Templates Files. Also in a case where you need different selectors, you can always write Custom CSS.

You mentioned TailwindCSS being well suited for component architecture. TailwindCSS was made to be used in a production environment. And in production, you are expected to use a component-based design system. And even if you're doing small projects, you should always prefer a component-based system.

Collapse
 
benface profile image
Benoît Rouleau

Re: colors, absolutely. I meant to include that point in the article but forgot about it. Thank you!

Collapse
 
leoloopy profile image
Leo

Nice article. Although I haven't tried tailwind but you've given me enough reason why I should keep postponing it. I can't imagine writing html with inline cryptic styles that will muddle up what is meant to be a structured page, Am just imagining how crazy debugging will be when you have hundreds lines of code.

Collapse
 
jcdea profile image
JcdeA

I mean, you can use "@apply" to apply tailwind styles from css.

I find tailwind classes easier to memorize that normal css, but that's just my experience.

tailwindcss.com/docs/extracting-co...

Collapse
 
tqbit profile image
tq-bit

Having read your reference article when it was released, I'm happy to now read a more sophisticated view on the subject.

In any biggger team project, you would always consider different technologies, comparing their pros and cons before making a decision. Tailwind has many flaws, but it might proof to be just the productivity tool you've been looking for. Imho, instead of dragging tailwind through the dirt, your article provides guidance for a substantiated statement. Kudos, well done, I'd be happy to read more of such posts.

Collapse
 
robvirtuoso profile image
robvirtuoso

This is a very good way to put things into perspective. I agree, that Tailwind has its place in the web dev space, and it does solve some specific problems, and that it's not an exception to the rule that no single solution solves all possible problems.

That is why the open source space is such a vast resource of various solutions for widely different problems.

Collapse
 
devluc profile image
Devluc

Really interesting article and thank you very much for sharing it. I agree with the other readers that said this is not an article meant to place Tailwind in a bad light. Just out of curiosity @benface can you share what was the framework that you actually used for your last 2-3 projects (or no framework of course)? Not asking which one you prefer just which one you had to work with or you chose to work with. Thank you, love your writing style.

Collapse
 
benface profile image
Benoît Rouleau

Tailwind. :) I’ve been using it since 2017. I find that the pros vastly outweigh the cons. I've also used Bootstrap and no framework on some projects, but it was not my choice and it was definitely hard after using Tailwind. Thanks for your comment!

Collapse
 
devluc profile image
Devluc

:) thank you very much for your reply and hope to see more articles from you

Collapse
 
wdpdfpjrwkrszhs profile image
56835

Interesting stuff! This (and Adam Wathan's article in particular) relates a little bit to a post I just wrote on the idea of first-class whitespace - similar themes around what to put in markup vs CSS, and whether accepted CSS patterns are actually the best for code organisation - especially now that we have component frameworks.

dev.to/wdpdfpjrwkrszhs/css-margins...

Collapse
 
codeposse profile image
T.Hunold

As developers and engineers and architects we need to stop doing this to ourself we need to stop trying to find a way to make our lives more complex with obscure and hard to read and hard to maintain things. Remember how we told everybody for years to use a CDN and to stop doing online styling because it was faster and saved bandwidth from bloat? It seems like somebody thought to give themselves a hackathon challenge to try to bring it back and give it some form of justification.
Complexity is not sophistication

Collapse
 
synchronized profile image
Filip Arneric

I can't disagree more with this article!

Semantic css is a way to create something totally unmaintainable, while utility classes give you option to easily change and target many things at once. This is especially important when working in the bigger teams and on many projects where things have to be unified... Also didn't you know that you can combine tailwind/bootstrap/whatever with some custom css? 😅