Hacker News new | ask | show | jobs
by endisneigh 1694 days ago
It's kind of funny how things go. I've been using Tachyons since 2015 (before tailwind existed) - it was (and currently still is) very niche.

tailwind comes along and surges in popularity. it really goes to show you that marketing makes a difference!

for what it's worth I prefer tachyons because it's much simpler.

5 comments

Also a Tachyons fan. I looked at TailwindCSS, but stopped at the installation section. The recommended path to get it working with Create-React-App is to install a bunch of JS packages (PostCSS, autoprefixer) and to layer on another tool over CRA (craco)? No thanks, I'd rather just <link> tachyons.min.css and move on.
As much as I hate JS packages, when I read why Tailwind is built the way it is…it made a lot more sense.

You basically generate the kitchen sink in dev and then rip out everything you’re not using when it’s deployed so the actual package size is really tiny.

Author here, while it's not the default, newer versions of Tailwind have an experimental Just In Time mode, which inverts the approach to generate styles as you type them rather than upfront. Using JIT has greatly sped up my development workflow. Changing the config is significantly faster than in normal mode.
Compared to Tachyons being tiny by default and you just add anything else you need in another CSS file. It's just another CSS file, why is the 'Tailwind way' so averse to using custom CSS? Instead it includes every style by default and uses a javascript build step to strip out the unnecessary styles, good grief.

Utility CSS classes should augment your CSS, not be your entire CSS.

This is changing with v3 that is slated to be released before the end of the year. The JIT compiler for Tailwind is becoming the default now that it has had a year+ to bake in the wild and prove itself as reliable.

As far as the toolchain goes, meh. Building on PostCSS allowed the Tailwind team a lot of power with minimal complexity and it appears to have paid off for them. The JIT is plenty fast as is now; so fast in fact, that you can now run it in on a CDN build for prototyping/MVP.

https://github.com/tailwindlabs/tailwindcss/releases/tag/v3....

Wouldn't that be necessary for tree shaking? Including the entire stylesheet would add considerable overhead to your production site.
It's a shame that the Tailwind docs recommend to use craco. I think that's a major turn off. In that situation, I rolled my own npm-run-all customizations of the default scripts for start and build. It's extra noise but less than the documented approach.
Author here, I am eagerly awaiting the next version of Create React App. I'm hoping the upgraded internals will remove the need for CRACO. Here's a link to CRA v5 on Github:

https://github.com/facebook/create-react-app/milestone/81?cl...

I've used it with other tools / frameworks like Vite or Svelte; it's pretty agnostic. Plus setting it up is a one time thing.
It's because Tailwind looks good. It has well designed defaults & the documentation makes it look beautiful. I've used Tachyons before & enjoyed it, but it looks ugly in comparison.

If you're picking a framework that will eventually be used by developers who might not have any design skills, which would you prefer?

Tachyons shadows: https://tachyons.io/docs/themes/box-shadow/

Tailwind shadows: https://tailwindcss.com/docs/box-shadow

Tachyons colors: http://tachyons.io/docs/themes/skins/

Tailwind colors: https://tailwindcss.com/docs/customizing-colors

Even something like floats look better in Tailwind documentation despite being the same one line of CSS.

Tachyons floats: http://tachyons.io/docs/layout/floats/

Tailwind floats: https://tailwindcss.com/docs/float

Part of it is marketing and part of it is the novelty of using inline utility classes, but none of this explosive growth happens without a deep focus on design at every stage.

Documentation, defaults, examples, and color palettes all matter.

This is somewhat apples to oranges, but look at Bootstraps' navbar example page versus Tailwind's (paid) examples. One is a cluttered mess, the other is a carefully designed list.

Bootstrap 5 navbars: https://getbootstrap.com/docs/5.1/examples/headers/

TailwindUI navbars: https://tailwindui.com/components/application-ui/navigation/...

TailwindUI is not great comparison. Its a commercial product - bunch of snippets. You could build pretty similar thing with tachyons by replacing the class names to tachyons version.

I like tachyons looks more than tailwind but you can change tailwind using config to look exactly like tachyons but you cant turn tachyons into looking like tailwind.

So i use tailwind.

based on just opening the first two links - if I was picking a framework that will eventually have to handle accessibility issues like wcag contrast rules I think I might say take that tachyons stuff.

although probably making a decision like that based on how the documentation for the framework looks isn't actually reasonable.

> making a decision like that based on how the documentation for the framework looks isn't actually reasonable

How much effort someone puts into their documentation tells me a lot about how much effort they put into the product in general, and user-friendliness in particular.

Not really.

Single developer projects tend to put more effort into the code than the documentation, but that doesn’t mean the product isn’t good.

Startups can afford to put massive amounts into documentation and marketing while having a terrible product.

And big businesses can be anything.

Are you implying Tailwind is operating as the traditional startup? It's the exact opposite. Fully profitable right now with 8+ employees and what I would assume is tons of the money in the bank having listened to tons of interviews by Adam Wathan.

The Tailwind team is just insanely talented and committed to quality at every level. Not everything is a SV game of marketing and smoke screens.

> Are you implying Tailwind is operating as the traditional startup?

No. I’m simply saying that the quality of a website does not indicate quality of the product being shown. The only thing that will indicate if a product is good or not is testing it.

Tailwind obviously has great marketing and a great developer base, but not everything is the same.

I think this hits the nail on the head. Tachyons out of the box looks really ugly whereas Tailwind out of the box looks far cooler.
It might be partially marketing but there is one crutial difference between the two. I like default tachyons style a lot better than tailwind but tacyons cannot be customized (atleast it couldnt when ive tried it). Tailwind is essentialy postcss functional css system generator. I suspect most companies are going for specific colors/typography/spacing that fits their designs but follows tailwind naming. So that puts tachyons out of it.

I couldnt use tachyons in type of work i do but i can tailwind.

Author here, I am a big fan of Tachyons, too. It was my first introduction to utility-class CSS as a styling philosophy.
tachyons is excellent, nice to have a small library and build from there