https://github.com/hugeicons/hugeicons-react Skip to content Navigation Menu Toggle navigation Sign in * Product + Actions Automate any workflow + Packages Host and manage packages + Security Find and fix vulnerabilities + Codespaces Instant dev environments + Copilot Write better code with AI + Code review Manage code changes + Issues Plan and track work + Discussions Collaborate outside of code Explore + All features + Documentation + GitHub Skills + Blog * Solutions For + Enterprise + Teams + Startups + Education By Solution + CI/CD & Automation + DevOps + DevSecOps Resources + Learning Pathways + White papers, Ebooks, Webinars + Customer Stories + Partners * Open Source + GitHub Sponsors Fund open source developers + The ReadME Project GitHub community articles Repositories + Topics + Trending + Collections * Pricing Search or jump to... Search code, repositories, users, issues, pull requests... Search [ ] Clear Search syntax tips Provide feedback We read every piece of feedback, and take your input very seriously. [ ] [ ] Include my email address so I can be contacted Cancel Submit feedback Saved searches Use saved searches to filter your results more quickly Name [ ] Query [ ] To see all available qualifiers, see our documentation. Cancel Create saved search Sign in Sign up You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert {{ message }} hugeicons / hugeicons-react Public * Notifications * Fork 9 * Star 239 * Boost your UI with Hugeicons React Icons. 3,800+ free customizable stroke icons for sleek web development and design projects. An open-source react icon library tailored for React. react-demo.hugeicons.com License MIT license 239 stars 9 forks Branches Tags Activity Star Notifications * Code * Issues 1 * Pull requests 0 * Actions * Projects 0 * Security * Insights Additional navigation options * Code * Issues * Pull requests * Actions * Projects * Security * Insights hugeicons/hugeicons-react This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository. main BranchesTags Go to file Code Folders and files Name Name Last commit Last commit message date Latest commit History 20 Commits .idea .idea example example scripts scripts src src tools tools .gitignore .gitignore .npmignore .npmignore LICENSE.md LICENSE.md README.md README.md package-lock.json package-lock.json package.json package.json rollup.config.mjs rollup.config.mjs tsconfig.json tsconfig.json View all files Repository files navigation * README * MIT license 31c9262e-aeea-4403-9086-3c8b88885cab Free React Icons - Hugeicons Pro Welcome to Hugeicons React Icons, your premier destination for free React icons. Our expansive collection features over 3,800 stroke React icons, available at no charge and crafted to meet a diverse array of design requirements. These icons are perfect for devs and designers seeking top-quality, customizable options for enhancing their digital product. Hugeicons Pro is trusted and utilized by thousands of designers, devs, and content creators for unlimited personal and commercial projects, establishing it as one of the most versatile and user-friendly React icons libraries in the market. a40aa766-1b04-4a2a-a2e6-0ec3c492b96a Table of Contents * Features * Installation * Usage Examples * Live Example * Contributing * FAQ * License General Usage React icons can be downloaded from the HugeIcons website and used in your projects. The react icons are available in SVG format and can be easily integrated into your applications. Features * Extensive Collection: Access over 3600 stroke icons for free, ready to use in your projects. * Scalable Icons: Easily adjust the size of icons to fit your design perfectly. * Color Customization: Apply any color to icons to match your brand or design theme. * Rotation and Animation: Add a dynamic touch with rotation and animation options. Installation To install and start using Hugeicons-React-Icons in your project, install the package via npm: npm install hugeicons-react Or via yarn: yarn add hugeicons-react Usage Examples Import the icons you need from the library and integrate them into your React components. Here's how you can customize the icons to fit your needs: Control Icon Size Adjust the size of your icons by passing a size prop: import { Home01Icon } from "hugeicons-react"; // Custom size Customize Icon Color Change the color of your icons by passing a color prop: import { MarketingIcon } from "hugeicons-react"; // Green color Example Check out our example project to see HugeIcons-React in action and explore more customization options. Live Example Explore a live demonstration of HugeIcons React in action at HugeIcons React Example. This example showcases the versatility and ease of customizing our icons to fit your design needs, providing a hands-on experience with the icon collection. FAQ Q: How can I download and use free React icons from HugeIcons React Icons? A: You can install the package via npm or yarn and then import the react icons into your react components. Detailed package installation instructions are provided in the Installation section. Q: Are these React icons customizable in terms of size and color? A: Yes, all react icons are fully customizable. You can adjust their size, color, and other properties easily within your React application. See Usage Examples for more information. Q: Can I contribute my own designs to the Hugeicons React collection? A: Absolutely! We welcome contributions. Please refer to our Contributing section for guidelines on how to submit your icons. Q: Is there a live demo where I can see these React icons in action? A: Yes, we have a live example available at HugeIcons React Example. It showcases the usage import various react icons and their customization options. Q: Are the react icons from Hugeicons React Icons free for commercial use? A: Yes, our react icons are free for both personal and commercial use, adhering to the MIT License. Please review the license details for more information. Contributing Contributions are welcome! If you'd like to add more icons or improve the Hugeicons React Icons please feel free to submit a pull request or open an issue. License Hugeicons React Icons is licensed under the MIT License. This permits use, modification, distribution, and private or commercial use of the react icons, provided only the icons that the original copyright and permission notice are included in all copies or substantial portions of the software. For more details, see the LICENSE.md file in the repository. Decorative Icons Our decorative react icons improve the visual appeal of any React project, blending seamlessly into both modern and classic design schemas. These react icons are not just decorative elements but are crafted to be functional within your applications, providing an intuitive experience for users interacting with form elements. Why Choose Hugeicons for Your React Projects? * Versatility and Compatibility: Designed as SVG files, our react icons maintain sharpness and clarity at any scale. They are perfect for use in standard modern projects where quality and precision are paramount. * Ease of Use: Implementing these react icons into your project is straightforward with only the icons. With the usage import feature, React developers can integrate SVG icons directly into their components. For instance, using the icon component property allows for rapid customization of icons according to your project's needs. * Integration with Popular Icon Libraries: Our collection includes popular react icons that can be used as replacements for fontawesomeicon icon components, allowing for smoother transitions in projects that are updating their visual elements. Our react icons are designed to be flexible and adaptable, ensuring they can be incorporated into any part of your own code or React projects easily, from enhancing the UI/UX with visually appealing elements to providing functional uses in interactive controls. Semantic Icons Our collection of more icons is designed to convey meaningful information visually and intuitively across your React projects. These icons are crafted to support a standard modern project, ensuring that as your project grows, the svg icons continue to provide significant visual guidance without compromising on aesthetics or functionality. Enhancing Accessibility and Meaning Semantic icons play a crucial role in making applications accessible to users with visual impairments. Each svg icon is designed with clear symbolism that is easy to understand, eliminating any trade-off between style and functionality. These popular icons can be used to indicate actions, entities, or directions, which are essential for devs relying on assistive technologies. Perfect standard modern project for all screen readers. Compatible to Material Design Guidelines Our popular icons are compatible with Material Design guidelines , ensuring a cohesive look and feel across your project. This compatibility helps maintain a consistent design language, which is crucial as your project grows and scales. Customization and Usage Customizing these svg icons is straightforward, thanks to the flexible icon prop. You can adjust the icon name, size, color, and style to suit your project's needs. For example, ability to altering fonts or colors to match your corporate identity is as simple as passing the appropriate parameters through the icon props component's properties. For more info on how to use our svg icons to get the clarity of standard modern project and usability of your React projects easily, refer to our detailed documentation. Each . icon component is meticulously documented to ensure that you can maximize its potential in your applications, rendering them not only as mere decorative elements but usage import as crucial tools for effective communication. How Hugeicons is the Best Font Awesome Alternative Hugeicons Pro offers a robust and versatile alternative to Font Awesome, providing devs and designers with an extensive collection of svg icons tailored for modern applications and websites. With its comprehensive range of popular icons, and features, Hugeicons Pro stands out as the superior choice usage import for those looking to enhance the functionality and aesthetics of their digital projects. Extensive Icon Library Hugeicons Pro includes not only the icons but an entire ecosystem of visual elements designed to suit any application. With thousands of unique svg icons at your disposal, you have the freedom to create exactly what you need for your project's interface--without any compromises on style usage import or recognizability. Enhanced Customization and Flexibility From the code level, you can control various attributes of the svg icons, such as size, color, and even animation states. This method provides a significant advantage in terms of adapting the svg icons to fit the specific needs and branding of your apps as your project grows. Cost-Effective with Dual Licensing Options Offering two options for licensing, Hugeicons Pro provides flexibility whether you're working on personal projects or large-scale commercial applications. This dual approach ensures that you can choose the model that best suits your project's scope and budget. In conclusion, if you're looking for a comprehensive, customizable, and user-friendly react icons component, Hugeicons Pro is an excellent choice than other libraries. Its vast array of icons, combined with powerful customization features and efficient performance component, makes it the ideal tool for devs looking to create, recognize, and implement detailed usage import and functional icons in their digital environments. Adding More Icons Regularly At Hugeicons Pro, we are committed to continuously expanding our svg icon library to keep pace with the evolving needs of modern development. Regular install render updates ensure that our users always have fresh and relevant svg icons at their component fingertips, enhancing the functionality and visual appeal of their website and projects. Continuous Improvement and Expansion Our team is always on the lookout for new ideas and inspirations to expand our svg icon collection. Whether it's a response to user feedback, the latest design component trends, or emerging tech requirements, we ensure that every update brings something valuable to your component development toolkit. This ongoing render process means that every function, from basic commands to complex animations, can be visually represented with our icons on your page. How We Add New Icons Adding new icons to Hugeicons Pro is a detailed process that involves understanding what our devs need to install function effectively in their digital environments. Each svg icon is meticulously designed to be versatile and applicable in various contexts, from desktop app to mobile apps. Here's a look at our process: 1. Idea Generation: We render ideas from user suggestions, market research, and design trends. 2. Design and Development: Our designers create icons that not only look great but are also optimized for performance 3. Testing and Feedback: New icons are rigorously tested and refined based on user feedback. 4. Release: Once finalized, the icons are added to the pack and render made available for download. Ready to install. Stay tuned to our updates and make the most out of our expanding range of img icons to ensure your applications always have the answer to your visual representation needs. About Boost your UI with Hugeicons React Icons. 3,800+ free customizable stroke icons for sleek web development and design projects. An open-source react icon library tailored for React. react-demo.hugeicons.com Topics svg open-source ui-design react-icons vector-icons icon-library icons-pack free-icons design-resources react-icons-component svgicons hugeicons react-icons-free-icons customizable-icons Resources Readme License MIT license Activity Stars 239 stars Watchers 2 watching Forks 9 forks Report repository Contributors 2 * * Languages * JavaScript 65.6% * CSS 14.5% * TypeScript 14.0% * HTML 5.9% Footer (c) 2024 GitHub, Inc. Footer navigation * Terms * Privacy * Security * Status * Docs * Contact * Manage cookies * Do not share my personal information You can't perform that action at this time.