Tailwind v4 — What Changed and Why
A practical guide to tailwind v4 — What Changed and Why — tips, best practices, and real-world examples.
# Tailwind v4 — What Changed and Why
Tailwind CSS v4 is a major update with significant changes.
## Key Changes
### No More Config File
Tailwind v4 reads your CSS directly:
```css
@import "tailwindcss";
@theme {
--color-brand: #dc2626;
}
```
### New Engine
The new Oxide engine is:
- 10x faster builds
- Smaller output
- Better IntelliSense
### Built-in Content Detection
No need to configure `content` paths — it auto-detects.
## Migration Tips
1. Remove `tailwind.config.js`
2. Move customizations to CSS `@theme`
3. Update plugins to new format
## What I Love
- **Zero config** for most projects
- **CSS-first** approach
- **Lightning fast**
## Conclusion
Tailwind v4 simplifies setup and dramatically improves performance.
Tailwind CSS v4 is a major update with significant changes.
## Key Changes
### No More Config File
Tailwind v4 reads your CSS directly:
```css
@import "tailwindcss";
@theme {
--color-brand: #dc2626;
}
```
### New Engine
The new Oxide engine is:
- 10x faster builds
- Smaller output
- Better IntelliSense
### Built-in Content Detection
No need to configure `content` paths — it auto-detects.
## Migration Tips
1. Remove `tailwind.config.js`
2. Move customizations to CSS `@theme`
3. Update plugins to new format
## What I Love
- **Zero config** for most projects
- **CSS-first** approach
- **Lightning fast**
## Conclusion
Tailwind v4 simplifies setup and dramatically improves performance.
Tailwind
CSS