Tailwind CSS

Tailwind CSS je utility-first CSS framework, který poskytuje nízkoúrovňové utilitní třídy pro tvorbu vlastních designů přímo v HTML. Místo psaní CSS do samostatných souborů vývojáři skládají design z tříd jako flex, pt-4, text-center nebo bg-blue-500 přímo na elementech. Framework odstraňuje nutnost pojmenovávat CSS třídy a spravovat rostoucí stylesheety, přitom zachovává úplnou designovou flexibilitu.

Utility-first přístup vede k velmi udržovatelným kódovým základnám, protože styly jsou explicitně v markupu a smazání elementu automaticky odstraní i jeho styly. Purge krok v produkci odstraní všechny nepoužité utilitní třídy, takže výsledné CSS bundly mají typicky méně než 10 KB. Konfigurační soubor umožňuje přizpůsobit design systém barvami, škálami odsazení, fonty a breakpointy specifickými pro projekt. Responzivní design se řeší prefixy breakpointů jako md: a lg:, stavové varianty jako hover: a focus: drží interakční styly přímo v markupu. Tailwind se stal jedním z nejrozšířenějších CSS frameworků v moderním webovém vývoji.