TL;DR
- Icon libraries with MIT or ISC licenses don't require visible attribution in your UI
- Font Awesome Free is actually a combination of three different licenses — keeping the embedded comments satisfies attribution requirements
- For new projects, Lucide or Heroicons offer simpler licensing with less friction
Font Awesome, Lucide, Heroicons… When choosing an icon library for work projects, I suspect many of us don't give much thought to licensing.
I used to think "it's MIT licensed, so it's fine" and left it at that. But when I looked into it more closely, I discovered quite a few things I didn't know. I thought it might be helpful to share what I found.
Chapter 1: What "Free" Really Means
Two Meanings of "Free"
When you hear "free icon library," you probably think "no cost." But in the open source world, there's another meaning.
"Think free as in free speech, not free beer."
These are the words of Richard Stallman, founder of the free software movement.
- Free as in beer — No cost. But you can't see the source code or modify it (e.g., Adobe Reader)
- Free as in speech — You can use it freely, view the source, modify it, and redistribute it (e.g., Linux)
For icon libraries:
- Font Awesome Free → No cost, but Pro features are unavailable
- Lucide, Heroicons → No cost, and you can freely modify and redistribute the source code
This distinction matters when it comes to choosing licenses.
Chapter 2: A Brief History of Web Icons
2012: The Explosive Growth of Font Awesome
In the 2000s, web icons were mostly individual PNG images. They weren't scalable, and they required many HTTP requests.
In 2011, Twitter Bootstrap (now Bootstrap) shipped with Glyphicons bundled in. Glyphicons was an icon set created by Jan Kovařík — originally a paid product, but around 250 icons were provided free of charge for Bootstrap. Then in 2012, Dave Gandy released Font Awesome, and it became the most popular new project on GitHub.
In 2016, Font Awesome raised $1,076,960 (over $1 million) on Kickstarter, reportedly setting a record for software projects at the time.
Why Glyphicons Disappeared from Bootstrap 4
Glyphicons was standard in Bootstrap 3, but it was removed in Bootstrap 4. The reasons included: file size bloat for users who didn't need icons, many users were already using Font Awesome or other icon fonts, and it made sense to delegate icon development to specialized projects.
Feather Icons → Lucide: A Fork Story
In 2017, Cole Bemis released Feather Icons. It was a minimal and beautiful icon set, but maintenance gradually slowed down, with over 300 issues left unaddressed.
In 2020, the community forked it and launched Lucide. It has since grown into an active project with over 1,500 icons. This is open source succession at its finest.
Chapter 3: Practical Differences Between Licenses
License Quick Reference
| License | Commercial Use | Modify/Redistribute | Attribution | Copyleft | Notes |
|---|---|---|---|---|---|
| MIT | ✅ | ✅ | In source code | None | Most simple. Most popular on GitHub |
| ISC | ✅ | ✅ | In source code | None | Nearly identical to MIT. npm's default |
| Apache 2.0 | ✅ | ✅ | In source code | None | Includes patent clause. Common in Google projects |
| CC BY 4.0 | ✅ | ✅ | Required in principle | None | Designed for content. Used by Font Awesome icons |
| SIL OFL 1.1 | ✅ | ✅ | In source code | None | Font-specific. Cannot be sold standalone |
| GPL | ✅ | ✅ | Derivatives must use same license | Yes | If you distribute derivatives, you must release source code under the same license |
MIT / ISC — The Easiest for Practical Use
Keep the copyright notice and license text in your source code
That's basically all you need to do. No visible attribution in the UI is required. When you run npm install, license files are automatically included in locations like node_modules/lucide-react/LICENSE — just don't delete them and you're fine.
Lucide, Heroicons, Tabler Icons, Phosphor Icons, and Bootstrap Icons all fall into this category. These licenses are quite easy to work with for commercial projects.
Apache 2.0 — The Patent Clause Matters
Similar to MIT, but includes explicit permission regarding patents. Often adopted by projects involving large corporations.
Common in Google's Material Symbols and Android-related projects. Attribution is "welcomed but not required."
CC BY 4.0 — A License for Content
Creative Commons was originally designed for content like images, music, and text. "BY" stands for "Attribution."
Font Awesome Free's icon SVGs and JS files use this license. In principle, attribution is required, but Font Awesome has made special accommodations (more on this below).
Chapter 4: Font Awesome Free Actually Has Three Licenses
The Multi-License Trap
Font Awesome Free isn't under a single license. This might come as a surprise.
| Component | License | Specific Files |
|---|---|---|
| Icons (design) | CC BY 4.0 | SVG files |
| Font files | SIL OFL 1.1 | .woff2, .ttf, etc. |
| Code | MIT | CSS, JavaScript |
Even when using the SVG-JS model via npm, these three licenses are all in play.
But It's Not That Strict in Practice
The official LICENSE.txt states:
Attribution is required by MIT, SIL OFL, and CC BY licenses. Downloaded Font Awesome Free files already contain embedded comments with sufficient attribution, so you shouldn't need to do anything additional when using these files normally.
In other words, if you keep the embedded comments in the downloaded files, no additional attribution is required.
⚠️ Build Tool Behavior
Modern build tools like Webpack, Vite, and esbuild extract comments starting with @license, @preserve, or /*! into separate files (.LICENSE.txt) by default. Font Awesome's files include these comments, so the license information is preserved. However, since the comments are removed from the original JS files, it's worth checking your build output to be sure.
When Copying Individual SVGs
If you copy individual SVGs from the website, they may not include comments. In that case, you can add a license comment inside the SVG. This way, you don't need to display attribution in your footer or UI.
<!-- Font Awesome Free 6.x by @fontawesome - https://fontawesome.com License - CC BY 4.0 -->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">...</svg>
Of course, you can also add attribution in your about page or footer.
<footer>
Icons by <a href="https://fontawesome.com">Font Awesome</a> (CC BY 4.0)
</footer>
Brand Icons Are a Different Matter
Brand icons included in Font Awesome (company logos, etc.) involve trademark issues.
Even if the license is MIT or CC BY, you must follow each company's Brand Guidelines. For example, modifying Twitter (X)'s logo without permission or using it in a competitor's context is not allowed. This is separate from licensing.
Chapter 5: Font Awesome Pro Token Management
Font Awesome Pro requires an API token when installing via npm. Here's the difference from the Free version.
Free Version: No Token Required
npm install --save @fortawesome/fontawesome-free
That's all you need.
Pro Version: Token Required
The Pro version is fetched from Font Awesome's private npm registry, so an authentication token is required. Configure it in your project's .npmrc file:
# .npmrc
@fortawesome:registry=https://npm.fontawesome.com/
//npm.fontawesome.com/:_authToken=${FONTAWESOME_NPM_AUTH_TOKEN}
Manage your token via environment variables — don't write it directly in the .npmrc file.
Chapter 6: Comparing Icon Libraries
There are plenty of alternatives to Font Awesome.
| Library | License | Icon Count | Attribution | Token |
|---|---|---|---|---|
| Font Awesome Free | CC BY 4.0 + SIL OFL + MIT | 2,000+ | Required (embedded OK) | Not required |
| Font Awesome Pro | Commercial license | 30,000+ | Not required | Required |
| Lucide | ISC | 1,500+ | Not required | Not required |
| Heroicons | MIT | 450+ | Not required | Not required |
| Tabler Icons | MIT | 5,900+ | Not required | Not required |
| Bootstrap Icons | MIT | 2,000+ | Not required | Not required |
| Phosphor Icons | MIT | 9,000+ | Not required | Not required |
| Material Symbols | Apache 2.0 | 2,500+ | Recommended (not required) | Not required |
How to Choose
If simplicity is your priority:
- Lucide — A fork of Feather Icons, actively developed
- Heroicons — Official Tailwind CSS icons, high design quality
If icon count is your priority:
- Tabler Icons + Phosphor Icons — Both MIT, over 15,000 combined
If ecosystem matters:
- Font Awesome Pro — Over 30,000 icons, $120/year
- Material Symbols — Great compatibility with Google's ecosystem
Chapter 7: Where Should You Put Attribution?
Is UI Attribution Required?
| License | Source Code/LICENSE | UI (Footer, etc.) |
|---|---|---|
| MIT | ✅ Required | Optional |
| ISC | ✅ Required | Optional |
| Apache 2.0 | ✅ Required | Optional |
| CC BY 4.0 | ✅ Required | Recommended if comments removed |
| SIL OFL 1.1 | ✅ Required | Optional |
For MIT-licensed libraries, visible attribution in HTML, CSS, or UI is generally not considered necessary.
What You Might Want to Do Anyway
# THIRD_PARTY_LICENSES.md
## Icons
### Lucide Icons
- License: ISC
- https://lucide.dev/license
With MIT or ISC licenses, you don't need visible attribution in the UI. However, you do need to keep license information somewhere in your project's source code. Creating a file like this can be helpful when legal review comes around.
There are also tools to auto-generate license lists:
npx license-checker --json > licenses.json
Conclusion
When choosing an icon library for commercial projects, it's easy to default to "just use Font Awesome." But understanding the license structure can give you peace of mind.
Personally, I tend to use Lucide or Heroicons for new projects. They have simple, single licenses (MIT/ISC), no token management required, and official React/Vue components — less friction in practice.
Font Awesome Free is perfectly fine for commercial use, so if you're already using it in an existing project, there's no need to migrate. Just keep the embedded comments and you'll meet the attribution requirements.
I hope this article helps someone out there.
References
Licenses
- Choose a License — Helpful for choosing a license
- MIT License - Wikipedia
Icon Libraries
- Font Awesome Free License
- Font Awesome LICENSE.txt (GitHub)
- Lucide — Fork of Feather Icons
- Heroicons — Official Tailwind CSS icons
- Tabler Icons
- Phosphor Icons
- Material Symbols
History
Top comments (0)