Animations

Animation Loop

Utilities for sets the animation control with limited loop or infinite.

Variant

Active Checked Child-Selection Dark Mode Disabled Expand First-Last-Selection First-Letter Focus Focus-Visible Focus-Within Fullscreen Group-Focus Group-Hover Hover Landscape Light Mode Portrait Reduce-Motion Responsive Selection-Hover Visited

API

class	css
loop-2	animation-iteration-count: 2
loop-3	animation-iteration-count: 3
loop-4	animation-iteration-count: 4
loop-5	animation-iteration-count: 5
loop-infinite	animation-iteration-count: infinite

Usage

<div class="morph blur-in loop-infinite">
  ...
</div>

HTML

.dummy {
  @extend
    .morph,
    .blur-in,
    .loop-infinite;
}

SCSS