Icon Animator

Pick an icon

Twenty Feather-style essentials, or bring your own SVG.

Refine

Tune the motion, the look, and the timing until it feels right.

Copy the code

Grab the CSS or React snippet and drop it into your project.

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

.icon {
  color: #111111;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform-origin: 50% 50%;
  animation: ia-bounce 1.2s ease-in-out infinite;
}