Skip to content
Index730 resources
Hugeicons Animated

Hugeicons Animated

165 hand-animated Hugeicons installed as React source via the shadcn CLI

Tier B · UsefulIcon SetRegistryhugeicons-animated.com

(Visit hugeicons-animated.com ↗)(Docs)(Repository)(Registry)
Preview image from hugeicons-animated.com

Hugeicons Animated is a free MIT collection of hand-animated icons built by Enes Gules on top of Hugeicons' core-free-icons set. Each icon is a React component that uses `motion` and a shared `use-icon-animation` hook, forwards a ref exposing startAnimation/stopAnimation, and takes a `size` prop, so you can trigger the animation on hover, on focus, or imperatively. There is no npm package: `npx shadcn add @hugeicons-animated/<name>` copies the .tsx plus lib/use-icon-animation.ts into your own repo, so you own and can edit the source. The public registry currently lists 165 icons covering navigation, files, media, comms, weather, commerce and user management.

Install
npx shadcn add @hugeicons-animated/notification-03

For an agent

Fetch https://hugeicons-animated.com/r/registry.json first and match against the real slugs — they carry Hugeicons' numeric suffixes (notification-03, arrow-down-02, share-08, sun-03), so a guessed name like 'notification' will 404. Each icon pulls in `motion` and writes lib/use-icon-animation.ts, so install one icon before batching a dozen to make sure that shared lib lands only once, and remember these are DOM-wrapped (each renders a div with HTMLAttributes) rather than bare SVGs — they will not drop into a slot expecting an <svg>. Use it for a handful of accent icons in menus and empty states; keep a static set like lucide for the other 200 icons in the app rather than animating everything.

Why it is here. Animated icons are usually either a paid Lottie pack or a hand-rolled one-off; this gives you a coherent, MIT, shadcn-native set drawn from a well-known icon family, with the animation source in your own repo.

Install command, framework, licence and component list.

Facts

License
MIT
Pricing
Free, Open source
Framework
React, Next.js
Styling
Tailwind CSS
Distribution
shadcn registry, CLI installer, Copy-paste snippet, GitHub repository
Platform
Web
Content type
Icons, Code
Agent readiness
Machine-readable registry item, CLI installable, Copy-paste ready code, Readable open source
Accessibility
Unknown
Maturity
Actively maintained
Pricing detail
Free (JSON-LD on the site declares price 0 USD and an MIT licence).
GitHub stars
90

Components it ships

165 total
IconIcon Button

Notable for

  • 165 icons in the public registry
  • shadcn CLI install, no npm dependency or lock-in
  • imperative startAnimation/stopAnimation handle per icon
  • built on motion and Hugeicons core-free-icons
  • site copy still advertises 85 icons

Provenance

Verified 2026-08-15. HTTP 200. https://hugeicons-animated.com/ (raw HTML + WebFetch), https://hugeicons-animated.com/r/registry.json (165 items parsed), https://hugeicons-animated.com/r/notification-03.json, https://github.com/enesgules/hugeicons-animated via gh api

Also in Icons & Logos

6
hugeicons-animated.comTier B