Terrain de jeu Tailwind
Testez et prévisualisez les classes Tailwind CSS en temps réel.
Paramètres
Configurez le type d'élément et le contenu
Exemples de préréglages
Appliquez rapidement les combinaisons de styles couramment utilisées
Button
Card
Badge
Alert
Input
Aperçu
Voir le résultat stylisé en temps réel
Bonjour, Tailwind !
HTML généré
Code HTML généré avec les paramètres actuels
<div className="bg-blue-500 text-white p-4 rounded-lg shadow-md hover:bg-blue-600 transition-colors">Bonjour, Tailwind !</div>
💡 Conseils d'utilisation
Classes courantes :
- •
hover:- Styles d'état de survol - •
focus:- Styles d'état de focus - •
active:- Styles d'état actif - •
transition-colors- Effets de transition de couleur
Classes réactives :
- •
sm:- 640px et plus - •
md:- 768px et plus - •
lg:- 1024px et plus - •
xl:- 1280px et plus