Installation (v4) in Tailwind CSS
From the Tailwind CSS cheat sheet · Installation & Setup · verified Jul 2026
Installation (v4)
Install Tailwind CSS v4 with Vite, PostCSS, or the CLI.
css
/* CDN (quickest way to try it) */
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
/* Install with Vite (recommended for projects) */
npm install tailwindcss @tailwindcss/vite
/* vite.config.ts */
import tailwindcss from "@tailwindcss/vite"
export default { plugins: [tailwindcss()] }
/* app.css - single import, no config file needed */
@import "tailwindcss";💡 v4 is CSS-first — no tailwind.config.js needed, use @theme in CSS instead
⚡ Just @import "tailwindcss" replaces all three @tailwind directives from v3
📌 Tailwind v4 auto-detects your source files — no content config needed
🟢 Use the Vite plugin for the best DX with hot reload and fast builds
installsetupv4
Continue with Tailwind CSS
Save the full cheat sheet or work through every related task.