How it works
Each Tailwind class does one thing: flex, mt-2, bg-white, md:grid-cols-3. Combining them in markup builds any design, and prefixes handle hover states, dark mode and screen sizes. At build time Tailwind scans your files and generates CSS only for the classes you actually used, so the final stylesheet stays small.
Version 4 moved configuration into the CSS file itself (theme values live in an @theme block) and rebuilt the engine for speed. Long class lists are the usual complaint; components, plus helpers such as clsx and tailwind-merge, keep them manageable. In 2026 Tailwind Labs joined Shopify. The framework stays MIT-licensed, while its paid Tailwind Plus kit of components and templates closed to new customers.
Tailwind CSS pros and cons
Pros
- Quick to style without switching files or inventing class names
- Consistent spacing, colour and type scales out of the box
- Small production CSS, since unused classes are never generated
- Works with any framework, and many UI kits build on it
Cons
- Long class lists can make markup hard to read
- A new vocabulary of class names to learn
- Design consistency still depends on the team, not the tool
When to use Tailwind CSS
Pick it when
- Most new web projects with custom designs
- Teams using component kits such as shadcn/ui
- Prototypes that need to look polished quickly
Skip it when
- A team that prefers separate stylesheets or CSS Modules
- An existing design system already built on another styling approach
Tailwind CSS pricing
Open source
Free (MIT). Tailwind Plus, the paid kit of components and templates, stopped taking new customers in September 2026; existing buyers keep access.
Approximate, checked September 2026.What the other tools cost
Tailwind CSS vs the alternatives
Related terms
More in Frontend
Styling and UI kits