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.

Was this page helpful?