Toolipedia Intégrer
FR
← Tous les outils texte

Générateur d'animation CSS

Rebond, fondu, secousse, glissement et plus en @keyframes, prêts à copier.

  • Gratuit
  • Sans inscription
  • Fonctionne sur tous les appareils

À propos de Générateur d'animation CSS

Choisissez un effet prêt à l'emploi comme rebond, fondu, secousse, pulsation ou glissement, réglez la durée et le délai, et copiez la règle @keyframes avec la propriété animation. Limitez-vous si possible à transform et opacity, car les navigateurs les animent de façon fluide sans recalculer la mise en page.

Comment utiliser Générateur d'animation CSS

  1. Choisissez un effet comme rebond, fondu, secousse ou glissement.
  2. Réglez la durée et le délai, puis regardez l'aperçu.
  3. Copiez les keyframes et la propriété animation dans votre CSS.

Pourquoi utiliser cet outil ?

Aussi appelé

Questions fréquentes

Comment faire boucler une animation CSS indéfiniment ?

Réglez animation-iteration-count sur infinite, ou utilisez infinite dans la notation abrégée animation. Ajoutez une fonction de temporisation comme ease-in-out pour que la boucle paraisse naturelle.

Comment lancer l'animation une seule fois ?

Réglez le nombre d'itérations à 1 au lieu de infini. Ajoutez fill-mode forwards si vous voulez que l'élément reste dans son état final ensuite.

Comment utiliser l'animation sur mon élément ?

Collez les keyframes dans votre feuille de style, puis ajoutez la propriété animation à la classe de l'élément que vous voulez déplacer.

Générateur d'animation CSS est-il gratuit ?

Oui. Générateur d'animation CSS est gratuit sur Toolipedia, sans inscription et sans filigrane.

Est-ce sûr ?

Oui. Tous les calculs se font dans votre navigateur et rien de ce que vous saisissez n’est envoyé à notre serveur.

Est-ce que ça fonctionne sur mon téléphone ?

Oui. L’outil fonctionne dans tout navigateur récent sur Android et iPhone, ainsi que sur tablette et ordinateur. Il n’y a rien à installer.

Faut-il un compte ?

Non. Ouvrez simplement la page et utilisez l’outil. Aucune inscription ni adresse e-mail n’est nécessaire.

Puis-je mettre Générateur d'animation CSS sur mon propre site ?

Oui. Utilisez le bouton « Intégrer sur votre site » sous l'outil pour copier un court extrait de code et le coller dans votre page. C'est gratuit, sans compte, et l'outil continue de fonctionner dans votre page.

Outils similaires