AnimateIcons CLI

A simple, interactive command-line tool to fetch animated React icon components from animateicons.vercel.app and add them directly to your project!

✨ Features

• Instantly download animated React icon components using a single command.
• Automatically creates components/ui/icons/ directory structure if it doesn't exist.
• Puts downloaded icon components exactly where you need them for fast UI development.
• User prompts for overwrite if file already exists (safe by default).
• Works with both JavaScript and TypeScript React projects.

🚀 Quick Start

1. Use via NPX (Recommended)

No need to install globally—simply run:

npx animate-icons "https://animateicons.vercel.app/public/icons/iconname.json"

Replace iconname.json with the actual icon JSON URL from the AnimateIcons website.

2. How It Works

• The CLI fetches the specified JSON file containing your desired React icon component.
• It reads the icon's component code from the JSON.
• The file is placed in components/ui/icons/ as IconName.jsx (or .tsx).
• If the folder doesn't exist, it is created automatically.

📝 Example

Suppose you want to add the "Loader" icon:

npx animate-icons "https://animateicons.vercel.app/public/icons/Loader.json"

• Result: The CLI fetches the loader icon’s code and saves it as components/ui/icons/Loader.jsx in your current project directory.

💡 Pro Tips

• Ensure you run the CLI from your project root for the correct relative path.
• You can script multiple icons with bash, npm scripts, or CI pipelines if needed.
• Generated components follow the AnimateIcons code style for easy maintainability.

📚 More Info

• Browse icons and get live JSON links at: 👉 animateicons.vercel.app

🛠️ Contributing

Found an issue or want to contribute features? Check issues or open a pull request on GitHub.

📄 License

MIT

Made with ❤️ for the React community by Avijit Dey.