CSS Animasjonsgenerator

@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-30px); }
}

.animated-element {
  animation: bounce 1s ease 0s infinite normal none;
}

Gratis CSS-animasjonsgenerator

Lag CSS-animasjoner med sanntidsforhåndsvisning og kodeeksport.

Tips

• Bruk ease-in-out for myke animasjoner
• Hold animasjoner under 300ms
• Bruk transform og opacity for ytelse
• forwards beholder slutttilstanden
• Bruk animation-delay for å spre

FAQ

Relaterte verktoy