The best icon libraries for UI design in 2026

The best icon library is the one that fits where your product has to ship. For a React app, start with Lucide. For several weights of every icon, use Phosphor; for Android, Google's Material Symbols; for the widest free coverage, Tabler; for brand logos and every style under one roof, Font Awesome; for a Figma team on the Untitled UI kit, Untitled UI; and for five matched styles paid for once, Pikaicons.

Whichever you pick, you'll live with it for a long time. An icon library touches every screen of a product, and swapping it a year in means replacing hundreds of icons, re-checking their sizes and finding every place someone quietly drew a missing one by hand. So each library below gets the same question: would it still be the right choice once the product is big?

A disclosure before the list: we make Pikaicons, which is number seven. Every other figure here was read from the library's own site, repository, npm page or pricing page on 21 October 2026, and is linked so you can check it.

The short answer, by what you're building

What "best" means once a product is big

It's tempting to rank icon sets by looks and size. Both matter less than they seem in a gallery, because a set you'll use for years has to pass five duller tests:

• One family. Every icon is drawn on the same grid with the same stroke and corners, so a settings gear and a chart icon look as if one hand drew them.
• Coverage for your product. The raw count misleads, because libraries count differently: Phosphor and Pikaicons count every weight or style of an icon, while others count designs. What matters is whether the set has the icons your product needs.
• Design and code. Figma components for designers, and a package or copyable code for developers, so the two never drift apart.
• Clear terms. A license you can read in a minute, or a price that won't change after you've shipped.
• Still maintained. The release dates in this post come from npm, not from a "last updated" badge.

Two kinds of site rank well for "best icons" and aren't on this list. Marketplaces gather icons from many different artists, which is fine for a one-off illustration and a problem in a product, where the icons need to read as one set. Aggregators such as Iconify and React Icons put many libraries behind one API, so they hold libraries rather than replace them; you'll find them under Also worth knowing.

1. Lucide: the default for React projects

Lucide is the community fork of Feather that kept going after Feather stopped. It has 1,903 icons in one outline style with a 2px stroke, under the ISC license, with packages for React, Vue, Svelte, Solid, Angular, Preact, React Native and plain SVG.

Its strongest argument is momentum. lucide-react was installed 67.1 million times in the week of 12 to 18 October, more than every other library in this post combined, and a new version shipped on the day we checked. It's also what the shadcn/ui CLI installs by default, though the same CLI can switch to Tabler, Phosphor, Hugeicons or Remix Icon with one setting.

import { Search } from "lucide-react";

<Search size={20} strokeWidth={1.5} />

The trade-off is range. There's one style, so a selected tab can't switch to a filled version of the same icon, and active states have to come from colour, weight or a second set.

Best for: React and open-source projects that want a free, well-maintained outline set with no decisions to make.

2. Phosphor: the most weights in one free set

Phosphor draws every icon in six weights: thin, light, regular, bold, fill and duotone. That comes to 9,072 icons across the weights, under the MIT license, with packages for the web, React, Vue, Flutter and Elm, plus an official Figma plugin.

Six matched weights let you use thin icons in a dense dashboard, bold ones in a mobile tab bar and duotone in onboarding without leaving the family. No other free set on this list goes from hairline to filled to two-tone with the same drawings.

One thing to check: @phosphor-icons/react last shipped on 22 May 2025. The icons don't expire, but if you expect to need new ones, look at the repository's activity before you commit.

Best for: products that need several visual weights, including a filled and a duotone version of every icon.

3. Material Symbols: the most adjustable, and Android's own

Google's Material Symbols come as a variable font with four axes: fill (0 to 1), weight (100 to 700), grade, and optical size (20 to 48), in outlined, rounded and sharp styles. There are more than 3,800 of them, under Apache 2.0.

The axes are the point. You can make an icon a touch bolder in dark mode, fill it when it's selected, or let its stroke adjust to its size, all from CSS with font-variation-settings.

On Android it's the official answer, and the old shortcut is gone. Android's own docs now say the Compose Material Icons library is no longer maintained or recommended, partly because it can slow builds significantly, and tell you to download Material Symbols from Google Fonts as vector drawables instead.

Best for: Android apps, Material Design systems and anyone who wants to tune icons with font axes.

4. Tabler Icons: the biggest MIT set

Tabler Icons has 6,238 icons in outline and filled styles, drawn on a 24px grid with a 2px stroke under the MIT license. It ships React components, an SVG sprite and a web font, its React package takes the stroke width as a prop, and its latest release was on 5 October 2026.

Coverage is its advantage. When you need an icon for a niche concept, Tabler is the free set most likely to have it.

With a set that large, run the twenty-icon test before you commit: put the twenty icons your product will use most (home, search, settings, user, bell and so on) side by side at your real size. Those are the icons people will see on every screen, and they matter more than the other six thousand.

Best for: teams that need wide coverage under a permissive license.

5. Font Awesome: brand logos and every style

Font Awesome is the oldest name here and still the broadest. Its free tier has 2,163 icons in solid, regular and a large brands set, and Pro has 65,928 icons in 36 styles across 17 packs, including sharp and duotone.

If you need brand logos, an unusual style or a very specific icon, it probably has one, and the brand set alone is a common reason teams install it next to another library. The free icons are CC BY 4.0, but the license notes that the comments already inside the files count as the credit, so normal use needs nothing extra.

Pro is a subscription, with Solo at $96 a year. Since version 7, some curated icon packs of about 200 icons each need the higher Pro+ plan, so check which tier the styles you want sit in.

Best for: teams that want one vendor for every style and every brand logo, and are happy to pay yearly.

6. Untitled UI icons: built for Figma teams

Untitled UI is a Figma design system first, and its icons are built to sit inside it. The free set has 1,100+ line icons with a 2px stroke; Pro has 4,600+ in line, duocolor, duotone and solid, set up as Figma components, with SVG exports and a private npm package for developers.

Pro is a one-time purchase. When we checked, Solo was $59 (on sale from $79), with tiers for up to 8 users ($169), up to 20 ($399) and unlimited ($999).

The free icons can be used in commercial projects, but the license forbids redistributing them or using them in a competing UI kit or library. They're free to use rather than open source.

Best for: teams already building on the Untitled UI design system in Figma.

7. Pikaicons: five matched styles, paid once

This one is ours, so read it with that in mind. Pikaicons has 5,000+ icons across five styles (stroke, solid, duo stroke, duo solid and contrast) in 27 categories. I draw every one on a 24px grid with a 2px stroke and 60% corner smoothing.

You get a Figma file and an app that copies any icon as SVG, React, Vue, Svelte, React Native or Solid, with the size and stroke width set before you copy. It's one payment from $99, icons added later are included, paid plans can request custom icons, and 500+ of the icons are free for commercial use with credit optional.

Where it doesn't fit: the catalogue is far smaller than Font Awesome Pro's or Streamline's, there's no brand-logo depth to match Font Awesome, and there's no npm package or CDN. Developers copy code from the app instead of installing a package, which Untitled UI Pro's private npm does better.

Best for: product teams that want several matched styles of each icon and would rather pay once than subscribe.

Also worth knowing

• Heroicons (316 icons, MIT), from the makers of Tailwind CSS, in 24px outline and solid, 20px mini and 16px micro. Small, and its latest release was in November 2024.
• Hugeicons has a large free tier of 6,000+ icons in one style (MIT) and a Pro plan with 60,000+ icons in 10 styles at $99 a year. It's one of the five sets the shadcn/ui CLI supports.
• SF Symbols is Apple's set of 7,000+ symbols in nine weights and three scales, built to align with San Francisco text. Apple's design guidelines point you to its terms and forbid using the symbols in app icons or logos.
• Simple Icons is the go-to for brand logos: 3,466 of them under CC0. The marks still belong to their owners, and the project asks you to read its legal disclaimer.
• Iconify puts 200+ open icon sets, more than 250,000 icons by its own count, behind one component and API. Handy for prototypes, but each set keeps its own license and drawing style.
• React Icons bundles about 30 sets as React components and is installed 5 million times a week. Its README pins older snapshots, though: its Lucide has 1,215 icons against 1,903 today, and some included sets carry licenses such as CC BY-SA 3.0.
• Remix Icon (3,200+ icons) moved from Apache 2.0 to its own license in January 2026. It forbids selling the icons as a pack, building a competing library from them or using one as a logo.
• Feather hasn't had a release since May 2024. Lucide is its maintained continuation and the better choice for new work.

How to choose in four questions

Where will it ship?

Let the platform choose first, as in the table at the top. The catch is a product that ships on the web, iOS and Android: a platform's native set won't follow you to the others, so it needs one library with a Figma file and code for every framework you use.

How many styles will you need?

If you'll want filled active states, duotone illustrations or several weights, pick a library that draws them as one family now: Phosphor if it's free, or Font Awesome Pro, Untitled UI Pro or Pikaicons if it's paid. Mixing two sets later is where mismatched strokes come from. Outline vs filled icons covers when to use each, and duotone icons covers the two-tone styles.

Does it pass the twenty-icon test?

List the twenty icons your product will use most, find each one in your shortlist, and look at them together at the size you'll ship (usually 20 or 24px; icon sizes has the numbers). A library that looks great in its own gallery can still have a home icon you don't like, and you'll see that home icon on every screen.

How would you rather pay?

Free sets cost nothing, but read the license: MIT, ISC and Apache 2.0 are permissive, while Untitled UI's free icons and Remix Icon have their own rules. Free icons for commercial use walks through the fine print, and the best free icon libraries compares the open-source options in more depth. For paid sets, the best paid icon libraries works out what one seat costs over three years, subscriptions included.

Frequently asked questions

What is the best icon library?

There isn't one best set for every product. Lucide is the most used free library by a wide margin (67.1 million React installs a week), Phosphor has the most matched weights for free, Material Symbols is the most adjustable, and Font Awesome has the most icons and styles if you're willing to subscribe. Pick by platform first, then by how many styles you'll need.

What is the best icon library for React?

Lucide is the safest default: it's free, actively released and already installed in most shadcn/ui projects. Choose Phosphor if you need weights, Tabler if you need coverage, and Heroicons for a small set that matches Tailwind. SVG icons in React covers how to size, colour and label them once they're in.

Which icon library does shadcn/ui use?

Lucide, by default. The shadcn/ui CLI also supports Tabler Icons, Phosphor, Hugeicons and Remix Icon, set with the iconLibrary field in components.json.

What is the best icon library for Figma?

One that ships as real Figma components rather than loose vectors, so a swap or a colour change works everywhere at once. Untitled UI Pro is the natural fit if you use its kit, Phosphor has an official plugin for free, and Pikaicons includes a Figma file with every style. Whatever you choose, make sure developers get the same icons in code.

Is Font Awesome free for commercial use?

Font Awesome Free is: its icons are CC BY 4.0, its fonts SIL OFL and its code MIT, and the license says the comments already in the files cover attribution. Pro icons need a paid plan, and brand logos may only be used to represent the brand they belong to.

Can I use SF Symbols on a website or in an Android app?

Read Apple's terms first. SF Symbols come with their own license in the SF Symbols app, and Apple's guidelines forbid using them in app icons or logos. For a product that also ships on the web or Android, a cross-platform set is the simpler choice.

Can I mix two icon libraries in one product?

For brand logos, yes: that's what Simple Icons and Font Awesome's brands set are for. For interface icons, two sets side by side show different grids, corners and stroke weights (Lucide and Tabler use 2px, Iconoir 1.5px), and the difference shows wherever they sit in the same toolbar. If you must mix, match the stroke width and size, and keep each set to its own part of the product.

Should I use an icon font or SVG icons?

SVG, for most product UI. Each icon is its own element, so it takes colour from currentColor, scales crisply, can carry a label for screen readers, and with a tree-shaken package only the icons you import end up in your bundle. Font Awesome and Tabler still ship web fonts if you need one, and SVG icons in React shows the patterns side by side.