Animate & Transition

Definition

Classes animate-* pour les animations predefinies (spin, ping, pulse, bounce) et transition-* pour les transitions CSS avec duree et easing configurables.

Analogie

animate c'est une choregraphie complete, transition c'est juste un fondu entre deux poses.

Exemple de code

<div class="animate-spin h-8 w-8 border-4
  border-blue-500 rounded-full border-t-transparent">
</div>
<button class="transition-all duration-300 ease-in-out
  hover:scale-105 hover:shadow-lg">Bouton</button>

Cas d'usage

Ajouter du mouvement subtil aux interactions utilisateur (loading spinners, hover effects).

Termes lies