Tailwind CSS ist ein CSS-Framework, das nach dem Utility-First-Prinzip arbeitet: Statt eigener Klassennamen mit ausgelagerten Stilregeln werden viele kleine, einzweckige Klassen direkt im HTML kombiniert, jede zuständig für genau eine Eigenschaft wie Innenabstand, Schriftgröße oder Farbe. Der Vorteil liegt in der Nähe von Struktur und Gestaltung, weil sich das Aussehen eines Elements an Ort und Stelle ablesen und ändern lässt, ohne zwischen Dateien zu wechseln und ohne Namen zu erfinden.
Da die verfügbaren Werte aus einer konfigurierten Skala für Abstände, Farben und Schriftgrößen stammen, entsteht nebenbei Konsistenz, was Tailwind zu einem praktischen Träger für ein Corporate Design macht. Beim Erzeugen der Auslieferungsdateien werden nur die tatsächlich verwendeten Klassen behalten, sodass die Stylesheet-Größe klein bleibt.
Der häufigste Einwand ist die Lesbarkeit, denn Elemente tragen oft lange Klassenlisten; in der Praxis wird das über wiederverwendbare Komponenten aufgefangen, weshalb sich der Ansatz vor allem in komponentenbasierten Umgebungen wie React oder Vue bewährt. Von klassischen Frameworks wie Bootstrap unterscheidet er sich grundlegend, weil dort fertig gestaltete Bedienelemente mitgeliefert werden, während Tailwind nur Bausteine für eigene Gestaltung bereitstellt.