DEV Community

Alex Spinov
Alex Spinov

Posted on

Tailwind CSS v4 Has a Free Zero-Config CSS Framework — No PostCSS Required

#tailwindcss #webdev #css #frontend

Tailwind CSS v4 dropped PostCSS, gained a custom engine that's 100x faster than v3. CSS-first configuration, automatic content detection, and a tiny runtime.

What Changed in v4

Tailwind v3 required: PostCSS, tailwind.config.js, content path configuration, and a JIT compiler that sometimes missed classes.

Tailwind v4: one CSS import. That's the entire setup.

@import 'tailwindcss';
Enter fullscreen mode Exit fullscreen mode

No config file. No PostCSS. No content paths. It just works.

What You Get for Free

100x faster builds — custom Rust-based engine (Oxide) replaces the Node.js compiler
Automatic content detection — scans your project files without configuration
CSS-first config — customize in CSS, not JavaScript:

@import 'tailwindcss';

@theme {
  --color-primary: #3b82f6;
  --font-display: 'Inter', sans-serif;
  --breakpoint-3xl: 1920px;
}
Enter fullscreen mode Exit fullscreen mode

Container queries — @container support built-in
3D transforms — rotate-x-45, perspective-500
Field sizing — field-sizing-content for auto-sizing textareas

Quick Start 

npm i tailwindcss @tailwindcss/vite
Enter fullscreen mode Exit fullscreen mode

Add to your Vite config:

import tailwindcss from '@tailwindcss/vite';
export default { plugins: [tailwindcss()] };
Enter fullscreen mode Exit fullscreen mode

Add to your CSS:

@import 'tailwindcss';
Enter fullscreen mode Exit fullscreen mode

Done. No config file. No content paths.

Performance Numbers

  • Full build: 100ms (v3: 10+ seconds for large projects)
  • Incremental rebuild: <10ms
  • Output CSS: only classes you actually use

Migration from v3 

npx @tailwindcss/upgrade
Enter fullscreen mode Exit fullscreen mode

Automatic codemod handles most changes. The main difference: config moves from JS to CSS.

If you've been putting off Tailwind because of config complexity — v4 eliminated the config.

Need web scraping or data extraction? Check out my tools on Apify — get structured data from any website in minutes.

Custom solution? Email spinov001@gmail.com — quote in 2 hours.

Top comments (0)