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

151–160 of 296 posts

Re: Tailwind CSS v4.0

#151

Post by Ralfp »

skeletal88 wrote: post #147
aembleton wrote: post #145

Earlier quoted context omitted.

> I simply don't see the appeal. - Not having to name CSS classes - Easier to read as it's inline with the rest of your HTML - Standardised way of naming so that everywhere uses the same conventions - Not having to manage a separate file and remove unused components - Being able to use media queries, which I couldn't do in a style tag - No risk of changing a class that is used elsewhere. CSS has global scoping which…

The problem is that with bootstrap I have card, table, etc. With tailwind I have an unreadable alpabet soup when I am not a designer but a developer and am not familiar with tailwind.

And then you build on that, and you have card-alert, card-message card-message-small, card-body-alert, card-body-message, card-form, card-login-form together with extra sass variables for them.

And then you ask "why not just have variable for each component, not each component's style?" and this is where tailwind steps in.

Re: Tailwind CSS v4.0

#152

Post by lawn »

aembleton wrote: post #145
vim-guru wrote: post #119

CSS has become significantly more user-friendly than in the past, with most browsers now behaving consistently. It's worth learning as there is no build step involved, and it avoids cluttering your markup with excessive code. You could opt to use style attributes directly within your HTML. Historically, we avoided this to maintain a separation of concerns, but it's puzzling why some prefer reintroducing similar metho…

> I simply don't see the appeal. - Not having to name CSS classes - Easier to read as it's inline with the rest of your HTML - Standardised way of naming so that everywhere uses the same conventions - Not having to manage a separate file and remove unused components - Being able to use media queries, which I couldn't do in a style tag - No risk of changing a class that is used elsewhere. CSS has global scoping which…

> Easier to read as it's inline with the rest of your HTML

I really don't think a big blob of text with a bunch of unnamed divs is easier to read.

The styles night be easier to find but they're absolutely not easier to read.

Re: Tailwind CSS v4.0

#153

Post by gedy »

skeletal88 wrote: post #147
aembleton wrote: post #145

Earlier quoted context omitted.

> I simply don't see the appeal. - Not having to name CSS classes - Easier to read as it's inline with the rest of your HTML - Standardised way of naming so that everywhere uses the same conventions - Not having to manage a separate file and remove unused components - Being able to use media queries, which I couldn't do in a style tag - No risk of changing a class that is used elsewhere. CSS has global scoping which…

The problem is that with bootstrap I have card, table, etc. With tailwind I have an unreadable alpabet soup when I am not a designer but a developer and am not familiar with tailwind.

I greatly agree with you, but should mention that there is DaisyUI which is a Tailwind plugin that adds these for you. It seems inspired by Bootstrap and others: https://daisyui.com/

Re: Tailwind CSS v4.0

#154

Post by addandsubtract »

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.

The same can be said about Bootstrap, though. Just get a theme to make it look less bootstrapy. I think both viable ways to go, and it just boils down to personal preference (especially for hobby projects).

Re: Tailwind CSS v4.0

#155

Post by arcanemachiner »

preisschild wrote: post #125
arcanemachiner wrote: post #95

Earlier quoted context omitted.

FWIW Tailwind can be used as a standalone executable. This is how Phoenix/Elixir bundles Tailwind without requiring npm.

AFAIK using the tailwindcss-cli without npm makes it impossible to use Tailwind plugins, such as DaisyUI.

I believe that is true, although there is a project which bundles Tailwinds and DaisyUI into a single standalone executable:

https://github.com/dobicinaitis/tailwind-cli-extra

I have not tried this out yet, personally.

Re: Tailwind CSS v4.0

#156

Post by dbbk »

darkhorse13 wrote: post #136
tlrobinson wrote: post #70

Tailwind’s abuse of CSS classes as a DSL has always felt like a hack to me. You shouldn’t need a special editor extension to get highlighting/autocomplete/etc, just use TypeScript and a CSS-in-TS solution.

> just use TypeScript and a CSS-in-TS solution THIS is the definition of a hack to me, so yeah.

May be a hack but it just works.

Re: Tailwind CSS v4.0

#157

Post by dbbk »

nakovet wrote: post #15

I love tailwind, used in 3 projects in the past 4 years, it’s intuitive, well documented, simple. I don’t miss the days of emotion and styled components where I would have to think of a name for every styled div in the project, with tailwind a container is just a div and a few classes nothing else. Less bike shedding discussion, less brain cycles spent naming things, less time wasted in reviews.

> I don’t miss the days of emotion and styled components where I would have to think of a name for every styled div in the project

I see people mention this issue fairly frequently, and it puzzles me a little. I have never once spent probably more than 1 second thinking about what to name something. Is it actually a blocker for some people? Are you really paralysed by this?

Re: Tailwind CSS v4.0

#158

Post by agos »

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.

yeah, the palette is neat. My main gripe with Tailwind is that it blends a set of design tokens (which I like) with a technology to apply them (which I don't like)

Re: Tailwind CSS v4.0

#159

Post by fintechie »

nakovet wrote: post #15

I love tailwind, used in 3 projects in the past 4 years, it’s intuitive, well documented, simple. I don’t miss the days of emotion and styled components where I would have to think of a name for every styled div in the project, with tailwind a container is just a div and a few classes nothing else. Less bike shedding discussion, less brain cycles spent naming things, less time wasted in reviews.

Gave it a go for several projects, but didn't like it... for big projects it gets messy, fast. It also feels like it has become the new bootstrap.

I'm very happy with my current CSS-in-JS workflow. Crafting good old css with LLM help. You just show the LLM a pic, ask for the components.... boom, done (with proper naming, etc)

Re: Tailwind CSS v4.0

#160

Post by agos »

aembleton wrote: post #145
vim-guru wrote: post #119

CSS has become significantly more user-friendly than in the past, with most browsers now behaving consistently. It's worth learning as there is no build step involved, and it avoids cluttering your markup with excessive code. You could opt to use style attributes directly within your HTML. Historically, we avoided this to maintain a separation of concerns, but it's puzzling why some prefer reintroducing similar metho…

> I simply don't see the appeal. - Not having to name CSS classes - Easier to read as it's inline with the rest of your HTML - Standardised way of naming so that everywhere uses the same conventions - Not having to manage a separate file and remove unused components - Being able to use media queries, which I couldn't do in a style tag - No risk of changing a class that is used elsewhere. CSS has global scoping which…

no, a single html attribute containing "relative before:absolute before:top-0 before:h-px before:w-[200vw] before:bg-gray-950/5 dark:before:bg-white/10 before:-left-[100vw] after:absolute after:bottom-0 after:h-px after:w-[200vw] after:bg-gray-950/5 dark:after:bg-white/10 after:-left-[100vw]" is not "easier to read" (example taken at random from the Tailwind homepage)
Post reply on HN