Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Tailwind CSS v4.0

tailwindcss.com

Post reply on HN
Print view View original

31–40 of 296 posts

Re: Tailwind CSS v4.0

#31

Post by moojacob »

davidw wrote: post #28

Question for people who are good at CSS stuff. I am not. I'm upgrading a personal Phoenix project to 1.7, and Phoenix now uses Tailwind by default. So I thought I'd try and update my one page thing to use it instead of Bootstrap. So far, it looks like crap whereas the Bootstrap one looked 'good enough'. What's the easiest way to get something that looks kinda sorta decent, with some nice defaults, without trying to b…

If your looking for components like bootstrap try https://flowbite.com/ for free. Tailwind also has paid components. You just copy and paste. The cool part is once you get more comfortable you can start to tweak the flowbite components.

Re: Tailwind CSS v4.0

#32

Post by Sateeshm »

rglullis wrote: post #24
crooked-v wrote: post #5

Earlier quoted context omitted.

"Basically just inline CSS, but less fiddly and much more optimizable than the style attribute" was always the selling point of Tailwind in the first place.

Then , yes. But nowadays CSS is a lot more powerful and has caught up. So why bother with Tailwind?

Because of multitude of reasons. One of the big ones being never having to search through a style tag or finding a CSS file. 100% of the element styling is described in the element markup.

Tailwind was never about filling gaps in CSS.

Re: Tailwind CSS v4.0

#33

Post by BeetleB »

rglullis wrote: post #24
crooked-v wrote: post #5

Earlier quoted context omitted.

"Basically just inline CSS, but less fiddly and much more optimizable than the style attribute" was always the selling point of Tailwind in the first place.

Then , yes. But nowadays CSS is a lot more powerful and has caught up. So why bother with Tailwind?

Do you have any links describing what you mean? I'm not a CSS guru, and perhaps I know only the "old" CSS. I did recently learn Tailwind and it's way nicer than the "old" CSS.

If modern CSS makes styling as easy as Tailwind does, I'd love to read about it.

Re: Tailwind CSS v4.0

#34

Post by bushido »

davidw wrote: post #28

Question for people who are good at CSS stuff. I am not. I'm upgrading a personal Phoenix project to 1.7, and Phoenix now uses Tailwind by default. So I thought I'd try and update my one page thing to use it instead of Bootstrap. So far, it looks like crap whereas the Bootstrap one looked 'good enough'. What's the easiest way to get something that looks kinda sorta decent, with some nice defaults, without trying to b…

Tailwind and Bootstrap and are kinda apple vs apple pie. Tailwind provides classes that still need to be stacked to build components.

It'd be easier if you were using some source for UI components, I've used TailwindUI in the past, but that's paid. I'm sure there are good free alternatives.

Re: Tailwind CSS v4.0

#35

Post by Sateeshm »

crooked-v wrote: post #5
rglullis wrote: post #2

"Build times reduced", "no more @tailwind directives", "No more js configuration", "Designed for the modern web". To me, this screams "CSS now can do everything we used to do ourselves, but let's keep pretending that we are still needed somehow"

"Basically just inline CSS, but less fiddly and much more optimizable than the style attribute" was always the selling point of Tailwind in the first place.

But it's not just inline css though. The length of inline css string would almost always be 3 times longer than tailwind classes string.

Also inline css doesn't allow media queries, pseudo classes, etc., which is a big deal.

Re: Tailwind CSS v4.0

#36

Post by BeetleB »

crummy wrote: post #4
rglullis wrote: post #2

"Build times reduced", "no more @tailwind directives", "No more js configuration", "Designed for the modern web". To me, this screams "CSS now can do everything we used to do ourselves, but let's keep pretending that we are still needed somehow"

What did you need Tailwind for before that you couldn't do in normal CSS? Doesn't Tailwind map pretty much 1:1 to CSS?

> Doesn't Tailwind map pretty much 1:1 to CSS?

Much of it does, but not all of it.

Re: Tailwind CSS v4.0

#38

Post by todd3834 »

I’m a recent convert to tailwind. I’m very comfortable with css and I was initially turned off on the huge horizontal lines I saw in tailwind projects.

However, more and more component libraries are based on tailwind so I decided to try some immersion therapy.

Here are the top things I enjoy that was not obvious to me:

1. The class names are css shortcuts. Using them save you a lot of time. This is probably obvious to anyone who’s seriously looked at tailwind but I didn’t see that browsing the docs. I just saw nightmarishly long lines.

2. The lines look longer when you are not familiar with the class names. I initially pulled all of my class names out into a string outside my markup and included similar to how I’m used to using emotioncss. This made tailwind tolerable for me at first. However after several days I started to feel less turned off by those lines. I think it’s because I could recognize them. I will still break down a line with something like clsx.

3. clsx helps so much vs trying to entirely rely on tailwind syntax. The docs don’t discourage this at all but for some reason I thought it wasn’t idiomatic tailwind at first.

4. My app has to support a very large number of themes. Tailwind has proven to be a very attractive way of solving this problem. CSS variables are cool but the long syntax of using them is helped a lot in tailwind.

5. Adding my own custom variants is so easy and made me feel like a power user with such a small learning curve.

All of this is just my two cents to guide anyone who is like me watching from the sideline and wondering why? Why would anyone ever want to tolerate those “disgusting long lines mixed into the html”. Neo, all I see is the lady in the red dress now

Re: Tailwind CSS v4.0

#39

Post by jaredcwhite »

As a once-strident critic of Tailwind for its many failings and incompatibilities with the state of the actually-modern "vanilla" web art, I am very pleased to see the huge strides they've made with v4. Being able to access the Tailwind theme through native CSS variables (they even have an example in the docs of a button component written in native CSS in an external stylesheet using native variables! Oh happy day!) is absolutely massive, and being able to use a CSS-only config is equally amazing. Finally, Tailwind feels more like it's a utility (ironic, since its claim to fame is utility classes!) which you can add to any project, rather than some bizarro "viral" framework that wants to eat sensible architectures and lives in its own JavaScript-y silo.

Perhaps all the criticism over the years actually had an effect. Or maybe they finally arrived at good conclusions on their own. Either way, I suspect many of the pro/anti-Tailwind arguments are no longer relevant, and that's a Very Good Thing. Now we can get down to business and ship product.

Re: Tailwind CSS v4.0

#40

Post by BeetleB »

rglullis wrote: post #12
bitpush wrote: post #3

Earlier quoted context omitted.

Really!? Is that really what you got out of it? I understand you're not a fan of Tailwind, so perhaps say what you dont like about Tailwind instead of creating a strawman and attacking it. Also, shame on you for poo-pooing on someone else's open source project and people find useful.

"What I don't like about Tailwind" has less to do with Tailwind itself and more about the violation of separation of content and presentation that they push so hard. > poo-pooing on someone else's open source project This is not some young kid doing free software out of kindness. This is a company making millions of dollars in revenue in a closed source product (tailwind UI), which is built on a foundation (tailwindC…

> and more about the violation of separation of content and presentation that they push so hard.

As someone who's done it both ways with web sites, that separation sucked. Having to figure out which style in my CSS file was messing things up was always a pain. And Tailwind tends to be "local" by default, limiting the damage done to other elements when I style an element.

In my larger experience (not just with web sites), whether separating content and presentation is a good idea varies widely from use case to use case.

Post reply on HN