@tailwindcss/oxide

!(https://github.com/user-attachments/assets/cf527dc2-7e42-4884-9628-dbb27459d2aa)

Holy shit it's actually done — we just tagged Tailwind CSS v4.0.

Tailwind CSS v4.0 is an all-new version of the framework optimized for performance and flexibility, with a reimagined configuration and customization experience, and taking full advantage of the latest advancements the web platform has to offer.

• New high-performance engine — where full builds are up to 5x faster, and incremental builds are over 100x faster — and measured in microseconds.

• Designed for the modern web — built on cutting-edge CSS features like cascade layers, registered custom properties with @property, and color-mix().

• Simplified installation — fewer dependencies, zero configuration, and just a single line of code in your CSS file.

• First-party Vite plugin — tight integration for maximum performance and minimum configuration.

• Automatic content detection — all of your template files are discovered automatically, with no configuration required.

• Built-in import support — no additional tooling necessary to bundle multiple CSS files.

• CSS-first configuration — a reimagined developer experience where you customize and extend the framework directly in CSS instead of a JavaScript configuration file.

• CSS theme variables — all of your design tokens exposed as native CSS variables so you can access them anywhere.

• Dynamic utility values and variants — stop guessing what values exist in your spacing scale, or extending your configuration for things like basic data attributes.

• Modernized P3 color palette — a redesigned, more vivid color palette that takes full advantage of modern display technology.

• Container queries — first-class APIs for styling elements based on their container size, no plugins required.

• New 3D transform utilities — transform elements in 3D space directly in your HTML.

• Expanded gradient APIs — radial and conic gradients, interpolation modes, and more.

• @starting-style support — a new variant you can use to create enter and exit transitions, without the need for JavaScript.

• not-* variant — style an element only when it doesn't match another variant, custom selector, or media or feature query.

• Even more new utilities and variants — including support for color-scheme, field-sizing, complex shadows, inert, and more.

Start using Tailwind CSS v4.0 today by installing it in a new project, or playing with it directly in the browser on Tailwind Play.

For existing projects, we've published a comprehensive upgrade guide and built an automated upgrade tool to get you on the latest version as quickly and painlessly as possible.

For a deep-dive into everything that's new, check out the announcement post.