Font Awesome Pro V5.10.2 (Web Desktop) Duotone Icons
Juliana Ellerbe
There is certainly no shortage of icon sets and there are many different styles of icons floating around the internet today. Just a quick Google search will reveal hundreds of icon sets, many of which are 100% free and open source.
This isn't an exhaustive list with 50 free icon sets for you to pull apart. We've intentionally kept this list as short as possible and have only included the absolute highest-quality free icon sets so you don't have to waste your time.
High-quality icons can add style and visual interest to your designs. More importantly, when used correctly, good icon design can speed up user interactions by making actions immediately recognizable.
Sidebar navigation menus in UI design are the perfect example of this. Often, these are packed full of menu items and can be overwhelming for the user. Icons provide designs with quick and easy visual cues and make the menu list easier to scan.
No matter what free icon set, icon font, or premium icons you choose, remember that icons should be functional first and visually interesting second. Too many designers fall into this trap and choose interesting icon sets at the sake of usability.
When starting a new web design project, choosing high-quality icons from the start will save you a lot of headaches and wasted time down the track. It can be a tough decision, especially because there are simply so many out there, with new icons popping up every month.
Look for icon sets that include SVG format or Figma files so you can export them to SVG or PNG formats. If you're more familiar with Adobe software, look for AI or EPS formats. Avoid free icon sets that only come with PNG formats.
Many paid and premium icon sets come with "free" versions, but these usually lack key essential icons so you end up purchasing the icon set later on. While this is fine, just make sure you're aware of this before you commit!
This is especially important for large design projects. As you scale, inconsistent or poor-quality icon sets will only build design debt. Eventually, you (or another designer) will have to go back and tidy these up or replace the icon set with professional icons that work well together. This can take months and is wasted time and money.
While these mail icons in the example above would work just fine as part of a consistent icon set, mixing and matching different styles made by different icon designers for different purposes will always look inconsistent and unprofessional.
At best, this makes your designs look bad. At worst, this lack of care and professional polish can lead to mistrust of your product by your users. A consistent and free minimal icon pack with 250 icons will always be a better choice than an inconsistent icon pack with 10,000+ icons.
This 100% free icon set includes a whopping 1,100+ essential icons for modern UI design, neatly organized across 19 categories. There are also additional duotone and duocolor styles available at untitledui.com/icons if you're after something a little bit different.
Feather Icons aren't the biggest free icon set on this list, but they'll always be one of our favorites. This free minimal icon pack was crafted by Cole Bemis and features 287 simply beautiful open source icons.
Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency, and readability. If you're looking for a lightweight and scalable icon library that will work in almost any project, Feather Icons are a great option! It's one of the most popular icon sets in the world for a reason.
We love this icon set for a few reasons. Firstly, they're super minimal and consistent which means they'll work well across any type of web design or UI design project. Secondly, they're clearly crafted with care by a professional and are easy to customize right in Figma!
If you need even more in the future, they also have an expanded icon pack for sale with 6,950+ vector icons across 52 categories. It looks great and is made with Figma based on 24px grid system with 2px stroke width.
It consists of 230 beautifully crafted and minimal MIT Licensed icons. Similar to Feather Icons, this icon set is not going to be the biggest on this list, but we love it because it's neutral and will suit pretty much any project.
Heroicons are also unique in that it includes 2 separate styles, depending on your use case. The outline icons are created with 2px stroke weight and are designed to be rendered at 24x24px. For smaller use cases such as buttons and form elements, this icon set also includes solid icons which are designed to be rendered at 20x20px.
The new library features 292 icons that have been completely redrawn from scratch in a new style. Similarly to Heroicons 1.0, this icon set includes 2 separate styles, depending on your use case. The default outline icons are designed to be rendered at 24x24px and include a new matching solid style. For smaller use cases such as buttons and form elements, the icon set also includes a smaller mini style designed to be rendered at 20x20px.
Just like Heroicons 1.0, this set is beautifully crafted and Steve has again generously made the icon set 100% free with an MIT license. As we mentioned earlier, this new Heroicons set isn't a big library, but it is incredibly high quality and deserves to be as popular as it is.
Iconoir is a great open source icon set crafted by Product Designer, Lucia Burgio. It comes packed full with 1,500+ icons in SVG format, as well as icon libraries for React, React Native, Figma, and Framer.
We're big fans of these icons for their paired-back and super minimal style. They're ideal for modern user interface design. So much so that Framer intergrated them into their design software in June 2021!
Iconizer offers a collection of 1,050+ icons across 4 different styles for free. What sets Iconizer apart is they is they allow users to easily customize icons directly from their site. You can change icon size, stroke weights, colors, and copy or export SVGs without leaving your browser.
Check out the free icon set and preview every single SVG icon on their website. They're clean, consistent, and great for UI design. If you find these icons useful, you can create a free account to bookmark icons. If you really find these icons useful, Iconizer also offer a paid version of the library which includes 6,400+ icons across 4 different styles.
Radix icons have been generously open sourced under the MIT License. You can copy SVGs directly from their website, or download all 333 icons as SVGs, as well as for Figma, Sketch, IconJar. The WorkOS team have also included an npm install for super quick install in development projects.
Lucid Icons are a beautiful and consistent icon library that are a fork of the popular library, Feather Icons. Just like Feather, Lucide is a 100% open source project that welcomes contributions from the community.
Streamline Core Line Icons are a huge icon set that are open source under the Creative Commons License. This is a huge free library consisting of 1,000 vector icons. We love this style because it's clean, consistent, and clearly crafted by professionals. Streamline have been creating icon sets since 2010 and know what they're doing.
Tabler Icons are a solid icon set crafted by Web Developer, Paweł Kuna. They're another great example of a simple and well-made icon set that is flexible and large enough to use in just about any project.
Flowbite Icons are designed by Evelyne Krall & Robert Tanislav and interface coded by Zoltn Szőgynyi. They're designed to be specifically compatible with Flowbite's own libraries and Tailwind CSS with React (JSX) and Figma support.
There are two main outlined and filled styles. We love them because they're super clean and minimal. However, it's important to note that these icons have been converted to outlines. This means that you won't be able to customize stroke weight or corners etc.
Atlas icons is a free and open-source library, licensed under MIT. They're created by the team behind Vectopus are available in variable stroke SVG format, web font, React, Vue and Flutter ready to use packages.
You can download the entire library as a .zip file from their website. This includes individual SVG exported into category files, as well as icon font files. MingCute do have a Figma file available on Figma Community, but it appears it isn't kept up-to-date with new releases to the icon library.
Tetrisly Icons are a free icon set crafted by the team behind Tetrisly. This icon pack is unique because the Tetrisly team opted for 20px as the default icon size, where most icon sets choose 24px or 16px.
This icon set is 100% free for personal and commercial use under the Creative Commons License. You can free download the icon set via their Gumroad page (link above), which includes SVG format, Figma, and Sketch files.
Doodle Icons comes with 400+ handcrafted icons and is 100% free to use for commercial and personal projects under the Creative Commons License. What makes this icon set stand out from every other library on this list is its unique hand-drawn style. While it might not be suitable for every project, it's a great way to differentiate designs and add a splash of personality to more creative and fun projects.
As we mentioned, this isn't an exhaustive list. We've carefully curated what we believe to be the best free icon sets available today. Many "best free icon sets" lists like these simply add in as many icon sets as possible to appease Google, but we found the majority of these were low quality or outdated.
You may have noticed our list also didn't include some of the most popular free icon sets in the world such as Material Icons and Bootstrap. Here are some notable mentions that we didn't include in our list:
We haven't included Material Design Icons in this list for subjective reasons. In our opinion, Material Icons are starting to look a little dated for modern UI design. Perhaps it's their distinctive sharp edges or the fact that we've seen them everywhere for years now. It's an awesome resource but didn't make our list for this reason.
b37509886e