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
Back to the full Tailwind CSS cheat sheet