design basics, explained
What is an icon library? A plain-English guide for non-designers
A friendly explainer of what an icon library is, what comes inside one, free vs paid, how to pick one and how to use it in slides, documents, websites and apps.
- An icon library is a collection of small pictures (icons) drawn to match each other, with names, file formats and a licence that says how you may use them.
- Inside you usually get: the icons, one or more styles (outline, solid and so on), formats such as SVG and PNG, searchable names, and a licence.
- Using one library instead of random icons from the web keeps your work consistent and your use legal.
- Many good libraries are free. Open-source ones (MIT, ISC, Apache 2.0) need no visible credit; marketplace free plans usually ask for a credit or link.
- To choose, check that it has the icons you need, a style that fits, the formats your apps accept, and a clear licence. Examples: with icons (500 icons in 20 styles), Font Awesome, Material Symbols, Lucide and Tabler.
On this page 9 sections
An icon library is a collection of small, simple pictures (icons) that are drawn to match each other, with a name for every icon, ready-to-use files and a licence that tells you how you may use them. Think of it as a font, but for pictures: you pick an icon by name, and it looks right next to every other icon in the set.
If you have ever hunted for “a little calendar picture” for a slide and ended up with five icons that do not quite match, an icon library is the fix. This guide explains what is inside one, why it beats grabbing random images, what is free, and how to pick and use one, with no design or coding background needed.
What is an icon library, in plain English?
Imagine a box of stickers where every sticker was drawn by the same hand, with the same pen, at the same size. Whichever ones you pull out, they look like a family. An icon library is that box, in digital form.
Each icon stands for one idea: a house for the home page, a magnifying glass for search, a bell for notifications. Because they share the same grid, line thickness and corner style, a page or slide full of them looks calm and professional instead of patched together.
What is inside an icon library?
Most libraries give you the same five ingredients. Here is what each one means for you.
- The icons. Anything from a few hundred to many thousands of drawings. with icons has 500, covering everyday interfaces, slides and documents.
- Styles. The same icon drawn in different looks, such as outline (lines only) or solid (filled in). Some libraries offer one style; with icons offers 20, from plain Line to playful Kawaii.
- Formats. The file types you can use. SVG stays sharp at any size and can be recoloured; PNG works almost everywhere. (Our SVG vs PNG guide explains when to use which.)
- Names and search words. Every icon has a name, like
trash, and good libraries also understand everyday words, so typing “bin” or “delete” still finds it. - A licence. The legal permission that says whether you can use the icons in commercial work and whether you must credit the creator.
Many libraries add extras on top: copy and download buttons, plugins for Figma or Google Slides, and code packages for developers. Nice to have, but the five ingredients above are what matter.
Why use an icon library instead of random icons from the web?
Searching an image site for “phone icon” and taking whatever looks fine works once. It falls apart by the tenth icon, for three reasons.
- Consistency. Icons from different sources have different line weights, corners and sizes. Side by side, the difference is obvious, even to people who cannot name it.
- Legal certainty. A random image may have no licence at all, or one that forbids commercial use. A library states its licence once, for every icon.
- Coverage and speed. When you need a matching “calendar” next week, it is already there, in the same style, under an obvious name.
Pick one library, search it by plain words, and use its icons everywhere: slides, website, documents. Your work will look like it came from one team.
Mix a thin outline phone from one site with a chunky filled envelope from another and a 3D clip-art bell. Each is fine alone; together they look accidental.
Are icon libraries free?
Many of the best ones are. Icon libraries come in three broad kinds, and the main difference is not price but what you owe in return.
| Kind | Cost | Use without a credit | Examples |
|---|---|---|---|
| Open source | Free | Yes | with icons (MIT), Lucide (ISC), Heroicons, Phosphor, Tabler (MIT), Material Symbols (Apache 2.0) |
| Free with credit | Free | Credit or link needed | Flaticon and Icons8 free plans, The Noun Project (CC BY 3.0) |
| Paid or Pro | Subscription | Yes, once paid | Font Awesome Pro, Flaticon Premium, Noun Pro |
Font Awesome sits in between: its free icons use the CC BY 4.0 licence, which normally means giving credit, but its licence says the credit already inside the files is enough. For the full picture, read our guide to free icons for commercial use.
How do you choose an icon library?
You do not need a design degree. Run through these six checks, in this order, and you will rarely go wrong.
- 1Search for your ten must-have icons
List the ideas you actually need (for example “invoice”, “team”, “calendar”) and search for each one. A library missing three of them is the wrong library, however pretty it is.
- 2Check that the style fits
Calm outline icons suit most apps and business slides. Bolder or playful styles suit marketing, kids’ content and hero images. A library with several styles gives you room to grow.
- 3Check the formats against your apps
Websites and PowerPoint love SVG. Google Slides and email need PNG. Make sure the library offers what your tools accept.
- 4Read the licence
Can you use it in commercial work? Do you have to credit anyone? If the answer is not on the website in plain words, be careful.
- 5Look at ten icons side by side
Do the lines look equally thick? Do round and square icons look the same size? If yes, the library was drawn with care.
- 6Check it is alive
Recent updates, new icons and clear documentation are good signs that it will still be there next year.
How do you use an icon library in slides, documents, websites and apps?
In slides and documents
Search for the icon on the library’s website, then copy it or download it. In with icons every icon page has Copy image, PNG download in any colour, and SVG download. Paste it into PowerPoint, Google Slides, Canva or Word and Google Docs. Our guide to icons in presentations covers sizing and colour.
On websites
Website builders usually take an uploaded SVG or PNG: see our guides for WordPress, Webflow and Wix and Squarespace. On a hand-built site you can paste the SVG code straight into the page. Our guide to adding icons to a website shows each route.
In apps
Developers usually install the library as a code package and write something like <Icon name="home" />. with icons has components for React, Vue, Svelte, Angular and SolidJS plus a web component, all on npm (for example npm i @withicons/react) and the jsDelivr CDN. Without code, copy the SVG from any icon page. See the developer page.
What are some examples of icon libraries?
Here are well-known libraries and what each is known for, with honest notes. Our comparison of the best free icon libraries goes deeper, and the alternatives pages compare each one with with icons.
| Library | Free icons | Free styles | Licence | Read more |
|---|---|---|---|---|
| with icons | 500 (10,000 SVGs) | 20 | MIT | Our licence |
| Font Awesome | Over 2,000 | 3 (Solid, Regular, Brands) | CC BY 4.0 (icons) | vs Font Awesome |
| Material Symbols | Over 2,500 | 3 + adjustable weight and fill | Apache 2.0 | vs Material Symbols |
| Lucide | Over 1,600 | 1 (adjustable stroke) | ISC | vs Lucide |
| Heroicons | 316 | Outline, solid, mini, micro | MIT | vs Heroicons |
| Phosphor | About 1,500 | 6 weights | MIT | vs Phosphor |
| Tabler Icons | Over 6,000 | 2 (outline, filled) | MIT | vs Tabler |
| Flaticon | Over 18 million icons and stickers | Thousands (many artists) | Own licence, credit on free plan | vs Flaticon |
| The Noun Project | Millions | Thousands (many artists) | CC BY 3.0 free; paid licence | Noun Project alternative |
Being honest about trade-offs: if you need brand logos, Font Awesome has them and we do not. If you need thousands of rare icons, Tabler or a marketplace like Flaticon has far more. If you are building an Android app, Material Symbols matches the platform.
Where with icons stands out is one tidy set for code, slides and documents, in 20 styles, with no credit line. You can also ask AI assistants to pick icons from the real list.
The bottom line
An icon library is a box of matching pictures with clear names and clear rules. Pick one that has the icons you need, in a style you like, in files your apps accept, under a licence you understand, then use it everywhere. Your slides, documents and website will instantly look more consistent.
Frequently asked questions
What is an icon library?
An icon library is a collection of icons drawn to match each other, with a name for each icon, files in formats such as SVG and PNG, and a licence that says how you may use them. You pick an icon by name and it looks right next to every other icon in the set.
What is the difference between an icon library and an icon set?
In everyday use they mean almost the same thing. “Icon set” usually means the drawings themselves, while “icon library” often also includes the website, search, downloads, code packages and documentation that help you use them.
Are icon libraries free?
Many are. Open-source libraries such as with icons, Lucide, Heroicons, Phosphor and Tabler are free under MIT or ISC licences with no visible credit needed. Marketplaces such as Flaticon and The Noun Project have free plans that require a credit, and paid plans that remove it.
Can I use icons from an icon library in commercial work?
Usually yes, but check the licence. MIT, ISC and Apache 2.0 allow commercial use with no visible credit. CC BY and most marketplace free plans allow commercial use too, as long as you credit the creator or link back.
Do I need to be a developer to use an icon library?
No. Most libraries have a website where you search for an icon and then copy or download it as an SVG or PNG, which works in PowerPoint, Google Slides, Canva, Word and website builders. Code packages are an extra for developers.
Should I mix icons from different libraries?
Try not to. Different libraries use different line thickness, corner shapes and sizes, so mixed icons look slightly off next to each other. If you must mix, keep each library to its own area of your product.
Sources and notes
- Font Awesome Free licence (GitHub)
- Font Awesome plans (which styles are free)
- Google Fonts: Material Symbols guide (count, styles, licence)
- Lucide website and licence (ISC)
- Heroicons website (icon count, styles, licence)
- Phosphor Icons on GitHub (six weights, MIT)
- Tabler Icons README on GitHub (count, licence)
- Flaticon pricing (count, free plan with credit)
- Noun Project legal and licences (free icons under CC BY 3.0)
- Icons8 licence (free with a link)
- The MIT License (Open Source Initiative)
- Creative Commons: CC BY 4.0 deed
- with icons license (MIT)
Facts about other icon sets were checked against their official sites in October 2026. Libraries change, so check the links above for the latest numbers.