When it comes to modern UI design and web design, a good quality icon set is invaluable and can make or break a design.
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.
The problem is not all icon sets are created equal. When we were building Untitled UI v1.0 we looked at dozens and dozens of open source, free, and paid icon sets. We even explored custom icon packs. Some were good, but we found the vast majority of icon sets lacked in quality, were inconsistent, or simply too small — usually a combination of all three. Surprisingly, we found that many of the best icon sets were 100% free!
Choosing a good quality icon set can be just as time-consuming as creating your own custom icons. We’ve done an extensive search for the highest-quality free icon sets for UI design and compiled them here for you in one place.
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.
What is an icon?
In UI design and web design, icons are small graphical representations of a functionality or concept. They provide users with quick and recognizable visual cues that are easy to understand.
For example, lock icons indicate something is locked. Tick icons indicate that an action has been completed or saved. Trash icons mean delete or remove. Icons are so ubiquitous in modern UI and apps that we don’t often don’t even have to think.
Consider these icons below. You should immediately recognize what they represent:
- House icons for the home page
- Three horizontal line icons to indicate a hamburger menu
- Magnifying glass icons for search
- Pencil icons to edit or modify content
- Heart or thumbs-up icons to like something
- Heart or star icons to favorite something
- Bookmark icons to save a bookmark
- Arrow coming out of the top of a square icons to share something
- Arrow pointing down into a square or cloud icons to download something
- Gear or cog icons for settings
- Lock icons to show something is secure
- Arrow pointing into a cloud or out of a box icons to upload something
- “X” icons to close or exit out of something
- Funnel icons to sort or filter content
- Link icons to add a link to something
- Arrow pointing out of a box icons to log out of something
These are what we like to call universal icons or default icons. They’re everywhere, and it’s pretty clear to the user what they mean. Boring? Maybe. But they work.
When it comes to choosing an icon pack or designing custom icons, don’t try and reinvent the wheel. These universal and default icons are familiar to users already and changing them up so they’re unrecognizable just introduces a new challenge unnecessarily.
This doesn’t mean you can’t make your icons a little more visually interesting. As long as you don’t stray too far from the universally recognized symbol, it’s usually 100% fine. Here are the same examples using Untitled UI Icons in a duotone style:
Icons are important for UX
Icons are a crucial part of web design and UI design but are often overlooked. They’re especially important in information-dense UI design, such as dashboards or complex SaaS products.
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.
When you use a website or UI on any device, your eyes scan the content for the action(s) that you want to take. Some good examples of this are the home screen of your favorite app or a list of options in a menu. You’re not going to read every single word on the page, but you want to find what you’re looking for quickly.
This is where icons come in. Good icon design provides small visual cues for the user, helping you find what you’re looking for quickly and efficiently. As part of a consistent icon set, users quickly learn to associate certain icons with certain actions over time.
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.
While they don’t seem like much, icons in UI design make the process of navigating this menu and finding what the user needs significantly easier, reducing the cognitive load and making this navigation easier to remember over time.
At the end of the day, icons should be easy to understand
Icons are everywhere in the physical world as well. Road signs are a great example of clear and functional iconography. They're basically big icon sets. While they differ in style slightly around the world, they’re easy to understand and universally recognizable, even at a glance.
Imagine how chaotic and stressful driving would be if road signs and their icons were inconsistent and hard to understand and interpret? Or if new icons were being introduced all the time? Drivers should be able to drive past signage without needing to slow down or divert their attention to understand what they mean. In the words of Steve Krug, “don’t make me think”.
The same goes for icons in UI design and websites. While the consequences aren’t life-threatening like road signs, poor iconography and low-quality icon packs create a frustrating experience for the user by slowing them down and making them think.
The main objective of icons in your design are not only to look beautiful but to be easy to understand. There’s no reason they can’t be both, but icon design should be functional first and foremost.
Sure, weird and wonderful icons and custom icon packs might look more interesting, but if users don’t understand what they mean in a quarter of a second, your ego is impacting the overall user experience and they’ll get frustrated.
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.
Stick to icons and icon sets that people recognize wherever possible, especially for common user interaction or tasks like the examples above.
How to choose an icon set for your project
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.
Thankfully, there are a few key things you can look out for. A good free icon set should check these boxes:
The icon set should be large enough to suit your project
Look for icon sets with a wide range of icons that will cover your needs. You won't need 10,000+ icons but aim for at least 250+ essential icons that you'll almost certainly need.
Otherwise, you’ll find yourself painstakingly creating custom icons down the track. This can be incredibly time-consuming, but also leads to inconsistencies.
The icon set should be consistent and professionally crafted
Good quality icon sets are consistent, optically balanced relative to each other, and just “look good”. They should be clear enough to work in dark themes and across all devices.
It can be hard to spot if you’re new to design, but inconsistent and unbalanced icons are very easy to spot.
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.
The icon set should suit your brand
This can be subjective, but icon sets can vary drastically in style and how they “feel”. Often, premium or paid icon packs are a distinctive style to differentiate them from other icon sets.
Many icon sets come with several different styles. In general, rounded icons tend to feel more fun and playful, while tight and minimal icon sets can feel more modern.
Choosing an icon set that is consistent with your brand will ensure they don’t look out of place. If in doubt, opt for a neutral and clean icon set that will work well with anything.
You probably don't need premium icons or a custom icon set
Don't fall into the trap of spending money on premium icons upfront — often, some of the best icon packs for your project are 100% free to use and most premium icon sets come with a free version to try first.
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!
The same goes for typefaces — there are many high-quality free fonts that suit almost any project in modern UI design. We explored this idea in our post on the best free fonts for modern UI design.
It's better to pick an icon set from the start — don’t wing it
Choosing a good icon set from the start means you won’t be picking and choosing icons from different icon sets as you go. This can be an absolute nightmare because as your icon set grows, it will become more and more inconsistent and messy, even to the untrained eye.
Nothing stands out more in modern UI design than inconsistent icons.
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.
These are examples of the mail icon from different icon sets around the internet. As you can see, they all have a very different style.
Most of these icons look okay on their own, but next to different styles they look out of place. Some look a little dated, but it can be hard to tell why and without context... Usually, it’s a combination of many micro-decisions that were made by the icon's designer — style, stroke weight, size, aspect ratios, fill — all of which factor into the overall look and feel of the individual icons and the icon set as a whole.
High-quality icons are effective, but also look good
Quality and consistent icons can make a website design or app more visually attractive. There's no reason why icons can't be functional and also aesthetically pleasing.
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.
You don’t realize the power of a high-quality icon set until you start using one. A good free icon set saves you time and money usually spent on meticulously creating icons one-by-one, or even worse, constantly fixing existing icons so they're more consistent and optically balanced.
You can avoid most of these issues and pitfalls by choosing a high-quality icon set from the start. This will save you time, headaches, and expensive design+tech debt down the track.
The great news is that many of them are 100% free! Here are our top picks for the best free icon sets for modern UI design:
1. Untitled UI Icons
untitledui.com/icons – 1,100+ free essential icons for modern UI design
Untitled UI Icons are a clean, consistent, and neutral icon library crafted specifically for modern UI design. Made for Figma, in Figma.
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.
Untitled UI Icons launched in early June 2022. It was voted Product Hunt #1 Product of the Week and was downloaded 20,000+ times in the first 2 weeks. It's now the #1 highest-rated icon set on Gumroad and was retweeted 1,300x on Twitter.
What makes Untitled UI Icons different?
This free icon set was crafted specifically for Untitled UI — the largest Figma UI kit and design system in the world and the #1 design and tech product on Gumroad.
We searched everywhere for the "ultimate" icon set for modern UI design to use across all our projects... We couldn't find a free icon set we loved so we made one that ticked all the right boxes.
- Made for Figma, in Figma. 100% compatible with Figma's latest 2022 component properties and override features. Say goodbye to Illustrator.
- Crafted specifically for modern UI design. Clean, consistent, and professionally crafted icons. Purposefully not overly stylized and neutral enough for any project or device.
- 1,100+ and counting. Packed full with 1,100+ free vector icons with creative commons license. Everything you need to design modern and beautiful UI and websites. Such a wide range means no more custom icons!
- Neatly organized. The entire icon set is neatly organized alphabetically across 19 categories. Spend less time searching icon packs and more time designing.
- Smooth corners by default. Untitled UI Icons use beautiful and naturally continuously 60% variable curves on all corners. They stress these tiny details because once you see it, you can't unsee it.
- 2px stroke weight default. 2px stroke weight by default for visually-balanced icons across sizes. Change stroke weight in Figma with just a few clicks.
- Optimized SVG output. No unnecessary layers or shapes. SVG outputs are optimized for minimal file size, no unnecessary attributes, and infinite scalability.
- Use in unlimited projects. In fact, we designed the icon set this way — to be as neutral, flexible, and scalable as possible to use as a single "ultimate" library for any project. You can use it in as many personal and commercial projects as you like!
- Lifetime updates. No subscriptions or "upgrades". Get lifetime updates forever. We're always making improvements to Untitled UI products.
Download 1,100+ free essential icons at untitledui.com/icons
2. Feather Icons
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.
You can download the entire library in SVG format as a .zip from their site.
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 3,200+ vector icons across 48 categories. It looks great and is made with Figma based on 24px grid system with 2px stroke width.
4. Unicons by IconScout
Unicons is a fantastic icon set by the IconScout team. While the huge 4,500+ Unicons icon set is a paid icon set, they've generously released the 1,100+ line icon library for free.
Their free line icon set consists of 1,100+ icons carefully crafted on 24px grid with 1px stroke. This free icon set is huge and we particularly love how well-organized it is into 27 categories.
You can download the icon set as SVGs as well as a web font/icon font via their website.
Heroicons is an incredibly popular and open source icon library crafted by Steve Shoger, one of the creators of Tailwind CSS.
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.
This kind of attention to detail is what sets Heroicons apart from the hundreds of much larger icon sets that didn't make this list.
You can download the icon set as SVGs via their website or duplicate the official Figma Community file.
Iconoir is a great open source icon set crafted by Product Designer, Lucia Burgio. It comes packed full with 1,100+ 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!
The Iconoir icon set is 100% free and open source and you can preview every single SVG icon on their website. If you find it useful, you can support the creator on Open Collective.
7. css.gg Icons
You can check out the icon set at. If you find these useful in your projects, consider donating to the creator here!
8. Phosphor Icons
Phosphor Icons are a free icon set crafted by Helena Zhang and Tobias Fried. It's a clean, consistent, and huge library of 1,047 icons across 6 different styles — thin, light, regular, bold, fill, and duotone.
9. Streamline Core Line Icons – Free
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.
You can download this icon set via They also have a popular Figma plugin available on Figma Community so you can search for icons without leaving Figma.
This free icon pack is part of Streamline's larger Core Line Icons – Pro icon set — their complete collection of icons for UI design, with 2,025 vector icons across 14 categories. They offer a subscription from $19/month or you can buy the single icon set outright for $89. It's important to note that you don't get future updates if you purchase outright!
10. Tabler Icons
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.
The entire icon pack is open source and free to use in designs without attribution. You can even preview how the icons look at different sizes and stroke weights via their website.
Tabler Icons are a free and open source icon set, but you can support the creator by donating on GitHub.
Ionicons are an open source and MIT licensed icon set built by the team behind Ionic Framework. This icon set consists of 700+ free icons across 3 styles — outline, filled, and sharp. They also include useful social media icons!
You can download the entire library in SVG format as a .zip from.
The Ionic team has also released a useful Figma plugin so you can search for Ionicons right from inside Figma.
12. Remix Icon
Remix Icon is a set of 2,271 neutral icons across 2 styles — line and solid.
This free icon pack is maintained by Remix Design — duo Jimmy Cheung and Wendy Gao. They've generously made this icon library open source, which means the icon pack is 100% free to use for both personal and commercial use. If you find it useful, please consider contributing to the project via the Donate link on their website!
Free download this icon pack via their website as a single .zip containing SVG files, as an icon font, or even as an NPM install.
13. Eva Icons
Crafted by Akveo and the team behind Eva Design Assets, Eva Icons is a set of 480 beautifully crafted open-source icons in SVG and PNG formats. They've also included both a Figma and Sketch library.
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.
14. Tetrisly Icons
Tetrisly Icons are a free icon set crafted by the team behind Tetrisly. This icon pack is unique because it includes 3 different sizes (16px, 20px or 24px), depending on your needs.
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.
15. Doodle Icons
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.
You can download the entire library as SVGs, PNGs, as well as a Figma library via t.
We left some notable names off this list
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:
Material Icons Library is a free icon set by Google for the Material Design system. This icon set is 100% open source under the Apache License Version 2.0.
Material Design icon sets are available in five different themes — filled, outlined, rounded, two-tone, and sharp — and are one of the most popular icon sets in the world. Google has also recently released an official Material Symbols Figma plugin.
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.
The Noun Project
You read that right! The Noun Project is a collection of more than 3 million icons. You'll find anything you can think of here — app icons, website icons, social media icons, and even illustrations. Launched in 2011, this site is updated daily with icons created by thousands of designers and developers around the world.
While this is an incredible resource, we haven't included it in this list of free icon sets for two main reasons:
- To use icons from The Noun Project, you're required to add a link back to The Noun Project if you do not have a paid membership. For this reason, we don't regard The Noun Project as a free library as the free version explicitly requires attribution.
- Any icon set at this scale will inevitably lead to inconsistencies. Thousands of creators from 130+ countries contribute to this project, which means many slightly different styles. You don't need 3 million icons — for modern design, particularly UI design, we suggest opting for smaller, carefully-crafted icon sets that are consistent and optically balanced relative to each other.
Bootstrap Icons are one of the most popular open source icon sets in the world. With 1,600+ icons in line and fill styles, Bootstrap Icons are designed specifically for Bootstrap’s components and documentation.
Similar to Material Icons, we have omitted this icon set from our list for subjective reasons. It's a fantastic resource for designers and developers who use Bootstrap, but we believe they're starting to look a little dated. Many of their core icons have striking inconsistencies in stroke weight and optical balance. For this reason, we haven't included it in this list.
Font Awesome Icons
Font Awesome Icons are one of the oldest and most popular icon sets in the world, used by millions of designers, developers, and content creators. Originally developed in 2012, it was designed for Bootstrap but evolved into its own icon set.
You've probably heard of Font Awesome before, and if you haven't, you've definitely seen these icons on the web. As of 2020, Font Awesome was used by 38% of sites that use third-party font scripts.
Their free library includes a huge 2,009 free vector icons across multiple styles. They also have a paid premium plan that includes 16,000+ icons with faster loading and technical support.
Despite Font Awesome's incredible size, you likely won't need such a huge icon set for projects. If you've used Font Awesome before and it works for you, that's great! If not, we recommend checking out some of the newer and more modern icon sets in this list.
Missing a free icon set?
There are dozens of new icon sets being released every month. We've reviewed hundreds of these icon sets to pick out the highest-quality examples and regularly update this post if we find one that makes the cut.
If you're releasing a free icon set and would like to include to be included on this list, let us know! We'd love to check it out.