lucide-animated

Overview

lucide-animated is an MIT-licensed collection of animated Lucide icons for React, created by Dmytro (pqoqubbw). The site lists more than 350 icons, from arrows and alarm clocks to accessibility and airplane glyphs, each with a short motion that plays on hover. It is part of the Vercel Open Source Program and has over 8,000 stars on GitHub.

Each icon is a standalone React component animated with Motion and installed through the shadcn CLI, so the source lands in the project and can be edited. The project has inspired community ports for Svelte, Vue, Angular and Flutter, and other animated icon sets such as heroicons-animated and icons-animated are based on it.

Features

• 350+ animated icons: Lucide icons with hand-tuned hover animations
• shadcn registry: Each icon installs as one editable component through the shadcn CLI
• Built with Motion: Animations use Motion for React
• Search: A command-style search (Cmd+F) across the full set
• Copy or install: Copy source from the site, or install with pnpm, npm, yarn or bun
• Community ports: Separate Svelte, Vue, Angular and Flutter versions maintained by other authors
• MIT licensed: Free for personal and commercial projects

Tech stack

• React, Motion
• Lucide
• shadcn CLI registry

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @lucide-animated/icon-name