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

Why Tailwind CSS Won

matt-rickard.com

Post reply on HN
Print view View original

51–60 of 559 posts

Re: Why Tailwind CSS Won

#51

Post by yurishimo »

anonyfox wrote: post #5

I am a not-good-at-ui dev, meaning I _can_ build UIs pixel perfect if given some exact design files, but it is incredible hard for me to come up with things on my own. So whenever I build something that is not already defined fully by designers (like: most of the time), I have to use some UI component catalog like bootstrap and start assembling my UI based on the options there, at most I switch a theme file to someth…

At the beginning, it's going to feel like a drop in velocity. If you only copy and paste raw code and do not make components, then it will feel like a lot of work to change the accent color from blue to yellow (unless you're really good with regex).

If you want a more Bootstrap like experience, look into something like DaisyUI. It gives you a high level primitive similar to Bootstrap, but built on the philosophy of Tailwind in regards to ultimate customization using utilities.

If/when you get more comfortable with the tailwind primitives, you can easily make your own component abstractions that work for your needs.

Re: Why Tailwind CSS Won

#52

Post by xigoi »

bennyp101 wrote: post #14

For getting designs up and running quickly, it really is great. Being able to think "Hmmm, I want a rounded button, with a border and a blue background" and just typing class="rounded border border-blue-600 bg-blue-500" and it's done. With lots of UI being components now, it doesn't really matter that it is verbose - I actually find that helpful. And even if you want to have a class that you use all over the place, j…

> Being able to think "Hmmm, I want a rounded button, with a border and a blue background"

I rarely think this. It's usually “I want a button that looks like all other buttons on my site”. Vanilla CSS is great for that.

Re: Why Tailwind CSS Won

#53

Post by xigoi »

codersfocus wrote: post #31

The hardest part about programming is naming things. If you use tailwind you don’t have to name things. That’s why it won.

Do you also use De Bruijn indices when programming so you don't have to name variables?

Re: Why Tailwind CSS Won

#54

Post by throwaway4027 »

fbnlsr wrote: post #11

I don't get Tailwind. In my book, CSS is here to facilitate the style of multiple webpages by modifying a set of rules, and classes are here to mutualise said rules. With Tailwind, it looks like you design by writing HTML, which is the opposite of what CSS aims at. So if you wish to change your design, you'll have to update multiple templates instead of one CSS rule. Every time I've had to work with Tailwind, it felt…

I agree with you. As a developer I like the separation of style and content. We also gain better readability when the code says "199" than a long list of tailwind classes.

CSS styles are also more reusable across different web sites. I can to some degree see that you can increase re-usability when using shared React components, but then you just create technical debt for those who want to test other frameworks

It seems to me that Tailwind is only a semi-scalable solution for those who use React components or similar. But as mentioned above, that causes problems when you want to make other webapps in another framework

Re: Why Tailwind CSS Won

#55

Post by mrieck »

anonyfox wrote: post #5

I am a not-good-at-ui dev, meaning I _can_ build UIs pixel perfect if given some exact design files, but it is incredible hard for me to come up with things on my own. So whenever I build something that is not already defined fully by designers (like: most of the time), I have to use some UI component catalog like bootstrap and start assembling my UI based on the options there, at most I switch a theme file to someth…

I made a Chrome extension called SnipCSS that is made for not-good-at-ui devs.

Instead of using a framework, I just rip other sections of website designs I like using my tool. The paid version even scopes the snippet and gets all responsive styles.

Theming abilities are on the roadmap and with AI being able to adjust my snippets eventually - I really don’t see the need for extremely verbose frameworks like Tailwind. But I could be wrong, I’m probably biased after having worked on it for a couple years.

Re: Why Tailwind CSS Won

#56

Post by jjdeveloper »

sod wrote: post #45

If css had a strong opinion and better syntax for responsiveness by screen width, css frameworks were way less popular. Tailwind, bootstrap and co. aren't used to avoid writing css. It's used because writing `class="my-4 mb-sm-5 mb-lg-6"` is so much faster and easier then doing this with a bunch of media queries and a class name, that has to be unique, because css is a global scope nightmare. I mean, just look at it.…

That’s not tailwind code. Would be class="my-4 sm:mb-5 lg:mb-6"

Re: Why Tailwind CSS Won

#57

Post by pookah »

xigoi wrote: post #49
blowski wrote: post #24

Earlier quoted context omitted.

I can sum up what I like about Tailwind in the following code: ``` (in CSS) a.link { border: red; } a.link:hover { border: blue; } ``` ``` (in Tailwind) ``` It's much easier in Tailwind for me to see locally what's going on with that styling. If I lived in this code all the time, or I was good at structuring CSS, then maybe the first would be more appealing. But I'm a shit at CSS, it always turns into an unmaintainab…

Now imagine that you want to change the border color to yellow. Would you rather change a single line of CSS, or every single link on all your pages?

[dead]

Re: Why Tailwind CSS Won

#58

Post by nannal »

xigoi wrote: post #49
blowski wrote: post #24

Earlier quoted context omitted.

I can sum up what I like about Tailwind in the following code: ``` (in CSS) a.link { border: red; } a.link:hover { border: blue; } ``` ``` (in Tailwind) ``` It's much easier in Tailwind for me to see locally what's going on with that styling. If I lived in this code all the time, or I was good at structuring CSS, then maybe the first would be more appealing. But I'm a shit at CSS, it always turns into an unmaintainab…

Now imagine that you want to change the border color to yellow. Would you rather change a single line of CSS, or every single link on all your pages?

ctrl+h

Suppose we want to change just one link? Would it be better to make a new class with all the same attributes except the color and apply that to the specific link.

Re: Why Tailwind CSS Won

#59

Post by pookah »

rpastuszak wrote: post #18

I think Tailwind is more accessible to many[*] less experienced or CSS-oriented developers. Big generalisation , I know, please don't yell at me, but many of us can get 99% of Tailwind's value with UI libraries supporting: 1) style encapsulation, 2) colocated presentation/content/behaviour and 3) a more minimalist mindset/habits when building UIs (e.g. relying on simpler styling hierarchies, native DOM elements, sema…

[dead]

Re: Why Tailwind CSS Won

#60

Post by ilaksh »

Tailwind usually makes more sense with React or some other component system. If you are not using components, Bootstrap might still be a reasonable choice.
Post reply on HN