Tailwind CSS — Utility-First CSS Framework

Overview

Tailwind CSS builds designs from single-purpose utility classes (flex, p-4, text-sm) written directly in HTML or JSX. The compiler scans your source files, generates only the classes it finds, and reads design tokens (colors, fonts, radii, breakpoints) from CSS variables declared in @theme. Since v4 there is no tailwind.config.js by default and no content list: configuration lives in your CSS file and class detection is automatic.

Instructions

Install (v4)

# Vite (recommended for Vite, SvelteKit, Astro, etc.)
npm install tailwindcss @tailwindcss/vite
# PostCSS (Next.js and others)
npm install tailwindcss @tailwindcss/postcss
# Standalone build with no bundler
npm install tailwindcss @tailwindcss/cli