“Disambiguating Tailwind”

Avatar of Chris Coyier
Chris Coyier on

DigitalOcean provides cloud products for every stage of your journey. Get started with $200 in free credit!

I appreciated this bit of nuance from a post on Viget’s blog:

There could be a whole article written about the many flavours of Tailwind, but broadly speaking those flavours are:

1. Stock tailwind, ie. no changes to the configuration,
2. Tailwind that heavily relies on @apply in CSS files but still follows BEM or some other component organization,
3. Tailwind UI, and
4. heavily customizing Tailwind’s configuration and writing custom plugins.

Leo Bauza, “How does Viget CSS?”

The way you use some particular technologies can be super different from how someone else does, to the point they share little resemblance, even if they share the same core.

Bootstrap is similar. You can link up Bootstrap off a CDN, the entire untouched built version of everything it offers. You can download the Sass/JavaScript source files, include them in your own project, and bring-your-own build process. This gives you the ability to customize them, but then that complicates the upgrade path. Or you could use Bootstrap from a package manager, meaning you’re referencing the source files from your own build process, but never touching them directly. Either way, if you’re using the source, you can then do things like customize it (change colors, fonts, etc.), and even trim down what parts of it you want to use.

React is similar. Vue is similar. You can link them up right off a CDN and use them right in the browser with no build process. Or they can be at the heart of your build process, and pulled from npm. Or they can be the foundation of a framework like Next or Nuxt.

When you multiply the fact that any given single technology can be used so many different ways with how many different technologies are in use on any given project, it’s no wonder why developer’s experience on projects is so wildly different and you hear a lot of people talking past each other in debate.