DevToolBoxGRATUIT
Blog

Convertisseur CSS vers Tailwind

Convertissez CSS en classes utilitaires Tailwind CSS en ligne. Mappe les propriétés CSS courantes aux classes Tailwind. Outil de migration gratuit.

À propos de la conversion CSS vers Tailwind

Tailwind CSS est un framework CSS utility-first qui utilise des classes prédéfinies au lieu de CSS personnalisé. Cet outil automatise la conversion des propriétés CSS courantes incluant display, position, flexbox, grid, espacement, typographie, couleurs et bordures.

𝕏 Twitterin LinkedIn

Notez cet outil

4.3 / 5 · 229 avis

Restez informé

Recevez des astuces dev et les nouveaux outils chaque semaine.

Pas de spam. Désabonnez-vous à tout moment.

Enjoy these free tools?

Buy Me a Coffee

Comment utiliser

  1. Collez votre code CSS (avec ou sans sélecteurs)
  2. Cliquez sur Convertir pour générer les classes Tailwind
  3. Vérifiez les classes converties et les propriétés non converties
  4. Copiez les classes Tailwind dans vos éléments HTML

Cas d'utilisation courants

  • Migrer des projets CSS existants vers Tailwind CSS
  • Convertir le CSS des outils de design en classes Tailwind
  • Apprendre les équivalents Tailwind des propriétés CSS
  • Scaffolder rapidement des layouts Tailwind à partir de maquettes CSS

Questions fréquentes

Tout le CSS peut-il être converti en Tailwind ?
Pas tout le CSS a un équivalent Tailwind direct. L'outil convertit les propriétés courantes. Le CSS complexe est marqué comme 'non converti'.
Comment gère-t-il les couleurs personnalisées ?
Les couleurs personnalisées sont converties avec la syntaxe de valeurs arbitraires de Tailwind : color: #ff5733 → text-[#ff5733].
Supporte-t-il les breakpoints responsifs ?
L'outil convertit les propriétés CSS dans chaque règle. Les classes responsives (sm:, md:, lg:) doivent être ajoutées manuellement.
Peut-on coller du CSS avec des sélecteurs ?
Oui. L'outil analyse les règles CSS avec sélecteurs et affiche les classes Tailwind pour chaque sélecteur.