A brief history of Tailwind CSS

I started using Tailwind in 2018, right before the 1.0 era really took off, and I never looked back. The stable 1.0 release landed on May 13, 2019, which locked in the utility‑first approach many of us were already betting on.

Version 2 matured the framework through 2020 and 2021, including the big push that brought the JIT engine into core as an opt‑in in April 2021. That JIT shift changed everything about how I structure projects and rely on arbitrary values.

By December 9, 2021, v3 made JIT the default and expanded the design tokens and color story. That release is when many teams I work with finally standardized on Tailwind across apps and marketing sites.

On January 22, 2025, v4.0 shipped. It is a ground‑up refresh focused on performance, a CSS‑first configuration model, automatic content detection, and a first‑party Vite plugin. Full builds are several times faster and incremental builds happen in microseconds on warm caches. If you have not looked at Tailwind since v3, v4 will feel simpler to set up and faster to iterate with.

What can you do with Tailwind CSS?

I use Tailwind to ship interfaces without getting bogged down in naming debates or a growing pile of hand‑written CSS. Honestly, I do feel like my raw CSS muscle memory has faded a bit, but I build more and refactor less. That trade‑off has paid for itself many times over.

Here is what v4 makes easier in 2025:

• Faster feedback loops. The new engine compiles used classes extremely fast, which keeps hot‑reloads snappy on big projects.
• Zero‑drama setup. I can import a single line in my CSS, skip manual content globs, and start coding. When I need to include or ignore sources explicitly, I do it right in CSS with @source.
• CSS‑first customization. I declare theme tokens with @theme and get them as real CSS variables, which makes runtime theming and animation tricks straightforward.
• First‑party Vite integration. For greenfield apps I reach for the official Vite plugin to shave config and squeeze more perf out of dev builds.
• Modern features out of the box. Container queries, new transform utilities, color‑mix, and more are all available without extra plugins.

If you are coming from v3, read the official upgrade guide and try the migration tool before touching anything. It will save you an afternoon of yak‑shaving.

Good reads about Tailwind CSS

If you are new to my Tailwind material, start with setup in a real framework, then layer in the essentials I use on every build, and finally polish the rough edges.

Begin by wiring Tailwind into a PHP stack the exact way I do it today. I show how I scaffold the build, where I put the CSS entry point, and the small tweaks that keep Vite and Blade templates playing nicely in my Laravel integration walk‑through. As you read, cross‑check anything unfamiliar with the official guide on installing Tailwind with Vite.

With the project booted, lock in habits that make a Tailwind codebase scale. I summarized the guardrails I actually follow in my 2025 best‑practices write‑up (things like class composition patterns, when to extract components with @layer, and how I keep design tokens consistent).

Next, give your forms a sensible baseline so you are not fighting browser defaults. I show how to enable the official preset and when to scope it with utility classes in my focused guide to the forms plugin. If you prefer docs side‑by‑side, the plugin works in v4 by dropping a single directive into your stylesheet, which the readme covers clearly.

Most sites need long‑form content to look good too. I lean on the prose utilities and customization tricks I demo in my typography walkthrough. In v4 you register it with a one‑liner and you can even rename the class if your project calls for it (see the official instructions if you want a minimal example).

Once the foundations are solid, sprinkle in the polish that makes interfaces feel intentional. For modals and overlays, I show how to target the native element and keep the backdrop in sync with your transitions in this hands‑on backdrop styling tutorial. And because touch devices react differently, I prevent surprising interactions by stripping hover‑only affordances on phones the same way I describe in my mobile hover note.

If you are migrating an existing v3 app, read the official v4 announcement for a quick mental model of what changed (CSS‑first config, automatic class detection, dynamic utilities, and the Vite plugin are the big ones) then take the upgrade guide for a spin. I keep those links handy whenever I help teams modernize their stacks.