Just noticed Tailwind 4 has been released:
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
, andcolor-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.
Anyone used it yet?
There’s a PragProg book on Tailwind (Modern CSS with Tailwind Book Club!) are there any other Tailwind learning resources worth a look?