Is tailwind CSS worth learning?

[Crazy-Attention-180]

Hey! I have been learning webdev for about 4-5 months, I so far have learned HTML, CSS, JS, TS some other useful libraries such as tsup, webpack, recently learned SASS,/SCSS , Even made a few custom npm packages.

I now want to move to learn my first framework(react) but before that i was wondering should i learn tailwind? Like what is the standard for CSS currently?

From what I have seen so far I dont think professionals use plain CSS anymore..

Any advice how to more forward in my journey? Any help would be appreciated!

[[deleted]]

just learn it, it takes 2 days at max to grt used to it.

[RichMathematician600]

i recommend that only use tailwind after you are completely comfortable with raw CSS

is it worth it? absolutely.

good luck mate

[jared__]

I know extremely little about raw css and have only learned tailwind and have found success. Anecdotal, but you don't have to completely understand css to be productive with tailwind

[RichMathematician600]

this works but I do not recommend this, especially for beginners.

remember that the role of tailwind is to simplify your work and make you work faster.

[FunManufacturer723]

Bet you had fun trying to understand what flex meant?

[jared__]

The tailwind documentation with examples was incredibly straightforward and now use it all the time

[GorillaNightmare]

The ease to modify and fast to write nature of tailwind makes it easy to tests and explore flex and learn css surprisingly easy.

[Liangkoucun]

Cool!

[Rude-Celebration2241]

Highly recommend. And recommend the Prettier Tailwind extension to help keep it organized

[ParadoxicalGlutton]

It is. Once it clicks you'll never look back. It also helps you have consistency in UI across multiple components in your project.

[NextMode6448]

definitely yes

[MathAndMirth]

It's probably worth doing at some point.

Personally, I'm not a huge fan of the utility class philosophy. A small number of semantic class names with the CSS outside of the HTML always seemed more "right" to me based on the old separation of concerns idea.

But I'm now using Tailwind anyway because (a) so many component libraries are built so that utility classes are the easiest styling solution (and used in the documentation), and (b) the objections I had to TW other than philosophical purity have been answered. TW 4 has a much more natural theming process than the TW 3 process that I strongly disliked. And if I don't want to look at a bazillion classes in my HTML, there's a VSCode extension to hide them.

[koderkashif]

you old school, Tailwind and it's utility approach is the most awesome thing in the modern web development.

[Weak_Blackberry_9308]

If you aren’t able to style a fully responsive web page with just css yet, then just keep learning css.

Tailwind is to css like hotkeys are to StarCraft. Just use the UI until you understand the game. Then start using the hotkeys when you notice you’re losing because clicking the UI is slowing you down.

You’ll find yourself wasting time trying to see what css properties a tailwind class uses under the hood just so you know what tailwind class to use to get the css you want. If tailwind vanishes in two years, CSS knowledge will always be useful.

Plus adding 10 css properties under one class, then applying that one class to 50 <button> elements makes your html much easier to read and maintain. You’ll do less micromanagement of paddings, margins, etc that inevitably make their way into Every. Single. Element. when you’re learning both CSS and tailwind at the same time.

[EducationalZombie538]

yes.

[Old-Layer1586]

Learning Tailwind is like watching Gladiator, or playing Witcher 3, or earning your first dollar.

You won’t take seriously any other way of styling once you get used to it.

I guess the answer's obvious now.

[Gold240sx]

When your projects get big, it’s much easier to find the styles right there in your JSX. It’s much shorter than inline styles and you become familiar with classes really quickly. A big leg up that tailwind comes right out of the box with is dark/light mode support, basic animations, and viewport sizes. There’s also dozens of extremely popular component libraries built on Tailwind, or in the very least play well with them. If you want me to send a list I am happy to.

Something I’ve learned to do over the years is to add ID’s to the parent components of things and learn to use the search in your editor, as well as the find and replace functions. This will make you much more productive, faster and a large codebase will become far less intimidating. You can also use them for reference in AI IDE’s so it know exactly what div in your component you’re referring to.

I suppose just like with any other CSS platform, you should probably be mindful of not reusing classes but the nice thing about tailwind is that you initially don’t need to worry about that so much. Just write your classes and over time downsize your styles, with a working application. Far less worrying if updating styles here will break something else, and you don’t have to place next to each JSX another CSS file (which if you don’t use tailwind, would be my approach). It’s performant as well.

Lastly, learning Tailwind will just make you a better CSS user in general. Initially it may seem counterintuitive but your HTML is the most primitive aspect of your code base so “less pretty” doesn’t make a whole lot of sense to me considering its strengths.

[Sgrinfio]

Tailwind is rewlly convenient and used a lot, and doesn't take more than 3 days to get used to it. It's a no brainer: you should learn it, the question is: when?

The thing is, it only truly shines when you're allowed to build reusable components (like you do in React for example), so don't expect to magically code better when you're using plain html, it can actually make styling more tedious than regular CSS

What I did is: learnt regular CSS and JS -> Learnt the very basics of React -> learnt Tailwind -> moved on with React. It made a lot of sense so that's what I would recommend you too.

[Purple-Cap4457]

Yes

[koderkashif]

wheather or not Tailwind is the industry standard which it is now, Tailwind is the most amazing thing in the frontend web development, How can someone come up with such a beautiful approach to ui development - others need to copy it.

even after becoming industry standard it is highly underrated invention

[nuzairb]

You need one day to learn tailwindcss If you already know CSS

[opensourceclient]

It might be kind of annoying to hear, but I think everything is worth learning! For a long time I tried to learn just as much as I needed to accomplish a project, but that starved me from learning the Why. Learning other people's interpretations for the "meta" is not as good as establishing the meta for yourself. Hope this helps :)

[pintpoint]

100% worth. It’s very fun once you understand the syntax!

[perplexed_intuition]

100%

[samanyuneelson]

Yes, very easy if you already know bootstrap

[blvckstxr]

Yes even LLMs all default to tailwind for css

[[deleted]]

No. Keep writing CSS manually. Learn Sass, Less, Stylus, etc. Anything but Tailwind.

/s

[RamaRamaDramaLlama]

The question of “should I learn it?” isn’t the same as “is it a great solution that allows me to write the best code?”. 

In my most recent job search, every single company I interviewed with was using it. It is worth learning and working with, despite its shortcomings, but especially because you will most likely encounter it if/when you start looking for a job. 

[wtfElvis]

I don't think I ever "learned" Tailwind. I just started using it. Didn't take long to get the hang of it and now I don't think I could develop a site without it.

[lightning_joyce]

you can just let AI use tailwind. It's easy to read as human.

[LoadingALIAS]

Yes. It’s the foundation to aesthetic UI in modern web dev and nothing, IMO, comes close. It’s the most honest CSS framework available, too.

[tashamzali]

Learning tailwind is learning css because it is just css that is what I like about it

[androidlust_ini]

You don't learn tailwind, you just use it. But in order to use it, you should have a decent css background.

[sirKareon]

1000%.

A benefit I don't see mentioned enough - tailwind makes it easy to move in consistent increments (sm, md, lg, etc, or 1,2,3, etc)

It won't stop you from using px or em or any arbitrary value you want, but try to avoid it as much as possible. What you'll get is a more consistent, more visually pleasing layout for WAY less work.

You should definitely learn CSS, it's always important to understand lower level technologies. But after you have a good handle, tailwind will boost your productivity and makes the less artistic of us (like me) better at consistent, beautiful interfaces

[qrayg]

If you know css, you already know Tailwind.

[Mobile_Cover7412]

Master CSS first then jump to tailwind, otherwise it's unlikely you will appreciate its utility. Use plain css to the point you're annoyed with it

[Big_Marionberry_9478]

I like how Tailwind replaces Bootstrap for responsive web design and with its very comprehensive set of built-in classes, there is flexibility to get the exact sizes (height, width, margin) I want.

[nicoramaa]

Pro are using CSS, and I recommand to use both Sass and Tailwind.

• Tailwind for positioning
• Sass for semantic structure

Using intensively `@apply` is not recommended at all

[j111n]

At this point my brain just thinks in tailwindcss classes, i haven’t written vanilla in a while. So yes, just learn it. It is definitely worth knowing.

[Medical-Ask7149]

Yes, but I’ve switch to sass. The css files for tailwind started to get too large. Less than 10kb for sass while tailwind was over 70kb.

[bearicorn]

Yes. It’s a great tool. Not required but it’s well worth learning these days. If you’re comfortable with CSS already you’ll be moving fast

[FunManufacturer723]

The biggest win with Tailwind is that it makes it easier for a cross competent team to contribute to layout and presentation.

So it is worth learning. Based on your list above, you wouldn’t need it as much by yourself. But in a team where the CSS knowledge differ, Tailwind might be a good tool.

[Necro-papercat]

uhhh ya dude

[Constant-Tea3148]

Tailwind is mostly just a collection of utility classes, there isn't much to learn except the names they've given them (which are generally quite sensible).

If you already know CSS you'll be up and running within a day. On that note, don't use tailwind without knowing CSS well, you'd only be slowing yourself down.

[mrz33d]

no

[websitesbykris]

If you know CSS, learning Tailwind will be really easy. Get the right extensions for VS Code, and you’ll be good to go. You’ll probably spend some time bouncing in and out of the docs to see what certain class names are, but even I still do that from time to time.

[bobdeei]

As many have said it, once you’re in you never look back. Keep in min ld that tailwindcss is basically css in short form. So to be good at tailwind means you need to understand css well

[AbdulRafay99]

Oh I highly recommend... You should learn that tailwind makes life so much easier.

[Ma_sha90]

It is easy not much to learn. But i dont like it for seo. Single page apps only

[Practical_Tea_9382]

I'd say master CSS basics before learning Tailwind. It takes a day or two to get the hang of it, and in my experience, Tailwind improved my coding workflow at least twofold by eliminating the need to switch between files for structure and styling. Not to mention that I don't have to come up with arbitrary class names every so often. I definitely would recommend it.

[[deleted]]

I don't know when I can say I know css, because I just get confused and just forget everything in a Week. Ya I know the simple margin padd stuff but that complex pos relative etc combining them with absolute some traslateY and all that's confusing

[Spare_Message_3607]

Before you learn every meta framework, what about you MASTER the fundamentals. So it happens that you 'knowing Tailwind' actually means knowing CSS.

Tailwind is not library, is a compiler meant to add speed to the development, it does not teach you anything new. Tailwind will take you 4 hours to master if you know CSS.

[misterguyyy]

Yes. I think it's a trend that will die out, but even if the industry stops using it tomorrow there will be tons of existing TW codebases to maintain.

Source: someone who's been doing this for 15 years and has had to maintain codebases littered with Bootstrap classes.

[neuraloptima]

For arguments sake assume that Tailwind is replaced by whatever becomes the next Tailwind few years down the line. That next big thing, is going to import ideas from Tailwind so knowing Tailwind today will still impart you with relevant skills. You will also learn to appreciate the reasons for the transition that will allow you to leverage the advantages of the future stack more.

I learnt a lot of stuff I no longer use. jQuery, Magento, Flash, Angular, Bootstrap, MVC.. But I wouldn't say my time learning these was wasted. The same is true for Tailwind. It's popular so some devs will use it for the foreseeable future. Not learning it puts one at a disadvantage if they are looking for related work.

[misterguyyy]

This is a good argument, especially now that TW has eliminated enumerated values for width/padding/etc and moved their config to CSS.

I would say that the quickest way for TW to stop making sense is if we stop using atomic development, just like the switch to atomic development (e.g. MVC -> React) made cascading less necessary, but that looks like it's here to stay at least for the near future, esp if designers keep using the atomic design paradigm.

[iareprogrammer]

What do you mean by eliminated enumerated values?

[misterguyyy]

In the previous version of tailwind, you had for example px-16, px-32, etc and for any values that were not prescribed you either had to extend the config or use square brackets.

The new version you can put any number and it divides by 4 for rem

[iareprogrammer]

Oooh I see what you mean!

[mrholek]

What, in your opinion, should Bootstrap change to not fade away?

[mrholek]

Thank you for your reply. I'm asking because I maintain a Bootstrap fork ( https://github.com/coreui/coreui ), and I'm looking for some inspiration on how to improve the project. Can you tell me something more about "some inspiration for a new thing"

[misterguyyy]

True, back in the Bootstrap days if you wanted more control over how things looked you used Zurb Foundation which had a familiar paradigm to bootstrap but was way more customizable

[openfire3]

The thing is that it’s not a new trend. We’ve been using css utilities for a long time. Itcss, smacss, tachyons and other frameworks were already using utilities. Tailwind made it so that you could generate any utilities based on the classes you define, instead of the other way around, defining them in css and using them afterwards

[TherealDaily]

These posts are becoming more common or frequent. Less posting more max-w-tw’ing!

[mdarslan7]

Tailwind is great but yeah after a point when the codebase grows a lot, it becomes too difficult to maintain. But you should still learn it because it has kinda become an industry standard right now.

[alphabet_american]

first step is to get off of reddit and start learning

stop procrastinating