Au début, Tailwind m'a fait peur. Toutes ces classes dans le HTML. Ce code qui ressemblait à du bruit. "C'est illisible", je me disais. "C'est pas propre." Puis j'ai essayé. Et j'ai compris que Tailwind, c'était pas du désordre. C'était une nouvelle langue. Une langue qui se parle dans les marges.

Le CSS traditionnel : l'éloignement

Avant, j'écrivais mon CSS dans un fichier séparé. Loin du HTML. Je donnais des noms à mes classes. .card-container. .button-primary. .header-title-big. Et à chaque fois que je voulais changer quelque chose, je faisais des allers-retours. Le HTML d'un côté. Le CSS de l'autre. Deux fichiers ouverts. Deux contextes mentaux.

« C'était comme écrire une lettre et mettre les émotions dans un document à part. »

Ça fonctionnait. Mais c'était fatigant.

Tailwind : tout au même endroit

Avec Tailwind, le style est là où il se passe. Dans le HTML. À côté de l'élément. Tu veux un padding ? Tu écris p-4. Une marge ? m-2. Du texte centré ? text-center. Une couleur ? text-gray-600. Tout est visible. Tout est immédiat. Tu lis l'élément, tu comprends son style.

✦
C'est comme annoter un livre directement dans les marges. Pas besoin d'un carnet séparé. Les pensées sont là où elles naissent.

Le vocabulaire s'installe

Les premiers jours, je cherchais tout. "C'est quoi la classe pour justify-content center déjà ?" Je passais mon temps sur la doc. Puis les mots se sont installés. flex. items-center. justify-between. gap-4. rounded-lg. shadow-md. C'est devenu un réflexe. Une seconde langue que je parle sans réfléchir.

« Apprendre Tailwind, c'est comme apprendre du vocabulaire. Au début tu traduis. Après tu penses directement dedans. »

Les contraintes qui libèrent

Tailwind impose des valeurs. p-4, pas p-17. text-sm, text-base, text-lg. Pas de chiffres arbitraires. Au début, ça m'a frustrée. Je voulais MES valeurs. MON spacing précis. Puis j'ai compris. Les contraintes créent la cohérence. Quand tout le monde utilise la même échelle, tout s'aligne naturellement. Plus de "pourquoi c'est 13px ici et 15px là ?".

✦
Les limites ne sont pas des prisons. Ce sont des garde-fous. Elles m'empêchent de partir dans tous les sens. De réinventer la roue à chaque div.

Le responsive sans douleur

md:flex. lg:grid-cols-3. sm:hidden. Le responsive, avant, c'était des media queries partout. Des blocs de CSS qui se répétaient. Un cauchemar à maintenir. Avec Tailwind, c'est un préfixe. Un mot devant la classe. Et c'est fait. Je me souviens de la première fois où j'ai écrit "hidden md:block" et que ça a marché du premier coup. J'ai souri toute seule devant mon écran.

Ce que Tailwind m'a vraiment appris

Tailwind, c'est pas juste un framework CSS. C'est une philosophie de l'immédiat. Celle qui dit : rapproche le style du contenu. Celle qui dit : accepte les contraintes, elles te rendront plus cohérente. Celle qui dit : tu n'as pas besoin de nommer chaque chose pour qu'elle existe.

Parfois, dans la vie, on veut tout ranger dans des cases étiquetées. Tout nommer. Tout classifier. Tailwind m'a appris qu'on peut aussi juste... faire. Écrire dans les marges. Annoter au fil de l'eau. Et que ça peut être beau quand même.

« Le style n'a pas besoin d'un fichier séparé. Il peut vivre là où il agit. »

Et toi, tu préfères séparer ou tout garder ensemble ?

• • •