--- title: Most Icons Are Static. These 200+ Are Not | daily.dev description: AnimateIcons is a React library offering 200+ animated SVG icons designed for UI micro-interactions. It integrates with shadcn/ui via CLI, adds icons directly... canonical: https://daily.dev/posts/most-icons-are-static-these-200-are-not-l37bsh7cd twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Most Icons Are Static. These 200+ Are Not | daily.dev og:description: AnimateIcons is a React library offering 200+ animated SVG icons designed for UI micro-interactions. It integrates with shadcn/ui via CLI, adds icons directly... og:url: https://daily.dev/posts/most-icons-are-static-these-200-are-not-l37bsh7cd og:image: https://api.daily.dev/og/posts/l37bSH7cd.png og:image:alt: Most Icons Are Static. These 200+ Are Not og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Most Icons Are Static. These 200+ Are Not **[Avijit Dey](https://daily.dev/sources/ullwwn37zsilljprgbshi)** · [@avijit07x](https://daily.dev/avijit07x) · 1 min read · 80 upvotes · 22 comments ## Summary AnimateIcons is a React library offering 200+ animated SVG icons designed for UI micro-interactions. It integrates with shadcn/ui via CLI, adds icons directly to your codebase without runtime dependencies, and supports hover-based, controlled, and programmatic animations. The library focuses on purposeful motion for modern interfaces rather than decorative effects. ## Content Most icon libraries stop at static SVGs. But modern interfaces rely on motion to communicate intent and feedback. **AnimateIcons** is a React animated icon library with 200+ icons, designed for real-world UI interactions, not decorative motion. What makes it different: * 200+ animated SVG icons built for modern React apps * Works seamlessly with **shadcn/ui via shadcn CLI** * Icons are added directly to your codebase, no external runtime dependency * Hover-based, controlled, and programmatic animations * Clean SVG structure with subtle, purposeful motion The goal was simple: Make micro-interactions easier to implement without compromising performance or developer experience. Still evolving and actively maintained. Feedback from frontend developers is welcome. Demo: [https://animateicons.in](https://animateicons.in) Repo: [https://github.com/Avijit07x/animateicons](https://github.com/Avijit07x/animateicons) ## Community discussion Top comments from developers on daily.dev. **@h3yng** · 5 upvotes > icons are really cool......... and very low friction to use. love them <3 > love the simplicity of code implementation too. **@amitgajare** · 3 upvotes > Really cool animation **@sunyfilip** · 2 upvotes > Do you know something similar for vue.js or vanilla? **@davorhrg** · 1 upvotes > I see no animation when clicking or moseover. even when oepened in v0 **@hdnelson2024** · 1 upvotes > Excelente aporte colega muy buenos esos iconos, gracias. --- Tags: [#webdev](https://daily.dev/tags/webdev), [#react](https://daily.dev/tags/react), [#ui-design](https://daily.dev/tags/ui-design), [#svg](https://daily.dev/tags/svg) [View this post on daily.dev](https://daily.dev/posts/most-icons-are-static-these-200-are-not-l37bsh7cd) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"DiscussionForumPosting","mainEntityOfPage":"https://daily.dev/posts/most-icons-are-static-these-200-are-not-l37bsh7cd","headline":"Most Icons Are Static. These 200+ Are Not","text":"AnimateIcons is a React library offering 200+ animated SVG icons designed for UI micro-interactions. It integrates with shadcn/ui via CLI, adds icons directly to your codebase without runtime dependencies, and supports hover-based, controlled, and programmatic animations. The library focuses on purposeful motion for modern interfaces rather than decorative effects.","url":"https://daily.dev/posts/most-icons-are-static-these-200-are-not-l37bsh7cd","datePublished":"2026-01-04T17:32:21.495Z","dateModified":"2026-01-11T14:22:40.484Z","author":{"@type":"Person","name":"Avijit Dey","url":"https://daily.dev/avijit07x","image":"https://media.daily.dev/image/upload/s--zvM20pRl--/f_auto/v1769233995/avatars/avatar_uLLwwN37zSiLLjpRGbshI?_a=BAMAMiiu0","description":"Web Dev Enthusiast | React | Next.js | Python | Freelancer","interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"EndorseAction"},"userInteractionCount":3770}},"image":"https://media.daily.dev/image/upload/s--9aFvFuL7--/f_auto/v1768141359/posts/l37bSH7cd?_a=BAMAMiZW0","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":80},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":22}],"comment":[{"@type":"Comment","text":"icons are really cool… and very low friction to use. love them <3\nlove the simplicity of code implementation too.","datePublished":"2026-01-04T17:42:03.435Z","url":"https://daily.dev/posts/l37bSH7cd#c-HWvOtHgzL","author":{"@type":"Person","name":"heyng","url":"https://daily.dev/h3yng","image":"https://avatars.githubusercontent.com/u/135978438?v=4"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":5}},{"@type":"Comment","text":"Really cool animation","datePublished":"2026-01-10T15:31:57.855Z","url":"https://daily.dev/posts/l37bSH7cd#c-yI189omza","author":{"@type":"Person","name":"Amit Gajare","url":"https://daily.dev/amitgajare","image":"https://media.daily.dev/image/upload/s--7lr6XGRA--/f_auto/v1735367756/avatars/avatar_UU1stgGJldM9pQP0QluF0"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":3}},{"@type":"Comment","text":"Do you know something similar for vue.js or vanilla?","datePublished":"2026-01-05T07:40:22.028Z","url":"https://daily.dev/posts/l37bSH7cd#c-caeXGMAI3","author":{"@type":"Person","name":"Filip Januš","url":"https://daily.dev/sunyfilip","image":"https://lh3.googleusercontent.com/a/ACg8ocKAWfw1FGaQxjvEehprxNkdfgzHfwQJJW4g6qXZ0C9fkTpaZwQ=s96-c"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":2}},{"@type":"Comment","text":"I see no animation when clicking or moseover. even when oepened in v0","datePublished":"2026-01-05T07:32:19.938Z","url":"https://daily.dev/posts/l37bSH7cd#c-RU9vZnPNg","author":{"@type":"Person","name":"Davor Hrg","url":"https://daily.dev/davorhrg","image":"https://avatars.githubusercontent.com/u/2480762?v=4"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1}},{"@type":"Comment","text":"Excelente aporte colega muy buenos esos iconos, gracias.","datePublished":"2026-01-05T14:53:18.068Z","url":"https://daily.dev/posts/l37bSH7cd#c-SHrRZuBgC","author":{"@type":"Person","name":"Nelson Herrera Diaz","url":"https://daily.dev/hdnelson2024","image":"https://lh3.googleusercontent.com/a/ACg8ocKBbRj88TYlOaJ4kRFbdoL0_hVu8B7CsygaLZTYDOGF4ONVmw=s96-c"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1}}],"isPartOf":{"@type":"WebPage","url":"https://daily.dev/sources/ullwwn37zsilljprgbshi","name":"Avijit Dey"}} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Avijit Dey","item":"https://daily.dev/sources/ullwwn37zsilljprgbshi"},{"@type":"ListItem","position":3,"name":"Most Icons Are Static. These 200+ Are Not"}]} ```