Tailwind CSS

Tailwind CSS changed how style gets written by pushing a utility-first approach: instead of writing separate stylesheets, you compose the look directly in the HTML with small classes (margin, color, spacing). Front-end work moves faster and stays consistent, with no fights over class names.

What is Tailwind CSS used for?

Tailwind provides a set of utility classes built on a design system (spacing scale, palette, typography). Its engine only generates the CSS that's actually used, so output files stay light. It integrates naturally with React, Next.js, and most front-end frameworks, and configures through a single file to match a brand's design.

Tailwind or plain CSS?

Plain CSS separates structure and style, which pleases purists; Tailwind embraces the mix to gain speed and avoid the drift of stylesheets that bloat over time. The recurring criticism is HTML cluttered with classes, less readable. In practice, reusable components solve that.

What are Tailwind CSS's limitations?

There's a learning curve to the class names, and markup gets verbose on complex elements. The framework itself is free, but its publisher sells Tailwind Plus (formerly Tailwind UI) separately, a paid component library, not to be confused with the framework itself.