Hey devs 👋,
Tired of boring static icons? AnimateIcons is here!
A sleek React library that transforms SVGs into smooth, purposeful animations — lightweight, customizable, and built with motion/react.
✨ Features:
<ul>
<li>45+ animated icons</li>
<li>Works with React &amp; Next.js</li>
<li>Easy control (hover or programmatic)</li>
<li>ShadCN CLI integration</li>
</ul>
👉 Check it out: <a href="https://animateicons.vercel.app/" target="_blank" rel="noopener nofollow">https://animateicons.vercel.app/</a>
Make your UI pop ✨ — because icons shouldn’t just sit there, they should move with purpose!

A dedicated squad for devtools: discussions, recommendations and questions. 

Dev Tools

AnimateIcons is a React library that transforms static SVG icons into smooth animations. It offers 45+ animated icons, works with React and Next.js, supports hover and programmatic control, and integrates with ShadCN CLI. The library aims to enhance user interfaces by adding purposeful motion to icons.

Static is boring — animate your icons 🎯

Really? Too much of anything can be too much. IMHO Less is more.

These look great, I think it would be good if you could update them so that they can be triggered either onmouseenter like they are now OR on load OR “on enter screen” for more flexibility. Some of the animations are quite long so triggering them onmouseenter might get a bit annoying in the real world but “on enter screen” wouldn’t.

animated icons sound like a delightful idea

This looks really nice! But most people probably won’t be using this many animated icons, as some are not really necessary. But if they are used correctly, then it can make the website look really clean and nice!

Nice collection! Also going to plus this library, since its over 4k icons:
<a href="https://animatedicons.co/" target="_blank" rel="noopener nofollow">https://animatedicons.co/</a>