Animation Iteration

Set animation iteration count

Syntax

visual="animation-iteration:[value]"

Values

Value	CSS Output	Description
1	animation-iteration-count: 1	Once
infinite	animation-iteration-count: infinite	Forever

Examples

<div visual="animate:bounce animation-iteration:1">Bounce once</div>

Preview

Animation Iteration

visual="animation-iteration:infinite" - Control number of loops

once

infinite

View Code

<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div space="p:small" visual="bg:primary text:white rounded:small animate:bounce animation-iteration:1">once</div>
  <div space="p:small" visual="bg:primary text:white rounded:small animate:bounce animation-iteration:infinite">infinite</div>
</div>