Why utility classes won

Tailwind replaces writing CSS rules with composing small single purpose classes directly in your markup. A padding class, a flex class, a colour class. Your HTML gets longer and your stylesheet stops growing.

The first reaction is usually that this looks wrong, and the objection is reasonable: it is the opposite of the separation people were taught. Three things explain why it won anyway.

Naming things is genuinely hard. A large share of CSS effort goes into inventing class names, then remembering them, then discovering that the name no longer describes what the component does. Utilities remove that work entirely.

Deleting is safe. With a stylesheet, nobody dares remove a rule because something somewhere might use it, so stylesheets only ever grow. Delete a component in Tailwind and its styling goes with it, because the styling was never anywhere else.

The constraint is the point. Tailwind gives you a scale for spacing, type and colour. You pick from that scale rather than typing arbitrary numbers, and the result is more consistent than most hand written CSS, especially across a team.

The real costs are worth stating. The markup is noisy. It is harder to read at a glance. And it works properly only with a build step that scans your files and includes the classes it finds.

Where it is not the answer: a small static page, or a team that already has a working design system.