When creating a website or app design, specific icon sets will make or break your UI UX design. This is why we have created a list of the best free icon packs in Figma.
The user interface is about finding the right way to share a message while ensuring the viewer sees and understands it. Figma icons play a big part in this, making the design more personal while creating a familiar user environment. It makes sense why we want to introduce icon sets into our UI design.
So, as UI designers, we need to pay great attention when choosing the right icon packs to deliver the message we want. We also know how hard it is to find the right icon sets – this is why we at uinkits created so many. Our uinkits UI icons include multiple icon sets that are easily customizable and carefully designed with variables that can reused across your design when changing design properties and prototyping specific actions. And good news – our starter icon pack is free!
We have decided to create a list of the best free Figma icon sets that you can use in your UI UX design. From minimalist icons to animated icons and even social media icons, you will find various icon packs across multiple styles. So, read on to find the right icon set for you!
What is an Icon?
An icon is a graphic representation of a specific task. Icons are small symbols representing actions, information, or other elements within a user interface. They are visual assets that stand as a way to help users instantly understand what concepts they convey.
Think about the little home icon in the sidebar navigation menu. In this day and age, every user knows that the icon represents the home menu. Or the magnifying glass icon that represents the search. Or even the bookmark icon – which stands for a saved bookmark or item.
These icon sets – together with the x, the pencil, the arrow coming out of the top of a square, or the arrow pointing down to a cloud or a square, the lock icon, the link icon, and a few more – are called default icons or universal icons. So yes, that’s why they are everywhere.
Think about these design icons:
User icon for Account Pages
Person icon for Collaboration tools
Photos icon for media pages
Heart to like something
Bookmark icon to save something
Image icon for uploading a photo
Down arrow to illustrate an accordion
“X” icon to close a page
Account icon for Login screens
Home icon for navbars or navigation rail
Hamburger menu icon for website navigation
Lock icon for secure connections
Icons Are Necessary In Design
Icons are essential elements of a user interface and take part in building its visual language. They are simple, easy to recognize, and take the form of the object or action they represent. Images or symbols are perceived much faster than text, so UI icons have the ability to replace words and increase the user experience of a product.
Icons can change the whole look of your design, so we need to choose them wisely when implementing them in our designs. So, to help you, we developed a complete collection of icon sets that will guide you through the process.
When To Use
Use icons when representing navigation items – home, settings, menu, etc.
Use icons when representing action items – save, delete, share, etc.
Use icons when representing object items – documents, files, folders, etc.
Use icons when representing status indicators – notifications, battery level, etc.
Use icons to highlight something specific – an announcement or error message.
Use icons to align with the text to provide information.
How To Use Icons
Simple Is Better
Avoid complex UI icons, which will increase visual noise and cognitive load – especially on smaller screens.
When picking which icon to introduce in the UI design, prioritize the functionality and purpose rather than how nice it looks. While aesthetics are essential, icons should primarily serve a functional role in user understanding and interaction within the interface.
The purpose of icons in user interface designs is to help the user understand the meaning of the respective action. Rather than choosing icons that might make the design look more modern, stick to what people already know.
Many designers might opt for cool icons to make the UI design look better. But if your users can’t comprehend their meaning immediately, it will negatively impact the overall user experience. Using simple icons will increase clarity and legibility. The focus should be on helping users understand the concept it represents – not confuse them.
Use Universal Icons
Use universally recognizable icons whenever possible. Try to use symbols that visually represent the idea in the most basic way – instead of metaphorically. If an action can’t be represented in the literal sense, pick one that has a logical connection to the concept. For example, a profession like a musician can be conveyed through a microphone icon.
With such icons, users can quickly understand an icon's purpose or function without looking at text explanations. This way, they provide a more intuitive and user-friendly interface.
Be Consistent
Maintain visual consistency in the use of icons throughout the user interface. Make sure to be uniform in the visual style, size, and placement of icons to create an intuitive and easily recognizable design language. This way, it helps users build familiarity both with the design and the icons, increasing the user experience.
Don’t use icons as a replacement for text!
Yes, icons are great when it comes to making the user understand immediately what the respective action is without needing to read the text next to it. For this reason, these visual symbols can be considered extremely useful tools for replacing texts – especially in information-rich user interfaces or in compact GUI screens.
It’s important to remember that icons complement the text, not replace it. So, we should not replace text with icons everywhere. This is especially true when it comes to the navigation menu on a website where the user might not be familiar with its content.
However, there are situations where icons can be used independently without confusing the user or damaging the user experience. Certain icons, like the “hamburger” menu, the magnifying glass for search, or the home icon, have become universally recognized symbols. In these cases, using the icons alone can save space and improve navigation efficiency.
Should you use icons alone when the space is limited?
If you’re designing the user interface for a mobile screen or generally smaller screens, the space is automatically smaller as well. You might be able to use universal icons in your design without the text. But this is not always the case.
One way to make sure that you have enough space to integrate both the text and the icon without cluttering the design is to implement a dual-tier navigation system. Whether it is a sidebar or a drawer that opens itself on hover, it consumes minimal space yet allows you to offer immediate clarity regarding the functions that these icons represent.
Choose a Figma Icon Library
When designing a project, having an icon library can help you do wonders. Not only does it help you finish your project faster, but it also helps you have a consistent and aesthetically pleasing design. However, when selecting the right icon sets, it should align with your design needs, style, and your brand. And unfortunately, sometimes it can be a challenging decision.
That’s why great icon sets should:
Have a large range of icons to fulfill the needs of your project. Without this, you might have to look for the icons you need in other libraries, causing inconsistencies throughout the design. Or even worse, you might find yourself having to create custom icons later on, which can be time-consuming and could cause you a lot of stress.
The icons within the library should be consistent, ensuring that they are optimized and professionally crafted. Although this may be subtle to the untrained eye – both as a beginner designer and as a user – inconsistencies stand out immediately.
It should be compatible with your brand’s identity. Selecting an icon library that harmonizes with your brand ensures that the icons don’t appear out of place. For example, rounded icons often convey a sense of fun and playfulness, whereas minimalistic icons can have a modern aesthetic. Choose the one that is suitable for our needs.
Our uinkits Figma Icon Sets include over 4,200 cool icons you can use in modern designs. We have created a library of all the icons you need to create the perfect UI design in Figma – in five styles: line, solid, duo color, duotone, and thin. Our free uinkits Figma Icons library includes over 420 icons, and you can use our free icon sets in as many UI designs as you want.
4,200+ Icons in 5 Styles: We have over 4,200 Figma icons, beautifully created in 5 different styles to choose from – line, solid, duo color, duotone, and thin. You can also customize them in any way you want for your UI UX design.
Created With Variables: Carefully designed with variables that can be reused across your design when changing design properties and prototyping certain actions.
For Figma: Our uinkits icon packs are made exclusively for Figma and are crafted to meet the highest quality standards for your Figma designs.
Extensive Variety: Access a complete Figma icon library with a wide range of categories that will fit any project or industry, including icons for apps, dashboard icons, and other aesthetic icons that are fit for every UI UX design.
Customizable: Our Figma icons are easily customizable, allowing you to adjust colors, sizes, and styles to align with your brand or project's specific needs. Whether you need a people icon, a user icon, iPhone icons, or other free Figma icons, we’ve got you covered!
Organized: We know finding the right icons is sometimes hard. This is why we created so many! Now, you can find icons organized in 16 categories from almost every domain – all with one click away!
Smooth Corners: Our uinkits icons use 100% variable curves by default on all corners.
Created by designers for designers: We understand the needs of a designer. That’s why we created the uinkits icon library to help all designers put their imagination into practice.
Learn more about our uinkits UI Icons and download your free icon pack now!
Icons8 has over 1.3M free icons, all pixel-perfect, responsive, and versatile. This icon library has many free icons that can match your UI designer needs in any situation and help you create the perfect design. They are available for Apple, Android, Windows, Web, and Graphic. Even more so, Icons8 also has over 4,500 animated icons for GIf, Lottie JSON, and After Effects.
You can also access Icons8 as a Figma Plugin, Google add-on, Photoshop plugin, and Illustrator plugin.
Learn more about Icons8 and download their free icon pack.
With Unicons by IconScout, you will find anything you need for your design. This is one of the largest icon libraries available, and they provide various icon styles, including colored outlines, doodles, dual-tone, flat gradients, isometric, and even lines or stickers. They are available in SVG, 3D, PNG, EPS, ICO, ICNS, AI, or PDF formats.
Their free icon set includes over 1,000 icons organized into 27 categories for every industry you need. All of their icons are created on a 24px grid, pixel-perfect with a 1px stroke. Unicons’ icons are available for Figma, Adobe XD, Canva, Illustrator, and so many other design tools.
This library provides you with all the Figma icons you need for the Vuesax framework. It includes over 6,000 icons in 6 different styles: linear, bulk, two-tone, bold, outline, and broken. The icon sets have an ideal 24px grid-based and are available for Figma, Illustrator, Adobe XD, Sketch, and Flutter.
We love this free icon set because of how simple and minimalistic it is. This way, you can use any icon you want for any mobile app design, website design, dashboard design, and any other type of product design.
Learn more about Iconsax and download their free icon pack.
This library is one of the oldest, biggest, and most popular icon libraries available on the market, having 2,037 free and open-source vectors that can fit into any of your projects. And if 2,037 free icons are not enough for you, you might want to try their premium version, which includes over 16,000 vector icons.
The Font Awesome icon sets include icons from 68 categories, including coding, medical, design, dashboard icons, film and video, media players, brand icons, and so many other cool icons. They also have icons in multiple styles, such as solid, regular, light, duotone, and thin.
Find out more about Font Awesome icons and download their free icon pack.
If you are looking for icon sets that will work on a 24 x 24 grid, Feather icons are what you are looking for. This library is designed with a focus on simplicity and minimalistic style that will work perfectly on every design that you have. However, this icon set only has available 287 free icons available for download in SVG format.
The coolest thing about Feather Icons is that you can easily customize the size, stroke width, and even color you want – all through the website. After you create your customization, just choose the icon you want, and there you have it. Now, only need to take your icon and freely use it in any UI UX design tool.
Find out more about Feather Icons and download their free icon pack.
If you are looking for an icon set for Figma, Untitled UI is a great option, as it has one of the largest icon libraries. Untitled UI icons are simple and neutral, yet modern and professional, and are great for any type of UI UX design. They are organized in 19 categories and come in multiple styles, including duotone and duocolor.
Untitled UI icons are created specifically for Figma and respect Figma best practices. They are also compatible with the latest component properties that Figma released in 2022. Their icon set uses 60% variable curves on corners and 2px stroke weight.
Find out more about Untitled UI Icons and download their free icon pack.
The Material Icons Library was created by Google and is a 100% open-source icon set for their Material Design system. They have over 3,000 Figma icons that can be easily customizable to make them perfect for any product design. And the best part is that you can also find these Google Icons as a Figma plugin – Material Symbols plugin.
Google Icons are available in 5 styles – sharp, rounded, outlined, filled, and two-tone. Material icons also have various iPhone and Android icons and 16 other categories for multiple industries. Simply choose the category you want, and you’re good to go!
Find out more about Material UI Icons and download their free icon pack.
Iconoir is a high-quality free icon pack with over 1,500 open-source icons (and counting). They also have multiple 3D icons that you can freely use. This icon set comes in more versions available for React, React Native, Figma, and Farmer, as well as in SVG format.
What’s better is that every icon on their website has a preview so you can see if the icon is fit for your UI UX design. And the best part is that you don’t necessarily have to download the SVG if you don’t want to. Just copy the icon within the website and then paste it into your Figma file.
Find out more about Iconoir Icons and download their free icon pack.
Tabler Icons has one of the largest free libraries available, with an impressive library of approximately 5,000 free icons for app and website design. This icon set can be used for pretty much any project you are working on, as it has many options. The icon library also allows you to adjust any icon size and stroke you want.
They are a simple and neutral icon set and are flexible enough to be adapted to all mobile app designs, dashboard designs, website designs, and any type of product design. Besides their Figma icon set, they are also available for React, Vue, Svelte, Preact, Solidjs, PDF, PNG, SVG, EPS, and Webfont.
Find out more about Tabler Icons and download their free icon pack.
Heroicons are designed by the creators of Tailwind CSS and include React & Vue libraries. It consists of 230 MIT Licenced icons in outline and solid styles. Although this might not be a large Figma icon sets, this is one of the most high-quality icon packs that are available – especially because it also comes with documentation.
What’s better is that you can simply search for the icon you need and preview it right on their website. And the best part is that you don’t necessarily have to download the SVG if you don’t want to. Just copy the icon within the website and then paste it into your Figma file.
Find out more about Heroicons v1.0 and download their free icon pack.
In 2022, Heroicons released Heroicons v2.0 after the massive success of Heroicons v1.0. The library includes 288 unique icons that can be found both in Outline and Solid styles, with 1.5px stroke weight. Besides the icon style, Heroicons v2.0 icons also have Mini and Micro sizes for mobile app design and, respectively, website design. The default size is rendered at 24px, while the Mini icons are 20px.
Heroicons are designed by the creators of Tailwind CSS and include React & Vue libraries. Although this might not be a large Figma icon set, this is one of the most high-quality icon packs that are available – especially because it also comes with documentation.
What’s better is that you can simply search for what icon you need and preview it right on their website. And the best part is that you don’t necessarily have to download the SVG if you don’t want to. Just copy the icon within the website and then paste it into your Figma file.
Find out more about Heroicons v2.0 and download their free icon pack.
Flowbite Icons has only 481 free, open-source, and unique SVG icons. These icons are compatible specifically with Tailwind CSS and Flowbite libraries and are created in solid and line styles with Figma and React support.
What’s better is that you can simply search for what icon you need, customize it based on icon size and stroke width, and preview it right on their website. The cool part is that you can just copy and paste it into your Figma file without downloading it to your device. This is amazing as you don’t have to use up your operating system memory.
Find out more about Flowbite Icons and download their free icon pack.
Majesticons is an open-source icon set with simple, high-quality, and neutral icons that can be used for modern designs. It consists of 360 unique MIT Licenced icons in line and solid styles – 720 icons in total. All icons are rendered at 24x24px, with a 2px stroke width and a beautiful border-radius that gives icons a consistent, modern, and minimalist look.
The Majesticons Figma icons library also has a paid version with approximately 7,000 icons. They are all neatly organized in over 50 categories, including user icons, people icons, chat icons, and so many more. Once you access the library, whether it is the free icon pack or the paid icon pack, you will get fully optimized SVG files that can easily be integrated into your Figma files or design system.
Find out more about Majesticons and download their free icon pack.
Phosphor Icons is one of the largest Figma icon sets available on the market. They have a clean, modern, and neutral look with 7,488 icons, flexible enough to be adapted to any UI UX design. The Phosphor Icons library has six styles – regular, thin, light, bold, fill, and duotone. You can also access the free icon set by the Figma plugin (or Sketch plugin).
The coolest thing about Phosphor Icons is that you can easily customize the size, stroke width, and even color you want – all through the website. After you create your customization, just choose the icon you want, and there you have it. Now, you can either choose to download it or just copy and paste it into any UI UX design tool.
Find out more about Phosphor Icons and download their free icon pack.
Streamline Core Line Icons is an open-source icon library under the CC (Creative Commons) Licence. This library consists of 1,000 unique icons available in four different styles – line, solid, duo color, and flat, totalling 4,000 icons. They also have a free Figma plugin so that you can access their icon library directly from the Figma app.
The Streamline Core Line Icons library also has a paid version, with over 177,000 premium icons and 36 premium icon packs. This consists of classic icons, colorful icons, round icons, sharp icons, plump icons, micro icons, freehand icons, nova icons, cyber icons, sticker icons, iOS icons, and kamaleon icons.
“Don’t reinvent the icons, we’ve already created the best for you.”
Remix Icon is an open-source Figma icon library with over 2,700 free icons and includes icons of two styles – outline and solid. Remix Icon library is completely free to use for personal and commercial use. They have icon sets from multiple categories, including logo icons, user icons, development icons, and so many more.
You can download their icons as a complete Icon Pack as .zip, or you can download a single icon as an SVG file or even a PDF file.
Find out more about Remix Icon and download their free icon pack.
MingCute is an open-source icons pack of over 2,200 free icons. It includes two icon styles – outline and filled, arranged in multiple categories, including business icons, design icons, user icons, and so many others. You can also access MingCute Icons through a Figma plugin.
The coolest thing about MingCute Icons is that you can easily customize the size and the color you want – all through the website. After you create your customization, just choose the icon you want, and there you have it. Now, you can either download it as SVG, PNG, or JSON or copy and paste it into any UI UX design tool.
Find out more about MingCute Icons and download their free icon pack.
Doodle Icons has over 400 simple and handcrafted icons that you can use for all types of website and app design. The Doodle Icons library includes 15 categories and is completely free for personal and commercial use under the Creative Commons Licence. The Doodle Icons free pack has standard icons and animated icons and is available in SVG, PNG, and Figma format.
Find out more about Doodle Icons and download their free icon pack.
Eva Icons is a free pack of 480 open-source icons that can be used in UI UX design for common actions and elements. The pack is across two icon styles – outline and filled and can be animated in four ways – zoom, pulse, shake, and flip.
The Eva Icons pack is available for both Figma and Sketch libraries, and you can directly download the entire icon set into your UI UX design tool. But compared to many other icon sets in our list, Eva Icons have already been converted to standard outlines, which means the stroke weight and corners can’t be customizable.
Find out more about Eva Icons and download their free icon pack.
Ionicons is a beautifully and premium crafted icon set of over 700 free icons. The pack includes app icons across three styles – respectively outline, sharp, and filled. Even more so, Ionicons also offer multiple logos, including the Amazon logo icon, Apple logo icon, Figma logo icon, and many others. Plus, social media icons!
You can easily download the file in an SVG format and then import it into your design tool. However, Ionicons also gives you the web component code so that you can add it to your development project.
Find out more about Ionicons and download their free icon sets.
Atlas Icons is an open-source icon library under the MIT Licence and is available in SVG format, Figma, Vue, React, Flutter, and web font. The icon set includes icons from over 40 categories and is easily customizable with three stroke weights. Atlas Icons is also available as a Figma plugin.
Find out more about Atlas Icons and download their free icon pack.
Tetrisly Icons offers beautiful, clean, and pixel-perfect icon sets, completely free to use for personal and commercial use under the Creative Commons Licence. This icon set includes icons of 20px, with a 1.5px stroke weight, but they are also easily customizable.
You can download the Tetrisly Icon sets through Gumroad, and you will receive a file with all the icons in SVG format, as well as files available for Figma and Sketch. Even more so, the icons can be easily found as the tags are extremely intuitive and include keywords.
Find out more about Tetrisly Icons and download their free icon pack.
uinkits – Our Figma Design System
We at uinkits understand the importance of inputs in great user experiences and creating amazing UI designs. That’s why we’ve developed a Figma UI Kit with design components that include these essential UI elements that enable you to design intuitive and user-friendly interfaces effortlessly.
“You press the button, we do the rest,”– Kodak.
Inspired by this iconic tagline from Kodak, we believe in simplifying the design process for you. Our Figma UI Kit, uinkits, is a complete design system with UI components that allows you, as a UI UX designer, to create your products as quickly as pressing a button.
Our design system includes UI components, icon sets, free icon packs, and other design bundles that you need for your design process. All you have to do is take your needed UI design component, and you’re ready to use it in your designs!
