Mastering Tailwind CSS v4

Tailwind CSS changed how we write CSS. Version 4 changes how we *configure* it. It's faster, lighter, and zero-config by default.

The New Engine: Oxide

v4 is rewritten in Rust. The build times are instant. The "Just-in-Time" (JIT) mode is now the only mode. There is no `tailwind.config.js` file necessary for most projects; it just scans your CSS and works.

CSS Variables for Everything

Instead of a JS theme object, v4 embraces native CSS variables. You define your theme in CSS:

@theme {--color-primary: #a855f7; --font-sans: Inter, sans-serif;}

This makes your design tokens portable and inspectable right in the browser dev tools.

Dynamic Utilities

Constraint-based values are looser now. You can use 3D transforms, gradients based on oklch colors, and complex container queries right out of the box without plugins.