Lucide Animated
Lucide Animated is a free, open-source library of beautifully crafted animated React icons. Built with Motion (Framer Motion) and based on the popular Lucide icon set, it provides smooth, production-ready animated icons for your React applications.What is Lucide Animated?
Lucide Animated transforms the familiar Lucide icons into interactive, animated components that bring your user interface to life. Each icon is carefully animated with hover interactions and supports imperative control for programmatic animations.Key Features
379+ Animated Icons
A comprehensive library of animated icons covering all your UI needs
React + TypeScript
Built with TypeScript for type safety and excellent developer experience
Motion Animations
Powered by Motion (Framer Motion) for smooth, performant animations
Hover Interactions
Interactive animations that respond to user hover events out of the box
Imperative Control
Programmatically control animations with ref-based API for advanced use cases
shadcn/ui Integration
Seamlessly integrate with your shadcn/ui projects using the CLI
Quick Links
Installation
Get started by installing Lucide Animated in your project
Quick Start
Learn the basics with a simple example
Browse Icons
Explore all 379+ available animated icons
Framework Ports
Lucide Animated is also available for other frameworks:- Svelte: movingicons.dev by @jis3r
- Vue: imfenghuang.github.io/icons by @imfenghuang
- Angular: ajitzero/animated-icons by @ajitzero
- Flutter: flutter_lucide_animated by @ravikovind