Tw

Tailwind CSS

beginner

A utility-first CSS framework for rapid UI development.

Tailwind CSS gives you low-level utility classes that let you build custom designs without leaving your HTML. No more writing CSS files, fighting specificity, or naming things. It's controversial until you use it, then it's difficult to go back.

Web UI StylingDesign SystemsRapid PrototypingComponent Libraries

0/8 lessons

Setup

Install Tailwind via npm and configure it with PostCSS. Works with any framework — Vite, Next.js, Astro, plain HTML.

Bash

# Via Vite (recommended for new projects):
npm create vite@latest my-project -- --template vanilla
cd my-project
npm install -D tailwindcss @tailwindcss/vite

# Edit vite.config.js to add the Tailwind plugin,
# then add @import "tailwindcss" to your CSS file.

# Or standalone for plain HTML:
npm install -D tailwindcss
npx tailwindcss init