DEV Community

Cover image for Revamp Your Icon Game: The Best Open-Source Icon Libraries of 2023 πŸš€
Aniket
Aniket

Posted on

Revamp Your Icon Game: The Best Open-Source Icon Libraries of 2023 πŸš€

Are you looking for the best open-source icon libraries to enhance your design projects in 2023? Look no further!

Icons play a vital role in modern web design, helping to guide users and enhance the overall look and feel of a website or application. In this post, we'll explore the top best open-source icon libraries for 2023.

These libraries offer a wide variety of high-quality icons that can be used in your projects for free, with or without any licensing restrictions. Whether you're a designer, developer, or just looking for some fresh icon inspiration, our list has got you covered.


Note: If there is anything else that should be added, feel free to mention it in the comments below πŸ‘‡


Font Awesome

Font-Awesome-icon

Font Awesome is one of the most popular icon libraries out there. It's easy to use, customizable, and works with a variety of frameworks and tools. Plus, it's updated regularly with new icons and features. According to Google, As of 2020, Font Awesome was used by 38% of sites that use third-party font scripts, placing Font Awesome in second place after Google Fonts

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • License: Freemium πŸ˜‹
  • 2nd placed after google fonts πŸ‘“
  • 71k+ ⭐ on Github

Material Symbols

Material Design Icons or material symbols is a comprehensive icon library with over 2,500 glyphs designed according to Google's Material Design guidelines. The icons are well-organized and easy to browse, and the library is regularly updated with new icons and features. Symbols are available in three styles and four adjustable variable font styles (fill, weight, grade, and optical size)

Material-Design-Icons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Supported by Google πŸ‘“
  • Falls under Apache 2.0 license πŸ’³
  • 47k+ ⭐ on Github

Boxicons

High-Quality web friendly icons

'Boxicons' is a carefully designed open-source icon set with 1500+ icons. It's crafted to look enrich your website/app experience.

Boxicons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • Available as Web component πŸ“
  • Falls under MIT license πŸ’³
  • 2.2k+ ⭐ on Github

Feather Icons

Feather is a collection of simply beautiful open source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency, and flexibility.

FeatherIcons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • Provides feather icons for other frameworks πŸ“
  • Falls under MIT license πŸ’³
  • 23.2k+ ⭐ on Github

Ionicons

Ionicons is a completely open-source icon set with 1,300 icons crafted for web, iOS, Android, and desktop apps. Ionicons was built for Ionic Framework, so icons have both Material Design and iOS versions.

Ionicons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as CDN πŸ“Ά
  • Provides feather icons for other frameworks πŸ“
  • Falls under MIT license πŸ’³
  • 16.7k+ ⭐ on Github

Bootstrap Icons

A free, high-quality, open-source icon library with over 1,800 icons. Include them any way you likeβ€”SVGs, SVG sprites, or web fonts. Use them with or without Bootstrap in any project.

BootstrapIcons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • Supported by a huge bootstrap framework community πŸ‘“
  • 6.6k+ ⭐ on Github

Remixicons

Remix Icon is a set of open-source neutral-style system symbols elaborately crafted for designers and developers. All of the icons are free for both personal and commercial use.

Remixicons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • Remix Icon is licensed under the Apache License Version 2.0 πŸ’³
  • 5.2k+ ⭐ on Github

heroicons

Beautiful hand-crafted SVG icons, by the makers of Tailwind CSS.
Available as basic SVG icons and via first-party React and Vue libraries.

heroicons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • Remix Icon is licensed under the MIT πŸ’³
  • 18k+ ⭐ on Github

CSS Icons

700+ Pure CSS icons library, Customizable & Retina-Ready built 100% in pure CSS, SVG, SVG Sprite, styled-components, Figma, and Adobe XD. Easy integration: Embed, NPM & API.

cssicons

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM, yarn package πŸ“¦
  • Available as CDN πŸ“Ά
  • Remix Icon is licensed under the MIT πŸ’³
  • Present in design tools such as Figma & Adobe XD ⚑
  • 9k+ ⭐ on Github

Flaticon

"Free access to 9.5M+ icons in PNG"

The largest database of vector icons available for download in SVG, EPS, PSD, and BASE 64 formats.

Flaticon

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available in different formats πŸ‘“
  • Subscription-based πŸ’°

Iconfinder

Iconfinder is the world's largest marketplace for icons, illustrations and 3D illustrations in SVG, AI, and PNG format

Iconfinder

Features

  • Opensource ( Free to use ) πŸ₯³
  • 7,250,000+ free and premium vector icons, illustrations & 3D illustrations
  • Subscription-based πŸ’°

Roundicons

45,000+ icons The world’s biggest icon bundle Commercial use icon packs library made for apps, websites, infographics & prints.

Roundicons

Features

  • Free vector icons πŸ₯³
  • 45,000+ icons πŸ‘“
  • Subscription for premium icon packs πŸ’°

Icons8

They are the best ones out there, download design elements for free such as icons, photos, vector illustrations, and music for your videos. All the assets made by designers β†’ consistent quality ⚑️

Icons8

Features

  • 1.28m+ free icons πŸ‘“
  • Subscription for premium icon packs πŸ’°

Iconscout

"Access 5.8 Million+ free or premium vector icons, illustrations, 3D illustrations, and Lottie animations for any design. Available in PNG, SVG, GIF, EPS, JSON, and more.

Iconscout

Features

  • 5.8m+ icons πŸ‘“
  • The cluster of Design assets πŸ“¦

Line icons

5700+ Handcrafted line icons for modern user interfaces of the web, mobile, and desktop app design and development projects. Line icons is a huge and comprehensive pack of professionally designed icons, available in all vector formats that are easy to use on the web, design, coding, and beyond.

Line icons

Features

  • 5700+ icons πŸ‘“
  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • Subscription for premium icon packs πŸ’°
  • Multiple Style variations ⚑
  • Icon Editor πŸ‘¨β€πŸ”§

Futicons

Futicons are Figma designer icons for Virtual Reality, Augmented Reality, Interplanetary Travel, Artificial Intelligence, Crypto, Blockchain, Cyborgs, Future Transportation, and Sustainability.

Futicons

Features

  • Free lineicons ⚑
  • $5 for the full version includes 250 icons with fill & outline πŸ’°

Devicon

Devicon is a set of icons representing programming languages, designing, and development tools. You can use it as a font or directly copy/paste the SVG code into your project.

Devicon

Features

  • Opensource ( Free to use ) πŸ₯³
  • Available as NPM package πŸ“¦
  • Available as CDN πŸ“Ά
  • 7.1k+ ⭐ on Github

Iconmonstr

Discover 4,784+ free icons in 316 collections for your next project.

Iconmonstr

Features

  • free for any commercial use ⭐
  • Unique and uniform icons from an exclusive source πŸ₯³
  • Available in every release as fill and outline version πŸ₯³
  • Smart compressed and best optimized for web use πŸ₯³
  • Clean and precise icon design on a 24-pixel grid πŸ₯³
  • Embed SVG as inline or Base64 within seconds πŸ₯³
  • Best place to store your favorite icons πŸ₯³

Icofont

2100+ free icons to spice up your creative designs

Icofont

Features

  • Opensource ( Free to use ) πŸ₯³
  • 30 Categories πŸ“¦
  • For Web & Desktop πŸ“Ά
  • Amazing Icons πŸ’°
  • 100% Free Download πŸ‘“

Streamline

Access the world's largest and most consistent icon and illustration sets Customise 140,000+ vector graphics, and add them to your projects in seconds ⚑️

Streamline

Features

  • Opensource ( Free to use ) πŸ₯³
  • Desktop app πŸ“¦
  • Figma Plugin ⭐
  • Images for notion πŸ“Ά
  • Freemium πŸ’°

Jam icons

Jam icons are a set of SVG icons designed for web projects, illustrations, and print projects.

Jam icons

Features

  • Opensource ( Free to use ) πŸ₯³
  • 491 ⭐ on Github

Smashicons

Smashicons is the world's largest and most complete icon set with over 492,219 icons for designers and developers.

Smashicons

Features

  • Free to use πŸ₯³
  • Registration is required to download icons ⭐
  • Paid Plan starts at $2 πŸ’°

Freepik

All the assets you need, in one place, Find and download the best high-quality photos, designs, and mockups.

Freepik

Features

  • Free to use πŸ₯³
  • Free license ⭐
  • Attribution is required πŸ‘“
  • Paid Plan starts at $4.43 πŸ’°

Futuramo

Futuramo offers a suite of work management tools for teams working on digital projects. Foster collaboration between teams, clients, and businesses

Futuramo

Features

  • Advanced icon library πŸ₯³
  • full-featured customization app ⭐
  • Ultimate styling tool πŸ’°
  • Multiple file formats πŸ“¦
  • Free pack of 340 customizable icons πŸ‘“
  • Icons Pro pack to unlock more than 3100 icons in 16 styles πŸ’°

GraphicBurger

Tasty design resources are made with care for each pixel. Free for both personal & commercial use. Have a bite!

GraphicBurger

Features

  • Tones of assets to roam around πŸ₯³
  • Mockups πŸ‘“
  • UI kits πŸ’°
  • Icons ❀️

Nucleo icons

The ultimate icon library Buy once, get unlimited updates. Cover 99% of your icon needs.

Nucleo icons

Features

  • Beautifully crafted over 32k+ iconsπŸ₯³
  • 6 Grid sizesπŸ‘“
  • 3 styles include fill, outline, and color πŸ”₯
  • 3231 unique symbols organized into 40 categories πŸ“¦

Pixeden

Pixeden is hard at work providing quality premium and free web resources and graphic design templates.

Pixeden

Features

  • Vectors, graphics, mockups πŸ₯³
  • Icons, textures πŸ‘“
  • Website templates πŸ”₯
  • $6/month to access all the premium files πŸ’°

Pixellove

Download over 15,000 icons in 6 distinctive styles made for professionals.

Pixellove

Features

  • VersatileπŸ₯³
  • Uniform πŸ‘“
  • Scalable πŸ”₯
  • ios & android support πŸ’°

Vecteezy

Vecteezy is a leading global creative marketplace offering millions of paid and free stock photos, vectors, and stock videos for personal & commercial use.

Vecteezy

Features

  • Unlimited photo, vector, and 4k video downloads πŸ₯³
  • Full commercial rights πŸ‘“
  • Vecteezy online editor access πŸ”₯
  • Exclusive access to bundles πŸ”₯πŸ”₯
  • No attribution required πŸ”₯πŸ”₯πŸ”₯
  • Priority support πŸ”₯πŸ”₯πŸ”₯πŸ”₯
  • Faster downloads & no ads πŸ”₯πŸ”₯πŸ”₯πŸ”₯πŸ”₯
  • Paid plan starts at $4.50 for a year & $7 monthly πŸ’°

Conclusion

Icons are an essential part of modern web design, and with so many high-quality open-source icon libraries available, it's easier than ever to find the perfect icons for your projects. These open-source icon libraries we've explored in this post offer a wide range of styles, sizes, and formats, making them suitable for use in a variety of applications.

From the comprehensive Font Awesome and Material Design Icons to the minimalist Feather and heroicons, there's an open-source icon library out there to suit every need. Whether you're a designer, developer, or just looking for some fresh inspiration, these libraries are an excellent resource to add to your toolbox.

So why not try incorporating some of these open-source icon libraries into your next project and see how they can enhance the overall user experience? With so many great options out there, the possibilities are endless!

Thanks For Watching ❀️

Happy Coding !!!

Top comments (7)

Collapse
 
amyliumaiyi profile image
Amy Liu

Very nice resource. +1.

Collapse
 
ananiket profile image
Aniket

Thank you for your feedback!

Collapse
 
pcjmfranken profile image
Peter Franken

You'll definitely want to check out this super convenient combined icon pack browser that I recently came across called IcΓ΄nes: icones.js.org (github.com/antfu/icones)

Collapse
 
ananiket profile image
Aniket

Thank you sir πŸ™Œ for sharing your recommendation of the IcΓ΄nes icon pack browser. It's great to hear that you find it super convenient.

Collapse
 
fruntend profile image
fruntend

Π‘ongratulations πŸ₯³! Your article hit the top posts for the week - dev.to/fruntend/top-10-posts-for-f...
Keep it up πŸ‘

Collapse
 
bigfree profile image
Adam MikΓ³

Tabler icons πŸ™‚

Collapse
 
ananiket profile image
Aniket

Thank you for your reference @bigfree πŸ‘“

Some comments may only be visible to logged-in visitors. Sign in to view all comments. Some comments have been hidden by the post's author - find out more