Animations

Each icon has several animations, with at least 3 animations by default:

• path: an animation of the pathLength from 0 to 1
• path-loop: pathLength animation from 1 to 0 to 1
• default: the default animation, customized for each icon

animation

<ArrowRight animation="pointing" />

// or with AnimateIcon
<AnimateIcon animation="pointing">
  <ArrowRight />
</AnimateIcon>

You can set the animation on the wrapper and customize it for an icon:

<AnimateIcon animation="pointing">
  <ArrowRight />
  <ArrowLeft animation="default" />
</AnimateIcon>

or you can set it for each icon individually:

<AnimateIcon>
  <ArrowRight animation="pointing" />
  <ArrowLeft animation="default" />
</AnimateIcon>

API Reference