Coco Dubois
Back to blog

Tailwind CSS v4: What Changed and Why It Matters

·Coco Dubois
Tailwind CSSCSSFrontend

Tailwind CSS v4 is a major release — not just an incremental update, but a rewrite of the engine underneath. After migrating two production projects, here's my take on what matters.

The New Engine

The most impactful change is the new Oxide engine. Build times dropped noticeably in my projects, especially on larger codebases where Tailwind used to add seconds to the dev server startup.

CSS-First Configuration

Gone is tailwind.config.js. Configuration now lives in your CSS file using @theme directives. This felt strange at first but quickly grew on me — your design tokens are right where you use them.

What I Had to Change

  • Moved all config from tailwind.config.js to @theme blocks in CSS
  • Updated a few class names that were renamed for consistency
  • Replaced @apply in some places where native CSS nesting now works better

Is It Worth Upgrading?

Yes. The faster builds alone justify the migration, and the CSS-first configuration is genuinely better once you adjust. The migration path was smoother than I expected — most of my utility classes worked without changes.

If you're starting a new project, v4 is the clear choice. For existing projects, plan a migration sprint — it's not a weekend side project, but it's not painful either.