π¨ A comprehensive collection of 2,870+ animated icons from 15 premium libraries, including 25+ cryptocurrency icons, 12+ beautiful flower icons, 96+ medical healthcare icons in 3 styles, 60+ fun emoji icons, 10+ communication icons, 89+ summer beach icons, 13+ superhero character icons, 40+ weather icons, 45+ AI chat icons, and 27+ 404 error icons
This is a forked and enhanced version of the original flutter_animated_icons package with significant improvements:
- β Updated Dependencies: Latest Flutter SDK and package versions
- β Fixed Asset Paths: All icons now load correctly
- β Enhanced Examples: Comprehensive usage examples for all libraries
- β Modern UI: Beautiful example app with search, filtering, and autoplay
- β Better Documentation: Complete usage guide with code examples
- β Performance Optimized: Improved loading and animation performance
- β Git Integration: Proper version control and commit history
- πͺ NEW: Cryptocurrency Icons: 25+ crypto icons including Bitcoin, Ethereum, Solana, and more
- πΈ NEW: Flower Icons: 12+ beautiful flower and nature icons for botanical and natural themes
- π₯ NEW: Medical Icons: 96+ medical and healthcare icons in 3 styles (Filled, Flat, Outline) for health apps and medical interfaces
- π NEW: Emoji Icons: 60+ fun and expressive emoji icons for social apps, messaging, and fun interfaces
- π NEW: Communication Icons: 10+ communication and messaging icons for email, phone, and notifications
- βοΈ NEW: Summer Icons: 89+ summer and beach themed icons for vacation, travel, and summer apps
- π¦Έ NEW: Superhero Icons: 13+ superhero character icons for gaming, entertainment, and character-based apps
- π€οΈ NEW: Weather Icons: 40+ weather condition icons for weather apps and environmental interfaces
- π€ NEW: AI Chat Icons: 45+ AI chat and chatbot icons for AI applications and conversational interfaces
- π« NEW: B404 Error Icons: 27+ 404 error and maintenance icons for error pages and maintenance screens
Animation always adds life to your icons. This package collects 2,870+ animated icons from 15 premium libraries, including 25+ cryptocurrency icons, 12+ beautiful flower icons, 96+ medical healthcare icons in 3 styles, 60+ fun emoji icons, 10+ communication icons, 89+ summer beach icons, 13+ superhero character icons, 40+ weather icons, 45+ AI chat icons, and 27+ 404 error icons. The animated icons are implemented using Lottie animation, providing smooth, high-quality animations for your Flutter apps.
| Library | Icons | Description | Color |
|---|---|---|---|
| Icons8 | 1,187 | Professional icon library with high-quality animations | π΅ Blue |
| LottieFiles | 756 | Community-driven animations with diverse styles | π’ Green |
| UseAnimations | 80 | Clean and modern micro-interactions | π Orange |
| Lordicon | 154 | Premium animated icons with multiple styles | π£ Purple |
| LottieFlow | 277 | Creative and artistic animations | π¦ Teal |
| Crypto | 25 | Cryptocurrency animated icons (Bitcoin, Ethereum, etc.) | π‘ Gold |
| Flowers | 12+ | Beautiful flower and nature animated icons | πΈ Pink |
| Medical | 96+ | Medical and healthcare animated icons in 3 styles | π₯ Teal |
| Emoji | 60+ | Fun and expressive emoji animated icons | π Yellow |
| Communication | 10+ | Communication and messaging animated icons | π Blue |
| Summer | 89+ | Summer and beach themed animated icons | βοΈ Orange |
| Superhero | 13+ | Superhero character animated icons | π¦Έ Red |
| Weather | 40+ | Weather condition animated icons | π€οΈ Blue |
| AI Chat | 45+ | AI chat and chatbot animated icons | π€ Purple |
| B404 | 27+ | 404 error and maintenance animated icons | π« Red |
Use the new IconsAnimated class to access all icons from a single place:
import 'package:flutter_icons_animated/flutter_icons_animated.dart';
// All icons accessible from one class
Lottie.asset(IconsAnimated.bitcoin) // Crypto
Lottie.asset(IconsAnimated.flower) // Flowers
Lottie.asset(IconsAnimated.filledStethoscope) // Medical
Lottie.asset(IconsAnimated.emoji01) // Emoji
Lottie.asset(IconsAnimated.phoneInTalk) // CommunicationYou can still use the individual library classes:
import 'package:flutter_icons_animated/flutter_icons_animated.dart';
// Individual library access
Lottie.asset(Crypto.bitcoin)
Lottie.asset(Flowers.flower)
Lottie.asset(Medical.filledStethoscope)
Lottie.asset(Emoji.emoji01)A full-featured app with search, filtering, and autoplay functionality:
cd example
flutter runComprehensive examples showing how to use all libraries:
cd example2
flutter rundependencies:
flutter_icons_animated:
git:
url: https://github.com/your-username/flutter_icons_animated.git
lottie: ^3.3.2import 'package:flutter_icons_animated/flutter_animated_icons.dart';
import 'package:lottie/lottie.dart';// Simple usage
Lottie.asset(Icons8.heart_color)
// With animation controller
class MyWidget extends StatefulWidget {
@override
_MyWidgetState createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget>
with TickerProviderStateMixin {
late AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: Duration(seconds: 2),
vsync: this,
);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return IconButton(
onPressed: () {
_controller.reset();
_controller.forward();
},
icon: Lottie.asset(
Icons8.heart_color,
controller: _controller,
width: 50,
height: 50,
),
);
}
}// Basic usage
Lottie.asset(Icons8.heart_color)
Lottie.asset(Icons8.trash)
Lottie.asset(Icons8.settings)
// With controller
Lottie.asset(
Icons8.heart_color,
controller: _controller,
width: 50,
height: 50,
)// Basic usage
Lottie.asset(LottieFiles.$63128_bell_icon)
Lottie.asset(LottieFiles.$33262_icons_bell_notification)
// With repeat animation
Lottie.asset(
LottieFiles.$63128_bell_icon,
controller: _controller,
repeat: true,
)// Basic usage
Lottie.asset(Useanimations.menuV3)
Lottie.asset(Useanimations.activity)
// Different colors
Lottie.asset(Useanimations.menuV3Blue) // Blue version
Lottie.asset(Useanimations.menuV3) // Default version// Basic usage
Lottie.asset(Lordicon.$1_share_outline)
Lottie.asset(Lordicon.$2_heart_solid)
// Different styles
Lottie.asset(Lordicon.$1_share_solid) // Solid version
Lottie.asset(Lordicon.$1_share_outline) // Outline version// Basic usage
Lottie.asset(LottieFlow.lottieflow_404_12_1_000000_easey)
Lottie.asset(LottieFlow.lottieflow_arrow_03_1_000000_easey)
// Background animations
Lottie.asset(LottieFlow.lottieflow_background_13_000000_easey)// Major cryptocurrencies
Lottie.asset(Crypto.bitcoin)
Lottie.asset(Crypto.ethereum)
Lottie.asset(Crypto.solana)
Lottie.asset(Crypto.bnb)
Lottie.asset(Crypto.cardano)
// Stablecoins
Lottie.asset(Crypto.tether)
Lottie.asset(Crypto.usdCoin)
// Meme coins
Lottie.asset(Crypto.shibaInu)
Lottie.asset(Crypto.doge)
// DeFi tokens
Lottie.asset(Crypto.uniswap)
Lottie.asset(Crypto.pancakeswap)
// Gaming/Metaverse
Lottie.asset(Crypto.decentraland)
Lottie.asset(Crypto.sandbox)
Lottie.asset(Crypto.gala)// Beautiful flowers
Lottie.asset(Flowers.flower)
Lottie.asset(Flowers.pinkFlower)
Lottie.asset(Flowers.purpleFlower)
Lottie.asset(Flowers.curveFlower01)
Lottie.asset(Flowers.curveFlower02)
// Flower lines and designs
Lottie.asset(Flowers.flowerLine)
Lottie.asset(Flowers.flowerThinLine)
Lottie.asset(Flowers.curveFlowerLine)
Lottie.asset(Flowers.straightFlowerLine)
// Nature elements
Lottie.asset(Flowers.leaf)
Lottie.asset(Flowers.greenLeaves)
// Frames
Lottie.asset(Flowers.frame)// Filled Medical Icons
Lottie.asset(Medical.filledStethoscope)
Lottie.asset(Medical.filledHospital)
Lottie.asset(Medical.filledBloodTest)
Lottie.asset(Medical.filledThermometer)
Lottie.asset(Medical.filledAmbulance)
// Flat Medical Icons
Lottie.asset(Medical.flatStethoscope)
Lottie.asset(Medical.flatHospital)
Lottie.asset(Medical.flatBloodTest)
Lottie.asset(Medical.flatThermometer)
Lottie.asset(Medical.flatAmbulance)
// Outline Medical Icons
Lottie.asset(Medical.outlineStethoscope)
Lottie.asset(Medical.outlineHospital)
Lottie.asset(Medical.outlineBloodTest)
Lottie.asset(Medical.outlineThermometer)
Lottie.asset(Medical.outlineAmbulance)
// Medical Equipment
Lottie.asset(Medical.filledEcg)
Lottie.asset(Medical.filledXray)
Lottie.asset(Medical.filledUltrasound)
Lottie.asset(Medical.filledHeartRateMonitor)
// Medical Procedures
Lottie.asset(Medical.filledTakingBlood)
Lottie.asset(Medical.filledInfusion)
Lottie.asset(Medical.filledEyeInspection)
Lottie.asset(Medical.filledTeethCheckRoutine)
// Healthcare Facilities
Lottie.asset(Medical.filledHospitalBed)
Lottie.asset(Medical.filledHospitalChair)
Lottie.asset(Medical.filledDoctorBag)
// Medications & Treatment
Lottie.asset(Medical.filledDrugs)
Lottie.asset(Medical.filledMedication)
Lottie.asset(Medical.filledPlasterWound)
Lottie.asset(Medical.filledDoctorWritingPrescription)
// Health Monitoring
Lottie.asset(Medical.filledHealthyHeart)
Lottie.asset(Medical.filledHeartCare)
Lottie.asset(Medical.filledCardioReport)
Lottie.asset(Medical.filledDietList)
// Protection & Safety
Lottie.asset(Medical.filledVirusProtection)
Lottie.asset(Medical.filledCoronaMask)
Lottie.asset(Medical.filledVaccinationCard)// Happy Emojis
Lottie.asset(Emoji.emoji01)
Lottie.asset(Emoji.emoji02)
Lottie.asset(Emoji.emoji03)
Lottie.asset(Emoji.emoji04)
Lottie.asset(Emoji.emoji05)
// Expressive Emojis
Lottie.asset(Emoji.emoji11)
Lottie.asset(Emoji.emoji12)
Lottie.asset(Emoji.emoji13)
Lottie.asset(Emoji.emoji14)
Lottie.asset(Emoji.emoji15)
// Action Emojis
Lottie.asset(Emoji.emoji21)
Lottie.asset(Emoji.emoji22)
Lottie.asset(Emoji.emoji23)
Lottie.asset(Emoji.emoji24)
Lottie.asset(Emoji.emoji25)
// Special Emojis
Lottie.asset(Emoji.emoji31)
Lottie.asset(Emoji.emoji32)
Lottie.asset(Emoji.emoji33)
Lottie.asset(Emoji.emoji34)
Lottie.asset(Emoji.emoji35)
// Fun Emojis
Lottie.asset(Emoji.emoji41)
Lottie.asset(Emoji.emoji42)
Lottie.asset(Emoji.emoji43)
Lottie.asset(Emoji.emoji44)
Lottie.asset(Emoji.emoji45)
// More Emojis
Lottie.asset(Emoji.emoji51)
Lottie.asset(Emoji.emoji52)
Lottie.asset(Emoji.emoji53)
Lottie.asset(Emoji.emoji54)
Lottie.asset(Emoji.emoji55)// Email and messaging
Lottie.asset(IconsAnimated.markEmailRead)
Lottie.asset(IconsAnimated.markEmailUnread)
Lottie.asset(IconsAnimated.outgoingMail)
Lottie.asset(IconsAnimated.moveToInbox)
// Phone and communication
Lottie.asset(IconsAnimated.phoneInTalk)
Lottie.asset(IconsAnimated.permPhoneMsg)
// Notifications
Lottie.asset(IconsAnimated.notifications)
Lottie.asset(IconsAnimated.notificationsActive)
Lottie.asset(IconsAnimated.notificationsOff)
// Search and contacts
Lottie.asset(IconsAnimated.personSearch)// Beach & Water Activities
Lottie.asset(IconsAnimated.beachBall01)
Lottie.asset(IconsAnimated.beachUmbrella01)
Lottie.asset(IconsAnimated.surfBoard01)
Lottie.asset(IconsAnimated.sailBoat)
Lottie.asset(IconsAnimated.pool01)
// Food & Drinks
Lottie.asset(IconsAnimated.iceCream01)
Lottie.asset(IconsAnimated.coctail01)
Lottie.asset(IconsAnimated.watermelon)
Lottie.asset(IconsAnimated.strawberry)
Lottie.asset(IconsAnimated.pineapple)
// Sea Life
Lottie.asset(IconsAnimated.whale)
Lottie.asset(IconsAnimated.crab)
Lottie.asset(IconsAnimated.fish01)
Lottie.asset(IconsAnimated.lobster)
Lottie.asset(IconsAnimated.flamingo)
// Summer Accessories
Lottie.asset(IconsAnimated.sunglasses01)
Lottie.asset(IconsAnimated.hat01)
Lottie.asset(IconsAnimated.fan)
Lottie.asset(IconsAnimated.termometer)
// Weather & Environment
Lottie.asset(IconsAnimated.sun01)
Lottie.asset(IconsAnimated.firePit)
Lottie.asset(IconsAnimated.tree)
// People
Lottie.asset(IconsAnimated.man01)
Lottie.asset(IconsAnimated.woman01)
// Photography & Technology
Lottie.asset(IconsAnimated.camera)
Lottie.asset(IconsAnimated.guitar)
Lottie.asset(IconsAnimated.speaker)// Emotions & Expressions
Lottie.asset(IconsAnimated.angry)
Lottie.asset(IconsAnimated.sad)
Lottie.asset(IconsAnimated.gotIdea)
// Actions & Activities
Lottie.asset(IconsAnimated.pointing)
Lottie.asset(IconsAnimated.wavingHand)
Lottie.asset(IconsAnimated.waiting)
Lottie.asset(IconsAnimated.shopping)
// Transportation
Lottie.asset(IconsAnimated.drivingCar)
Lottie.asset(IconsAnimated.ridingBike)
// Work & Technology
Lottie.asset(IconsAnimated.workingOnLaptop)
Lottie.asset(IconsAnimated.holdingPhone)
// Achievements & Recognition
Lottie.asset(IconsAnimated.holdingTrophy)
Lottie.asset(IconsAnimated.holdingOfferBoard)// Body Parts - Women
Lottie.asset(IconsAnimated.womanAbs)
Lottie.asset(IconsAnimated.womanBiceps)
Lottie.asset(IconsAnimated.womanChest)
Lottie.asset(IconsAnimated.womanFigure)
// Body Parts - Men
Lottie.asset(IconsAnimated.manAbs)
Lottie.asset(IconsAnimated.manBiceps)
Lottie.asset(IconsAnimated.manChest)
Lottie.asset(IconsAnimated.manFigure)
// Equipment & Machines
Lottie.asset(IconsAnimated.weights01)
Lottie.asset(IconsAnimated.weightlifting)
Lottie.asset(IconsAnimated.kettleBells01)
Lottie.asset(IconsAnimated.smithMachine)
Lottie.asset(IconsAnimated.pullUpBar)
Lottie.asset(IconsAnimated.punchingBag)
// Cardio Equipment
Lottie.asset(IconsAnimated.treadmill)
Lottie.asset(IconsAnimated.spinBike)
Lottie.asset(IconsAnimated.skippingRope01)
// Swimming
Lottie.asset(IconsAnimated.swimmingIcon01)
Lottie.asset(IconsAnimated.swimmingIcon02)
// Running & Activities
Lottie.asset(IconsAnimated.runningMan)
Lottie.asset(IconsAnimated.runningWoman)
Lottie.asset(IconsAnimated.runningParkour01)
// Tracking & Monitoring
Lottie.asset(IconsAnimated.stepTracker01)
Lottie.asset(IconsAnimated.sleepTracker01)
Lottie.asset(IconsAnimated.waterTracker01)
Lottie.asset(IconsAnimated.weightTracker)
Lottie.asset(IconsAnimated.repsTracker)
// Timers & Clocks
Lottie.asset(IconsAnimated.timer01)
Lottie.asset(IconsAnimated.smartWatch)
Lottie.asset(IconsAnimated.whistle)
// Nutrition & Hydration
Lottie.asset(IconsAnimated.waterIcon)
Lottie.asset(IconsAnimated.waterBottle)
Lottie.asset(IconsAnimated.supplements)
// Sleep & Recovery
Lottie.asset(IconsAnimated.sleepingIcon01)
Lottie.asset(IconsAnimated.sleepingIcon02)
// Measurements & Progress
Lottie.asset(IconsAnimated.measure01)
Lottie.asset(IconsAnimated.progressIcon)
Lottie.asset(IconsAnimated.weightProgressGraphic)
// Performance & Analytics
Lottie.asset(IconsAnimated.workoutIntensityGraphic01)
Lottie.asset(IconsAnimated.weeklyPerformanceGraphic01)
// Achievements & Recognition
Lottie.asset(IconsAnimated.trophy)
Lottie.asset(IconsAnimated.medal)
Lottie.asset(IconsAnimated.strengthIcon)// Clouds & Sky
Lottie.asset(IconsAnimated.cloudDark)
Lottie.asset(IconsAnimated.cloudLight)
Lottie.asset(IconsAnimated.clouds)
Lottie.asset(IconsAnimated.cloudySun)
Lottie.asset(IconsAnimated.cloudySunWind)
Lottie.asset(IconsAnimated.cloudyFullMoon)
Lottie.asset(IconsAnimated.cloudyHalfMoon)
// Sun & Solar
Lottie.asset(IconsAnimated.sun)
Lottie.asset(IconsAnimated.sunSet)
Lottie.asset(IconsAnimated.sunEclipse)
Lottie.asset(IconsAnimated.sunAndRain)
// Moon & Night
Lottie.asset(IconsAnimated.fullMoon)
Lottie.asset(IconsAnimated.halfMoon)
Lottie.asset(IconsAnimated.fullMoonAndRain)
Lottie.asset(IconsAnimated.fullMoonAndSnow)
Lottie.asset(IconsAnimated.halfMoonAndRain)
Lottie.asset(IconsAnimated.halfMoonAndSnow)
Lottie.asset(IconsAnimated.star)
// Rain & Precipitation
Lottie.asset(IconsAnimated.mildRain)
Lottie.asset(IconsAnimated.heavyRain)
Lottie.asset(IconsAnimated.rainingV1)
Lottie.asset(IconsAnimated.rainingV2)
// Snow & Winter
Lottie.asset(IconsAnimated.snow)
Lottie.asset(IconsAnimated.snowflake)
Lottie.asset(IconsAnimated.snowfallV1)
Lottie.asset(IconsAnimated.snowfallV2)
Lottie.asset(IconsAnimated.hail)
// Storms & Thunder
Lottie.asset(IconsAnimated.thunderV1)
Lottie.asset(IconsAnimated.thunderV2)
Lottie.asset(IconsAnimated.lightning)
Lottie.asset(IconsAnimated.storm)
// Wind & Air
Lottie.asset(IconsAnimated.wind)
Lottie.asset(IconsAnimated.mistV1)
Lottie.asset(IconsAnimated.mistV2)
// Temperature
Lottie.asset(IconsAnimated.hotTemperature)
Lottie.asset(IconsAnimated.coldTemperature)
// Special Weather
Lottie.asset(IconsAnimated.rainbow)
Lottie.asset(IconsAnimated.uvMeter)
Lottie.asset(IconsAnimated.normalWeatherV1)
Lottie.asset(IconsAnimated.normalWeatherV2)// Bing Chat
Lottie.asset(IconsAnimated.bingChatBlueFill01)
Lottie.asset(IconsAnimated.bingChatFillBlue)
Lottie.asset(IconsAnimated.bingChatStrokeBlue)
Lottie.asset(IconsAnimated.bingChatTextToTextLight)
Lottie.asset(IconsAnimated.bingChatTextToImageDark)
// ChatGPT
Lottie.asset(IconsAnimated.chatGPTFillGreen)
Lottie.asset(IconsAnimated.chatGPTGreenFill01)
Lottie.asset(IconsAnimated.chatGPTGreenStroke)
Lottie.asset(IconsAnimated.chatGPTTextToTextLight)
Lottie.asset(IconsAnimated.chatGPTTextToImageDark)
// Chat Bubbles
Lottie.asset(IconsAnimated.chatBubbleDots)
Lottie.asset(IconsAnimated.chatBubbleEllipsesDots)
Lottie.asset(IconsAnimated.chatBubbleTextLine)
Lottie.asset(IconsAnimated.chatBubbleWaveform)
Lottie.asset(IconsAnimated.chatBubbleEllipsesWaveform)
// Search & Loading
Lottie.asset(IconsAnimated.loadingPoints)
Lottie.asset(IconsAnimated.searchTextLight)
Lottie.asset(IconsAnimated.searchWaveformDark)
Lottie.asset(IconsAnimated.waveform)// Business Characters 404 Errors
Lottie.asset(IconsAnimated.businessCharacters404Error01)
Lottie.asset(IconsAnimated.businessCharacters404Error05)
Lottie.asset(IconsAnimated.businessCharacters404Error10)
Lottie.asset(IconsAnimated.businessCharacters404Error15)
Lottie.asset(IconsAnimated.businessCharacters404Error17)
// Error & Maintenance Scenarios
Lottie.asset(IconsAnimated.error404Maintenance)
Lottie.asset(IconsAnimated.errorBinocular)
Lottie.asset(IconsAnimated.errorFalling)
Lottie.asset(IconsAnimated.errorLostInSpace)
Lottie.asset(IconsAnimated.errorServerIsometric)
Lottie.asset(IconsAnimated.errorShipwreck)
Lottie.asset(IconsAnimated.errorStreetMaintenance)
Lottie.asset(IconsAnimated.errorUFO)class AnimatedIconWidget extends StatefulWidget {
final String iconPath;
const AnimatedIconWidget({Key? key, required this.iconPath}) : super(key: key);
@override
_AnimatedIconWidgetState createState() => _AnimatedIconWidgetState();
}
class _AnimatedIconWidgetState extends State<AnimatedIconWidget>
with TickerProviderStateMixin {
late AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: Duration(milliseconds: 1500),
vsync: this,
);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
if (_controller.isAnimating) {
_controller.stop();
} else {
_controller.repeat();
}
},
child: Lottie.asset(
widget.iconPath,
controller: _controller,
width: 60,
height: 60,
fit: BoxFit.contain,
errorBuilder: (context, error, stackTrace) {
return Icon(Icons.error_outline, color: Colors.grey);
},
),
);
}
}Lottie.asset(
Icons8.heart_color,
controller: _controller,
errorBuilder: (context, error, stackTrace) {
return Icon(Icons.error_outline, color: Colors.grey);
},
)- Always dispose AnimationControllers in the dispose() method
- Use Lottie.asset() for better performance than Lottie.network()
- Provide errorBuilder to handle loading failures gracefully
- Use appropriate sizes based on your UI design
- Consider animation duration for better user experience
- Test on different devices to ensure smooth performance
- Make sure you've added the package dependency correctly
- Check that the asset paths are correct
- Verify that the Lottie package is included
- Ensure you have an AnimationController
- Check that the controller is properly initialized
- Make sure to call controller.forward() or controller.repeat()
- Use Lottie.asset() instead of Lottie.network()
- Dispose AnimationControllers properly
- Consider using smaller icon sizes for better performance
This project is licensed under the MIT License - see the LICENSE file for details.
Contributions are welcome! Please feel free to submit a Pull Request.
If you find this package useful, please give it a star! β