TailwindCSS est un framework CSS utility-first qui fournit des classes atomiques prêtes à l'emploi (flex, pt-4, text-center, bg-white…) au lieu de composants pré-stylés. Chaque classe correspond à une seule propriété CSS, permettant de construire des interfaces directement dans le HTML sans écrire de CSS custom.
L'approche utility-first peut sembler verbeuse au premier abord, mais elle élimine les problèmes classiques du CSS : la cascade imprévisible, les conflits de noms, le CSS mort et la difficulté à maintenir une cohérence visuelle. Le design system est défini dans la configuration (couleurs, espacements, typographie) et chaque classe y fait référence.
TailwindCSS excelle en combinaison avec des moteurs de templates comme Twig ou des frameworks comme React. Son système de purge supprime automatiquement les classes inutilisées en production, générant un CSS final de quelques Ko seulement. Le dark mode, le responsive design et les états interactifs (hover, focus) sont gérés nativement via des préfixes dédiés.
