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

171–180 of 296 posts

Re: Tailwind CSS v4.0

#171

Post by _heimdall »

ricw wrote: post #96
jmull wrote: post #61

Earlier quoted context omitted.

> Or should I just reinstall Bootstrap and be done with this. That one. Tailwind gives you tools when you want to control the design, but you’ve got to control the design. When you just want something that looks good and don’t mind that bootstrap-y feel, bootstrap is the way to go. (There are projects that essentially recreate bootstrap on top of tailwind, which, in theory, might give you something like bootstrap as…

Disagree. Just get one of the tailwind UX kits and use their classes as your standard style guide. I personally use flowise as it’s free with paid more complex components if needed, but there are a bunch of others out there that fill the same space.

On a new project, sure maybe going with tailwind + a theme/kit is a bit more up to date than using bootstrap. But on an existing page that already looked fine with bootstrap, why bother with the extra work?

Re: Tailwind CSS v4.0

#172

Post by _heimdall »

rglullis wrote: post #19
ervine wrote: post #9

Earlier quoted context omitted.

Whether you enjoy utility classes isn't really related at all to what css supports.

Maybe you are making my point? If tailwind was "just utility classes", fine. But what business would it be there if they just published a bunch of CSS files with their styles? With modern CSS, what problem are they really solving now ?

In my experience, the main problem it solves is the fact that styling in react is still a pain in the butt.

Re: Tailwind CSS v4.0

#173

Post by _heimdall »

BeetleB wrote: post #36
crummy wrote: post #4

Earlier quoted context omitted.

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.

Do you have an example that Tailwind can do that can't be done in CSS?

Re: Tailwind CSS v4.0

#174

Post by Lockal »

agos wrote: post #164
throwup238 wrote: post #97

Earlier quoted context omitted.

One of the reasons Tailwind became so popular - even more so than preceding frameworks like Bootstrap - is that a lot of people who normally liked working with CSS directly fell in love with it. It removes the extra step of editing a separate CSS file without straying far from a 1:1 mapping and eliminates most of the cascading rules that have plagued frontend for decades (`group:` and friends notwithstanding). The la…

sorry, but this is just not true. The cascading issue is still there, and it gets even worse because if you have an element with class "p-1 p-0" you cannot know in advance which will take precedence. Of course you shouldn't do that, but it happens to be the case that Phoenix does exactly that

You suddenly reminded me about another good Tailwind thing: linter will highlight "p-1 p-0" as a mistake. I've never seen linters that warn on "your-custom-p1 your-custom-p0", but Tailwind makes it possible.

Re: Tailwind CSS v4.0

#175

Post by tambourine_man »

skydhash wrote: post #65
tipiirai wrote: post #64

Earlier quoted context omitted.

> I suspect many of the pro/anti-Tailwind arguments are no longer relevant I feel there are two issues with Tailwind for me as a designer / design engineer. * First, JavaScript/Tailwind engineers have hijacked the conversation on design. Instead of "utility-first," "dead code elimination," and "type-safe CSS" I focus more on desing systems. Whether to use Perfect Fifth or Perfect Fourth in typography for example. * S…

Maybe Tailwind is useful for bigger projects, but I tend to prefer component based class instead. The biggest DX for CSS is using the web inspector and directly modifying the DOM, then copying the adjusted values to the text editor. For a much serious project, I go with the balsamiq -> figma route to create an actual design system.

You can allow the inspector to access the filesystem and modify the files without having to copy/paste for even better DX.

Re: Tailwind CSS v4.0

#176

Post by jgalt212 »

4m1rk wrote: post #85
jaredcwhite wrote: post #39

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!)…

I just want the color palette of the Tailwind CSS.

Yes, someone should make a tailwind inspired bootstrap theme.

Re: Tailwind CSS v4.0

#177

Post by rglullis »

listenallyall wrote: post #108
rglullis wrote: post #24

Earlier quoted context omitted.

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

A concrete example that seems like a no-brainer to me: let's add a little padding to the top and bottom of an element. "py-2" Done. In CSS, specifying padding (or margins) is 4 values... except I forget which is the first one. And what units should I use... px, pt, rem, em. Inline, same-page style, or an external .css file? If not inline, what should I name the class? Vanilla CSS literally requires 10x more time and…

> "py-2" Done. In CSS, specifying padding (or margins) is 4 values... except I forget which is the first one.

False dichotomy. You are not stuck between tailwind and "Vanilla CSS", and one can solve the issue you are presenting with any reasonable set of SASS mixins.

> If not inline, what should I name the class?

Also solvable with good old SASS.

Re: Tailwind CSS v4.0

#178

Post by KolmogorovComp »

skeletal88 wrote: post #149
ricw wrote: post #96

Earlier quoted context omitted.

Disagree. Just get one of the tailwind UX kits and use their classes as your standard style guide. I personally use flowise as it’s free with paid more complex components if needed, but there are a bunch of others out there that fill the same space.

Can you suggest which of these kits are good?

DaisyUI

Re: Tailwind CSS v4.0

#179

Post by rglullis »

jitl wrote: post #90
rglullis wrote: post #24

Earlier quoted context omitted.

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

CSS has become more confusing over time, not less confusing, so the upside of a utility class approach like Tailwind is also improving over time rather than decreasing. Tailwind solves css confusion by presenting a “paved road” for many tasks. Want to do “thing”? Just look up “thing” in the tailwind docs, add “thing-2” to your class, done in 2 minutes. Rather than look up “thing” on google, skim several articles, the…

> With tailwind, just add 2 classes, done.

But you can do that with a library of SASS mixins as well.

Going through some of the answers I'm noticing that another "issue" I have with the tailwind approach is that it works by providing a post-processor when in reality most people just need a simple preprocessor and macro system.

Re: Tailwind CSS v4.0

#180

Post by christophilus »

whstl wrote: post #170
Fred27 wrote: post #167

Tailwind suits the kind of developers who hack things together and build up technical debt and spaghetti code rather thinking about things first and designing things properly.

I don't know. In 20+ years I have seen way more abominations and spaghetti CSS using other every CSS technique. With Tailwind at least I know what to expect, and the code in practice rarely deviates from what it's supposed to look like. I'm all for "not building up technical debt" and "thinking about things first" but in my personal experience the anti-Tailwind crowd doesn't have much to show here in this regard. Sur…

Same. Been doing this for 20+ years. I’ve worked at companies whose names are recognized and respected. My current Tailwind project is by far the most maintainable one I’ve worked on when it comes to CSS.
Post reply on HN