Moving away from Tailwind, and learning to structure my CSS • Hacker News Board

Re: Moving away from Tailwind, and learning to structure my CSS

#161

Post by timr » Sat, May 16, 2026, 5:45 PM UTC

9dev wrote: post #120

timr wrote: post #101

Earlier quoted context omitted.

> A Figma component has a certain set of styles, you apply those same styles to the corresponding React component. This is what CSS classes were made for . Of all of the arguments in favor of Tailwind, this is the one that drives me battiest. Say what you will about CSS, but "give a name to a re-usable set of styles for a component" is pretty much as fundamental as you can get. > And none of this really violates DRY,…

> This is what CSS classes were made for. That brings with it the problem of naming a thousand things in a consistent way that everyone on your team needs to understand and remember, otherwise you end up with tons of duplicated classes, parallel systems, and bike shedding. Have we, as an industry, not felt this pain often enough yet? Do we really need to keep banging our head against the wall to figure out it does hu…

> That brings with it the problem of naming a thousand things in a consistent way that everyone on your team needs to understand and remember, otherwise you end up with tons of duplicated classes, parallel systems, and bike shedding. Have we, as an industry, not felt this pain often enough yet? Do we really need to keep banging our head against the wall to figure out it does hurt?

Of course. It's obviously better to have 10,000 different names that are all loosely, but not exactly the same as the CSS property they're trying to represent.

Re: Moving away from Tailwind, and learning to structure my CSS

#162

Post by thiht » Sat, May 16, 2026, 5:47 PM UTC

HiPhish wrote: post #160

I just want to point out that you can use Tailwind inside your CSS with the `@apply` directive (not to be confused with the since abandoned CSS `@apply` rule). You write your CSS and mix in Tailwind instructions where it makes sense. Example: @import 'tailwindcss'; p { @apply text-justify; @apply bg-slate-300 dark:bg-slate-800; /* Second rule just for colors */ display: block; /* regular CSS */ } I used to be a big T…

> putting all those utility classes as inline styling into my HTML is a crime against nature.

It’s really not when working with components instead of pages, and when working with variables properly

Re: Moving away from Tailwind, and learning to structure my CSS

#163

Post by xigoi » Sat, May 16, 2026, 5:48 PM UTC

raincole wrote: post #71

I think the (misuse of) so-called "separation of concerns" has been the most harmful thing that happened in web front end development. HTML can CSS are the same kind of concerns: the presentation layer. The idea that HTML is purely semantic and has nothing to do with presentation is just burying the head in the sand. Separating HTML and CSS into different files is just like separating a bunch of methods/functions int…

HTML is the content layer. CSS is the presentation layer.

Re: Moving away from Tailwind, and learning to structure my CSS

#164

Post by thiht » Sat, May 16, 2026, 5:50 PM UTC

meerita wrote: post #146

The only problem with Tailwind is its syntax. It is anti-CSS. It is confusing and takes time to get used to. Heck, people even wrote cheat sheets. That makes adoption wrong, because people install it just because everyone else uses it or because the current thing brings it in. A long time ago, before Tailwind, I was writing true, pure functional CSS https://www.fcss.club/manifesto , and I never came back to the old O…

> It is confusing and takes time to get used to

I don’t believe Tailwind is inherently worse than pure CSS. If Tailwind had existed from day 1 on the web and you had learned it first you probably wouldn’t say this. In fact, if Tailwind had existed first somehow, and someone came up with CSS as we know it as a new revolutionary library, I’m not sure it would have succeeded.

Re: Moving away from Tailwind, and learning to structure my CSS

#165

Post by bitbasher » Sat, May 16, 2026, 5:50 PM UTC

I used Tailwind in one web based product and it was alright, but I'll never go back to using it.

The HTML bloat was really tough to deal with. I spend far more time in HTML than I'd like, and having more Tailwind classes than I do semantic HTML was really tough to look at.

I've settled on using vanilla CSS and applying styles per-page on an as needed basis. For example, include base styles (reset, primary theme, etc) and then include marketing styles (or: blog styles, dashboard styles, syntax highlighting styles, charting styles, etc).

It keeps each page light and minimal. Reading the HTML is easy. Styles stay consistent across any pages that share styles, etc.

Re: Moving away from Tailwind, and learning to structure my CSS

#166

Post by thiht » Sat, May 16, 2026, 5:56 PM UTC

grzes wrote: post #63

tailwind is an anti-pattern that breaks separation of concerns rule. i'm amazed how it became so popular.

Because it’s a made up rule, not a law of nature. Having the styles inline on a component is very easy to reason about, it was just extremely impractical with CSS and the style attribute. Tailwind makes it easy, practical, and is actually well designed regarding its support for variables (ie. you can have a sane design system easily).

What you want to share/cascade is variables, not styles. Styling components makes it easy to make sure the styling of each component is isolated and doesn’t have unintended cascading effects. When working this way, using Tailwind is as much a good pattern than, say, CSS modules (which I like too).

Re: Moving away from Tailwind, and learning to structure my CSS

#167

Post by bonesss » Sat, May 16, 2026, 5:57 PM UTC

reaperducer wrote: post #35

freedomben wrote: post #4

Earlier quoted context omitted.

You're not wrong, and I mostly agree with you. I die inside when I see the div soup that a lot of sites have become. However, I think there is value in being able to have the important parts of CSS merged into the HTML a bit. Where that line is, is certainly up for debate (and I don't have the answer), but I've found a lot of my tailwind sites are more readable to me than my pre-tailwind sites, often because I don't…

I don't have to context-switch and open a different file to be able to reason about the styling on an element Unless you're coding on a VT100 terminal, you just put the HTML in one window and the CSS in another. Subdivide as necessary, or as your monitor space allows. Heck, we were doing that back in 1989 on IBM PCs with MDA displays. If your CSS is so out of control that you can't wrap your brain around it, it's tim…

Even if one were limited to a single window, I’d hazard to guess that most modern web frameworks and languages have some degree of templating and pre-processing capabilities, which let you have logically contained files with HTML and CSS that decompose/render into separate files.

I’ve made setups like that on a number of projects (ASP.Net & various .Net web frameworks). keeping clean separation of concerns, proper cascading, but also a simplified development experience where the ‘component’ file contained all relevant code, markup, and local styling.

Re: Moving away from Tailwind, and learning to structure my CSS

#168

Post by thiht » Sat, May 16, 2026, 5:57 PM UTC

Alifatisk wrote: post #66

Oh, have we reached the end of the pendulum swing and are now swinging back to ordinary CSS again.

To be fair, CSS has evolved and improved A LOT in the past years, and a big reason why is Tailwind.

Re: Moving away from Tailwind, and learning to structure my CSS

#169

Post by thiht » Sat, May 16, 2026, 5:59 PM UTC

Polarity wrote: post #62

oh is this stupid hype of defining design in html with a random framework finally over? thank god!

Can we stop with this kind of trash opinion? Do you genuinely believe people use Tailwind because they don’t know any better? I understand why many people have a visceral reaction against Tailwind when learning about it for the first time, but when you actually use it, you really can understand why some of the "anti-pattern" stuff you learned about CSS doesn’t really apply with Tailwind.

Re: Moving away from Tailwind, and learning to structure my CSS

#170

Post by freedomben » Sat, May 16, 2026, 5:59 PM UTC

reaperducer wrote: post #35

freedomben wrote: post #4

Earlier quoted context omitted.

You're not wrong, and I mostly agree with you. I die inside when I see the div soup that a lot of sites have become. However, I think there is value in being able to have the important parts of CSS merged into the HTML a bit. Where that line is, is certainly up for debate (and I don't have the answer), but I've found a lot of my tailwind sites are more readable to me than my pre-tailwind sites, often because I don't…

I don't have to context-switch and open a different file to be able to reason about the styling on an element Unless you're coding on a VT100 terminal, you just put the HTML in one window and the CSS in another. Subdivide as necessary, or as your monitor space allows. Heck, we were doing that back in 1989 on IBM PCs with MDA displays. If your CSS is so out of control that you can't wrap your brain around it, it's tim…

VT100 for life!

But more seriously, I should have been more specific. Having the second file open in a split pain isn't that big of a deal, but having to navigate and find the right selectors can be. If class names are used well then it's pretty easy to find those, but my experience with that is riddled with inconsistency when I'm not the one who wrote it.

On that note, it's also much easier to review CSS changes in pull requests when they are right in line with the file. Otherwise I have to do the same lookup to find the corresponding HTML, and reason about whether the selector could potentially be grabbing things that aren't obvious, etc.