Utilities

Understand the flow and working of Tailwind's utility classes.

Tailwind’s utility classes

Tailwind’s utility classes are the most important part of Tailwind to understand.

Tailwind is made up of hundreds and hundreds of utility classes, most of which set the value of a single CSS property. For example, the .font-bold utility class is an alias for the CSS property, font-weight: 700. For class=font-bold, we use that utility in an HTML element as part of the class attribute.

The Tailwind system generates a set of utility CSS classes based on the Tailwind configuration file. We have a great deal of freedom over which classes are included and even the names Tailwind uses. Unless we clearly say otherwise, in this course, we’ll be talking about the default set of classes generated by a minimal configuration.

Get hands-on with 1200+ tech skills courses.