WorkAboutBlogContactStart a project
All articles
CSSApril 3, 2025·7 min read

Tailwind CSS v4: what changes and why it matters

Tailwind v4 brings 5× faster builds, a new CSS-native syntax and a completely reworked theme system. Here is everything you need to know.

3
Team 3bit
Frontend Development

Tailwind CSS v4 was released in January 2025 and represents the most significant change in the framework's history. This isn't about incremental additions — it's a deep rewrite that changes how we think about configuration, theming and integration with modern tooling.

Goodbye tailwind.config.js

The most impactful change: configuration moves entirely to the CSS file. No more tailwind.config.js — everything now lives in @theme, a native CSS directive Tailwind introduces to define the design token system.

Before (v3)

In v3, the JavaScript configuration file defined colours, fonts, breakpoints and every aspect of the design system. A functional approach but one that required leaving CSS to manage CSS.

Now (v4)

With @theme, tokens live in the CSS itself as custom properties. The result is a more coherent and intelligible system where all design is defined in one place — the stylesheet.

Performance: 5x faster builds

The new engine, rewritten in Rust, brings drastic improvements: full builds up to 5x faster than v3, and incremental builds over 100x faster. In a real medium-sized project, this means going from 800ms to under 100ms for a rebuild.

  • Full build: up to 5x faster
  • Incremental build: over 100x faster
  • Significantly reduced memory usage
  • No PostCSS dependency (optional in v4)

Native Vite plugin

Tailwind v4 introduces @tailwindcss/vite, a native Vite plugin that replaces the need to configure PostCSS. Integration is immediate and brings even better performance to the development server.

We updated this very site to Tailwind v4 during development. Build time went from 2.1s to 0.4s. The developer experience improved noticeably.

Compatibility and migration

Migrating from v3 to v4 requires some care. Existing utility classes are almost all compatible, but the configuration needs rewriting. The Tailwind team has released an automatic migration tool that handles most cases.

Is it worth upgrading?

For new projects: absolutely yes, start directly with v4. For existing projects: evaluate the migration cost. On medium-sized projects the cost is low (2-4 hours) and the benefits in terms of DX and build time are immediate.

Share
Previous articleWhy Astro is the future of static sitesNext articleCore Web Vitals 2025: a practical optimisation guide
Contact

Got a project in mind?

Tell us about your idea. We'll get back to you within 24 hours.

✓ Messaggio inviato! Ti risponderemo entro 24 ore.
Please complete the security check to send your message.
The security check is unavailable right now. Please email us directly at hello@3bit.it.
Sending failed. Please try again or email us at hello@3bit.it.
Cal.com

Book a call

Pick a time that suits you — 30 minutes to tell us about your project.

Booking calendar

The calendar is provided by Cal.eu, an external service that sets its own technical cookies. It is only loaded if you choose to open it.