Tailwind CSS v4: The Rust Revolution

Tailwind CSS v4 is a major release that completely rewrites the engine in Rust for maximum performance.

10x Faster Builds

The new Rust-based engine processes your styles 10x faster than the previous JavaScript implementation. This means:

• Near-instant dev server startup
• Lightning-fast HMR updates
• Faster production builds

Automatic Content Detection

No more configuring content paths. Tailwind v4 automatically detects where your classes are used. Simply install and start using - the compiler figures out the rest.

Container Queries

Native support for container queries is finally here:

@container (min-width: 400px) {
  .card {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

New CSS Features

Tailwind v4 embraces modern CSS:

• Native CSS nesting support
• @starting-style for entry animations
• Improved dark mode handling with prefers-color-scheme

Breaking Changes

Before upgrading, be aware of these breaking changes:

• IE11 support has been dropped
• New configuration format (migration tool available)
• Updated color palette with better contrast ratios

Migration

Run the migration tool to update your configuration:

npx tailwindcss migrate

The upgrade is worth it for the performance gains alone.