Tailwind CSS 4 cheatsheet
Tailwind CSS 4: Installation
5 common Tailwind CSS 4 tasks.
Install with the Tailwind CLI
Install Tailwind CSS and its standalone command-line tool.
npm install tailwindcss @tailwindcss/cli
Install with Vite
Install Tailwind CSS and its Vite plugin.
npm install tailwindcss @tailwindcss/vite
Install with PostCSS
Install Tailwind CSS, its PostCSS plugin and PostCSS.
npm install tailwindcss @tailwindcss/postcss postcss
Import Tailwind in your CSS
Add this line to your main CSS file to load Tailwind's styles.
@import "tailwindcss";
Upgrade a Tailwind 3 project
Run the official upgrade tool, which updates dependencies and migrates your config and templates. Needs Node.js 20 or later.
npx @tailwindcss/upgrade
Caution: Run it on a clean git branch and review the diff afterwards.