4 ms·
I describe tailwind to people as a lightweight, classname-based abstraction over vanilla css rules. Unlike bootstrap where the button classname represents a co
by gpspake 4y ago
I describe tailwind to people as a lightweight, classname-based abstraction over vanilla css rules.
Unlike bootstrap where the button classname represents a collection of inherently opinionated and obfuscated css rules, the classnames map directly to the rules themselves - without any obfuscation behind a button class or opinions about what a button is. You can look at a tailwind classname and understand exactly what css rule is being applied.
It's universally repulsive at first sight. Everyone who loves tailwind said "hell no" - but they pushed through it and ultimately understood the value in it.
The reason that Bootstrap can't continue to exist as it does currently is because our js implementations have taken center stage and bootstrap requires a js implementation for many of its components. This means to use bootstrap with react for instance, you need a third party lib like reactstrap.
Tailwind is JS agnostic and frees you up to use the react (ng, vue, etc) ecosystem's idiomatic implementations for things like tooltips without adopting an entire bootstrap abstraction like reactstrap. Any respectable UI lib will allow you to pass classnames as props. You just pass in some tailwind classes as props and call it a day.
If your initial reaction is "this is ugly" I encourage you to dig deeper. Imagine never having to think of a name for a css class or context switch in to a 400 line css file to figure out what button means.
I like tailwind :)