Animation Generator

Create CSS animations and keyframes with visual editor

Configuration

Animation Type

Duration: 1s

Timing Function

Delay: 0s

Iteration Count

Preview

Generated CSS

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

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