A utility-first CSS framework packed with classes like flex, pt-4, text-center and rotate-90 that can be composed to build any design, directly in your markup.

<div class="flex flex-col items-center rounded-2xl">  <div>    <img class="size-48 shadow-xl" alt="" src="/img/cover.png" />  </div>  <div class="flex">    <span>Class Warfare</span>    <span>The Anti-Patterns</span>    <span class="flex">      <span>No. 4</span>      <span>·</span>      <span>2025</span>    </span>  </div></div>

Sponsors

Supported by the best.

Tailwind is supported by incredible partners and sponsors who make it possible for a team of talented designers and engineers to maintain the framework full-time.

Why Tailwind CSS?

Built for the modern web.

Tailwind is unapologetically modern, and takes advantage of all the latest and greatest CSS features to make the developer experience as enjoyable as possible.

How it works

Ship faster and smaller.

text-base text-gray-950text-white

Tailwind automatically removes all unused CSS when building for production, which means your final CSS bundle is the smallest it could possibly be. In fact, most Tailwind projects ship less than 10kB of CSS to the client.

Tailwind in the wild

Build whatever you want, without touching your CSS file.

text-base text-gray-950text-white

Because Tailwind is so low-level, it never encourages you to design the same site twice. Some of your favorite sites are built with Tailwind, and you probably had no idea.

Ready-made Components

Move even faster with Tailwind Plus.

Tailwind Plus is a collection of beautiful, fully responsive UI components, designed and developed by us, the creators of Tailwind CSS. It's got hundreds of ready-to-use examples to choose from, and is guaranteed to help you find the perfect starting point for what you want to build.