The animation-direction CSS property is used to define whether an animation should play forwards, backwards or in alternate cycles.

.element {
  animation-direction: alternate;

The animation-direction property accepts the following values:

Value Description
normal The animation plays forwards. This is the default value.
reverse The animation plays backwards.
alternate The animation plays forwards, then backwards.
alternate-reverse The animation plays backwards, then forwards.

Related posts