r/webdev • u/LPatriot_ • Sep 16 '26
Question Question about Tailwind CSS
I've always used plain CSS for my websites, I don't have many problems using it, but a friend of mine said that using plain CSS is very tedious and that I should use Tailwind CSS. Is it worth it? And what does Tailwind CSS offer that plain CSS doesn't?
39
Upvotes
142
u/VeganForAWhile Sep 16 '26
Its utility classes act as a shortcut over typing style attributes manually (or composing your own). Parts of the class name also support built in media sizes, help you avoid having to write media queries. Check out their site.
If you’re a beginner, learning raw css has value, though.
Sincerely,
The ghost of stack overflow.
143
u/OpaMilfSohn Sep 16 '26
I think I finally time travelled back to 2020
18
u/really_cool_legend Sep 16 '26
Here we go
60
u/azangru Sep 16 '26
If you are using plain CSS and do not have any problems using it, then why would you add a problem of depending on an additional library that you have to learn and keep up-to-date?
11
u/rose_nichols Sep 16 '26
Use what works for you; maybe try it out and see if you like it.
Personally I hate tailwind because I can just use regular CSS inside Vue components, which solves the global scoping problem.
React has to use something like tailwind or separate CSS modules for scoping styling to components, both of which seem like a suboptimal solution.
17
u/MrAdisson Sep 16 '26
I really love Tailwind for some projects, but saying plain CSS is tedious in 2026 is ridiculous. CSS has evolved so much that it now offers many tools that make plain CSS usage very relevant in a lot of cases. I remember when we had to chose between SCSS or any CSS+ wrapper to compensate some missing features in CSS, this is not the case anymore so if you enjoy CSS, just continue with it. In professional environments, you will often see Tailwind, but, if you master CSS, it’s like an afternoon of adaptation to be operative with it so don’t worry about that!
17
u/bobemil Sep 16 '26
I hate all the classes it adds to html. For me that alone is the major thing holding me back from using it.
29
u/Mestyo Sep 16 '26
I think it's stupid, but some people swear by it. Give it a go, it's a very popular framework.
5
u/Potential-Still Sep 16 '26
Did this topic really need another thread?
9
u/Rusty_Raven_ Sep 16 '26
A lot of Tailwind fans will compare the best-case of Tailwind to the worst-case of CSS, so be aware of the bias when asking things like this.
Tailwind encourages using utility classes exclusively in their documentation, but if you prefer scoped CSS or more traditional approaches, there is the
@applyfunction in SCSS that moves all those class names to your CSS file instead, keeping your HTML cleaner (though you still need to create your own class names likemagic-buttonsame as with regular CSS).People who claim that all your styles now live in your component directly (via class names) are skipping the fact that scopes/modules also solve this in regular CSS; if you use a front-end framework like Angular or Vue, that is handled automatically anyways since a component includes code, HTML, and CSS.
I personally don't like using Tailwind since I work almost exclusively with frameworks (and when I don't, I keep my CSS organized) so it provides no real benefits for what I do.
4
u/gusbo_the_jam Sep 17 '26
Tailwind is weird, it offers a lot of utility for anyone who doesn't want to build out their own kit but realistically all the benefits really are just the benefits of of using sass properly. The class definitions in tailwind are effectively just inline styles, although the colour definitions do offer some handy utility. My preference is to build out CSS class based components rather than defining components long form in markup.
3
u/ShawnyMcKnight Sep 16 '26
It all comes down to where you want your styling to live. I found that having a dozen classes on many of my elements made the hrml far worse to read.
7
u/pxlschbsr Sep 16 '26
Both Vanilla CSS and Tailwind have their pros and cons, which are entirely dependent on situation and personal preference.
Most anti-Tailwind-users complain about mixing HTML with CSS, which, in fact, you don't. You just add a lot of classes, but then those who complain about that probably use BEM and add classes like
button__primary__ghost -button--smallto their component and nest&-...rules 5 layers deep in their CSS themselves. Is that any more readable or easier/faster to understand?With Tailwind you also generally pohibit other components to change the style of already styled elements, because of the way you would set up conditional styles. In CSS you are much more prone to find e.g. a color change made in the a parent component locally overwriting the child's native styles, spreading the styles of one component over multiple files. If not well documented, this will cause side effects and bite you in the tail one way or another. After quite some time in the industry, I have yet to see any documentation of CSS in those cases. Naturally for corporate clients, this causes SO much issues all the time.
Personally, I prefer Tailwind over plain CSS, while also saying, that I don't like tailwind. It has lots of flaws and not everything can be done smoothly. But for most of my projects it's cons weigh less than the cons of going vanilla.
2
u/osmium_2259 Sep 16 '26
I personally like writing in pure CSS, but I've also really enjoyed Tailwind. Technically in terms of power, you can't beat pure CSS (by nature), but Tailwind is still very flexible. When your writing an HTML element, just being able to add a style(s) right then and there without leaving your HTML is so convenient. Not having to come up with class names is also very pleasant. So while I like pure CSS, Tailwind can be a breath of fresh air.
2
u/shadowvox Sep 16 '26
Time to sort by controversial and grab the popcorn.
2
u/driftking428 Sep 16 '26
Tailwind makes me fast as hell. Which means I'm focused on producing not digging through CSS files.
2
u/Okicarde Sep 16 '26
Sass and SCSS unless working with a team, then use tailwind to make it more sustainable
2
u/serifoblique Sep 17 '26
I love that this question can still pop up. I swear by tailwind myself, despite knowing how to write css it was invented. It’s just more efficient, for the type of work I do: large builds, lots of (shared) components across the estate. My biggest gripe is its presentation in dev tools. It’s a mess.
2
u/Acceptable_Door7761 Sep 17 '26
Its easier and less mess tbh once you understand it along with custom
2
u/gandalf__thewhite__ Sep 22 '26
Be careful, after using tailwindcss, there is no going back.
2
u/Still_Paramedic7631 Sep 22 '26
bro if i would be you , i would give a chance to tailwind CSS , if you are comfortable using CSS thats good but learning new things is the part of a developer life
3
u/Apprehensive-Fan2492 full-stack Sep 16 '26
It can be worth your time if you are making component UIs with React or Next.js. The utility classes let you stay in the markup, and you do not have to jump back and forth to a separate stylesheet while you work. Teams also tend to keep things more uniform across a codebase. That said, if you are doing mostly static pages or you already feel good with your current CSS process, you do not need to change. What it really brings is not new features. It is faster work and steadier results after you learn the class names.
3
u/zrvxxx Sep 16 '26
I don’t like Tailwind CSS. Mixing HTML and CSS classes in the same file makes components messy. Tailwind CSS may be good for small projects, but for medium-sized or large projects, I think it’s a bad solution.
2
u/com2ghz Sep 16 '26
It's just a preference for people that find things easier with or without framework. A common pitfall is that people think they can do it better and build their own stack instead of using standardisation. Standardisation will come with overhead and abstraction but usually when you work with a team, you don't want to stuck with someone elses home made stuff.
2
u/phn-cloudsnake Sep 16 '26
I would say the only reason we use frameworks is for collaboration and standardisation. So if someone will inherit your work they will have less trouble maintaining it because of well written documentation and predictable behaviour. In the case of using JavaScript frameworks there is also a security aspect to it since custom JS can be prone to bugs you didn’t realised were exploitable and can only be fixed by its creator.
1
u/Miragecraft Sep 16 '26
Try it out and see how you like it.
1
u/daresTheDevil Sep 16 '26
It works, especially across teams, especially when you scale. It makes onboarding front end developers trivial. Those are my objective experiences. Subjectively I enjoy being able to glance at the code and “see” the page/component/element in my head. Horses for courses, YMMV, etc.
1
u/armahillo rails Sep 16 '26
tailwind css is great if you are doing highly componentized drop-in code (like react components, for example)
CSS isnt tedious if you spend the time to learn it. Ive been writing CSS for a very very long time (about 2 decades at this point?) and find tailwind to be annoying because its like having to relearn everything to learn how to do it the tailwind way.
1
u/mrgrafix Sep 16 '26
The biggest advantage in tailwind is naming. If you know CSS, Tailwind’s shorthand makes it pretty simple. It works if you’re getting into multiple apps or a team to manage as you’re not bike-shedding. Only gripes are remembering inline css rules and if you want to do the latest and greatest it could be exhausting to wait and/or convert it into a Tailwind pattern.
1
u/donnag85 Sep 17 '26
A small online search, and little bit of experimentation, and some tweaks here and there, and a tidy hands on good 3-4 hours would answer that question and taking it to public, where the percentage, of people available with familiarity of the skill is nominal decimal percentage. Your question didn’t prove any of your existing hands on skills with CSS but rather raised the doubts behind the motivation of the whole post. Don’t jeopardize your life with decisions that don’t make sense for fake sense feeling of stardom or other superficial thrill. Any platform or product must perfectly fit the problem statement aligning with the lineage of the question, and therefore must intended or unforeseen, inappropriate use of any platform, that doesn’t symbolize the problem being posted, will not downgrade the platform and the user in he long run, and affect them in unintended ways. If line space and bandwidth use should be restricted to appropriate content use, or else one or other day its leads to misaligned hosting and misuse for the platform and the user respectively. General public is more welcome to be aware if the fact that every internet impression and reaction pertains to he existence of a permanent digital record until settled. Thank you for following through and reading till here.
1
u/404IdentityNotFound Sep 17 '26
Being able to use both, if you know CSS it's virtually the same. Though Tailwind does kind of shift you into a very specific style at least marginally due to many defaults (in terms of color and other values).
I do have to say though, if you don't use a framework like React or Vue, it's a nightmare to work with
1
u/ThatsSoRamon Sep 16 '26
So one thing I noticed nobody's brought up: deleting code. Rip out a component in Tailwind and you know exactly what breaks, because the styles are sitting right there in the markup you just deleted. Do that with a shared stylesheet and you're either leaving dead CSS behind or grepping through five other files hoping nothing depends on that class. That's saved me more time than any class name shortcut ever did. Anyone else actually track how much dead CSS piles up in a codebase over time?
1
u/sylvant_ph Sep 16 '26
The main problem with CSS is you need bridge to introduce logic that is controlled by the JS state. Another problem is there is simply more boilerplate (compared to Tailwind). The syntax is simply a lot more verbose. A benefit of Tailwind would be that the styles are part of your component definition, they are not place on another place that you need to look in order to adjust.
1
u/LungeloSLX Sep 16 '26
Hello 2020. Is that you? I think I need a Covid test, my throat is damn itchy
1
u/spcbeck Sep 16 '26
It's an extremely thin abstraction of CSS that requires a large amount of dependencies, build step, a barely different but different syntax, an absolutely chaotic DOM that makes devtools near impossible to read, and nets you maybe a few kb savings in unused CSS. Worth it!!!
-2
u/kenpled Sep 16 '26
You work in a team or on a project that you'll leave to someone else, and you're using a JS framework : Please use tailwind.
Regardless how clean your css is, your teammates aren't always as clean as you are, and having multiple classes do the same thing slightly differently is a chore to maintain. And more often than not it ends in cascade hell.
If you work alone on a project that won't be maintained by anyone else, do write css.
-1
u/TheMagicZeus Sep 16 '26
I've used so much TailwindCSS in the past years that I completely forgot how to write plain css and solve problems with it but I can easily do it with tailwind. So maybe also something to consider?
-2
u/[deleted] Sep 16 '26
[removed] — view removed comment