- 登入
- 註冊
Free Icon 免費圖示網站推薦：15 個商用授權、署名與 SVG 下載指南
內容目錄
顯示
找 Free Icon 常見的雷，不是圖示不好看，而是把「可以免費下載」誤認成「可以免署名商用」。不同網站的免費方案可能要求署名，保留授權聲明，禁止單獨轉售，品牌圖示還可能另外受到商標規範限制。
先說結論：免費 Icon 要先看授權，再看格式與風格
如果你要找網站介面用的免費 Icon，優先從 Heroicons、Lucide、Tabler Icons、Bootstrap Icons、Phosphor Icons 等開源圖示庫開始；如果要找大量主題與特殊風格，再考慮 Flaticon、Noun Project、Icons8 或 SVG Repo，但下載前要逐一確認署名與單張授權。
選擇時先問五件事：會不會用在商業網站，是否能公開署名，要不要修改顏色或線條，是否會放進可轉售商品，以及需要 SVG、PNG 還是圖示字型。只看圖庫寫著 Free，還不足以做決定。
15 個 Free Icon 免費圖示網站快速比較
下表整理一般網站與數位產品常見用法。授權可能更新，實際使用仍要以下載當下的官方條款、檔案內 license，以及單一圖示頁標示為準。本文查證日期為 2026 年 8 月 2 日。
| 圖示網站 | 主要格式 | 免費商用 | 署名重點 | 適合情境 |
|---|---|---|---|---|
| Google Material Symbols | SVG、PNG、字型 | 可以 | 不強制 | Android 與通用介面 |
| Heroicons | SVG、React、Vue | 可以 | 依 MIT 保留聲明 | Tailwind 與產品介面 |
| Lucide | SVG 與套件 | 可以 | ISC／MIT，依個別授權保留聲明 | 一致線性圖示 |
| Tabler Icons | SVG、PNG、套件 | 可以 | 依 MIT 保留聲明 | 大型介面圖示庫 |
| Bootstrap Icons | SVG、Sprite、字型 | 可以 | 依 MIT 保留聲明 | 網站與後台介面 |
| Remix Icon | SVG、PNG、字型 | 可以 | 署名非必要 | 中性介面與雙風格 |
| Phosphor Icons | SVG 與套件 | 可以 | 依 MIT 保留聲明 | 多種粗細與風格 |
| Iconoir | SVG 與套件 | 可以 | 依 MIT 保留聲明 | 簡潔開源介面 |
| Simple Icons | SVG 與套件 | 視品牌而定 | 圖庫 CC0，品牌另查 | 品牌與服務標誌 |
| iconmonstr | SVG 與 PNG | 可以 | 不要求 | 快速下載單色圖示 |
| Icons8 | PNG 與 SVG 等 | 免費方案可用 | 免費使用通常要連結 | 多風格與跨媒材 |
| Flaticon | PNG、SVG、EPS、CSS | 免費授權可用 | 免費使用要署名 | 大量主題圖示包 |
| Noun Project | PNG 與 SVG | 依單張授權 | 免費 CC 圖示要署名 | 概念與名詞搜尋 |
| Font Awesome Free | SVG、JS、字型 | 可以 | 依檔案授權保留聲明 | 網站圖示與前端套件 |
| SVG Repo | SVG 與 PNG | 依單張授權 | 看單一圖示頁 | 跨圖庫搜尋與改色 |
表格中的「保留聲明」通常不是要你在每個圖示旁放一行來源，而是不要移除套件或下載檔案中的版權與授權資訊。若圖示要脫離原套件單獨交付，應把對應的 license 一併保留。
Free Icon 授權怎麼判斷？用這個流程做決定
MIT、ISC、Apache、CC BY 與 CC0 的要求不同。就算都允許商用，有些要保留版權聲明，有些要求清楚署名，有些只代表作者放棄著作權，沒有處理第三方商標。公司官網、客戶專案與可轉售商品的風險也不同。
10 個開源或條款相對單純的免費 Icon 網站
1. Google Material Symbols：Google 介面語言與可變字型
Google Material Symbols 適合表單、導覽、按鈕與 Android 風格介面。它提供 SVG、PNG 與可變圖示字型，可以調整填色、粗細、光學尺寸與 emphasis。
官方文件標示 Material Symbols 採 Apache License 2.0。Material Icons 指南也說明，產品內使用不強制署名，但仍應保留套件原有授權資訊。若你需要熟悉度高的通用操作符號，這是容易開始的選擇。
來源：Google Fonts：Material Symbols guide；Google Fonts：Material Icons guide（查證 2026-08-02）
2. Heroicons：Tailwind 團隊打造的介面圖示
Heroicons 提供 outline 與 solid 等版本，可直接複製 SVG，也有 React 與 Vue 套件。命名清楚，圖示外觀一致，特別適合產品網站、SaaS 後台與 Tailwind CSS 專案。
Heroicons 採 MIT License。你可以用在商業專案並修改，但散布軟體或套件時要保留版權與授權聲明。一般網頁嵌入可沿用官方套件，不必為每一個圖示另加可見來源。
來源：Heroicons 官方網站與 MIT License（查證 2026-08-02）
3. Lucide：線條一致，支援多種前端框架
Lucide 是社群維護的線性圖示庫，能用 SVG，也有 React、Vue、Svelte 等套件。若網站需要一整套視覺一致的功能圖示，不想混用不同作者的筆畫，Lucide 很實用。
Lucide 主要採 ISC License；官方 License 頁另列部分源自 Feather 的圖示採 MIT。兩者都允許使用、修改與散布，但應依實際圖示保留對應版權及許可聲明。使用套件管理器安裝時，license 通常已在套件中；自行挑出 SVG 交付給客戶時，仍應保存來源與版本。
來源：Lucide License（查證 2026-08-02）
4. Tabler Icons：大型 SVG 圖示庫，搜尋與客製方便
Tabler Icons 官方頁標示超過 6,150 個免費 SVG 圖示，能調整大小、線寬與顏色，也提供多種框架套件。題材涵蓋介面、商務、裝置與內容類型，適合功能較多的網站或後台。
圖示採 MIT License，可用於個人與商業專案。大量使用時建議透過套件按需載入，不要為了幾個圖示把整套字型或 JavaScript 全部送到每一頁。
來源：Tabler Icons 官方網站與 License（數量與條款查證 2026-08-02）
5. Bootstrap Icons：不使用 Bootstrap 也能單獨用
Bootstrap Icons 是 Bootstrap 官方開源圖示庫，但不要求網站一定採用 Bootstrap。你可以下載單一 SVG，使用 SVG sprite，或載入圖示字型，適合 WordPress、一般企業網站與管理介面。
官方專案採 MIT License。對只需要少量圖示的網站，直接內嵌或上傳幾個 SVG 往往比載入整套字型更精簡；對大量重複使用的介面，sprite 或套件會比較好維護。
來源：Bootstrap Icons 官方網站；Bootstrap Icons MIT License（查證 2026-08-02）
6. Remix Icon：同時有線框與填色版本
Remix Icon 的圖示多半同時提供 line 與 fill 版本，方便用「未選取／已選取」建立介面狀態。它也提供 SVG、PNG 與圖示字型，適合導覽列、按鈕與行動版介面。
要注意的是，Remix Icon 已在 2026 年改用 Remix Icon License v1.0，不能再沿用舊文章常見的 Apache 2.0 說法。現行條款允許個人與商業使用及修改，署名為選擇性，但禁止把圖示本身當作圖示庫或單獨商品販售，也對 Logo 與商標用途另有限制。
來源：Remix Icon License v1.0（查證 2026-08-02）
7. Phosphor Icons：多種粗細適合建立層級
Phosphor Icons 提供同一圖示的多種粗細與填色版本。你可以讓主要操作用較重的圖示，次要提示用較輕的圖示，但不要在同一區塊隨意混搭，否則畫面會失去一致性。
Phosphor 核心圖示採 MIT License，支援 SVG 與多種程式套件。它適合需要較多視覺層級的產品頁、App 與儀表板。
來源：Phosphor Icons MIT License（查證 2026-08-02）
8. Iconoir：乾淨的開源線性圖示
Iconoir 是 MIT 授權的開源圖示庫，官方 repository 標示超過 1,600 個圖示，提供 SVG 與多種框架套件。風格較簡潔，適合編輯器、作品集與現代產品介面。
如果團隊已經決定採用 Iconoir，應把圖示名稱與用途寫進設計系統，避免每個頁面都重新搜尋一個相似但筆畫不同的版本。
來源：Iconoir 官方 repository 與 MIT License（數量與條款查證 2026-08-02）
9. Simple Icons：找品牌圖示很方便，但商標要另外查
Simple Icons 專門整理品牌與服務圖示，適合社群連結、技術堆疊與合作平台標示。整個專案以 CC0 發布，但這不代表清單裡每個品牌標誌都沒有商標或品牌使用規範。
官方 disclaimer 明確提醒，個別圖示可能有自己的授權與使用指南。使用 Facebook、Apple、Google 等品牌標誌時，要再查看該品牌官方規範，不要任意改比例、顏色或暗示合作關係。
來源：Simple Icons License；Simple Icons Disclaimer（查證 2026-08-02）
10. iconmonstr：快速下載單色 SVG 與 PNG
iconmonstr 適合臨時需要單色圖示，又不想安裝套件的使用者。搜尋後可以下載 SVG 或 PNG，也能在網站上先調整尺寸與顏色。
官方授權允許免費商用，允許修改且不要求署名，但禁止轉售或重新散布圖示本身，也不能把圖示拿來註冊 Logo 或商標。頁面上的品牌標誌仍可能涉及第三方權利。
來源：iconmonstr License（查證 2026-08-02）
5 個免費方案需署名、付費或逐張確認授權的平台
11. Icons8：多風格資源，免費方案通常要放連結
Icons8 的優點是風格、主題與檔案類型多，適合需要圖示、插圖與其他視覺素材的團隊。免費授權不是完全免條件，網站使用通常需要在使用內容的頁面或適當位置提供 Icons8 連結。
付費方案可移除署名並解鎖更多格式與尺寸。接客戶案時，應先確認署名能否保留到正式上線；若客戶不接受頁尾來源，應改用付費授權或其他圖庫。
來源：Icons8 License（查證 2026-08-02）
12. Flaticon：主題非常多，免費使用要署名
Flaticon 適合找產業、節慶、商務與特殊情境圖示，也能下載 PNG、SVG、EPS 與 CSS 等格式。它的優勢是題材多，風險則是使用者容易只看到免費下載按鈕，漏掉正式專案裡的署名要求。
2026 年 4 月版官方條款說明，免費使用 Flaticon Content 必須依平台當時指定方式標示網站／公司與作者；購買 Premium 並在訂閱有效期間下載的內容，才能依條款免除該署名。標示 Editorial Use 的內容不能拿去推廣商品或服務。
來源：Flaticon Terms of Use，8.1 Flaticon License（2026-04 版，查證 2026-08-02）
13. Noun Project：用概念找圖很強，免費 CC 圖示要署名
Noun Project 很適合用名詞或抽象概念搜尋圖示。官方條款表示，圖示可能是 Public Domain、CC BY 3.0，或付費 Royalty-Free License；使用者要以單一圖示標示的授權為準。
免費 CC BY 圖示可以使用，但必須署名作者。官方價格頁也把免費方案列為 Attribution Required；付費單張或訂閱授權則可在符合條款下商用且不必署名。
來源：Noun Project Terms of Use；Noun Project Pricing and Licenses（查證 2026-08-02）
14. Font Awesome Free：SVG、字型與程式碼不是同一套授權
Font Awesome 是常見的網站圖示方案，適合需要前端套件、圖示字型與一致 API 的專案。Free 版本可用於商業與開源專案，但要注意檔案類型對應不同授權。
官方 repository 說明，SVG 與 JS 圖示採 CC BY 4.0，字型採 SIL OFL 1.1，程式碼採 MIT。官方正常下載檔已內嵌足夠的署名註解，通常不需要額外在畫面上加字，但不應主動移除這些註解。
來源：Font Awesome Free License（7.x branch，查證 2026-08-02）
15. SVG Repo：搜尋方便，但不能用平台名稱推論全部授權
SVG Repo 聚合多種開放授權圖示，能搜尋，改色並下載 SVG 或 PNG。平台預設 SVG Repo License 的內容不強制署名，可改作並用於商業專案的一部分，但不能原樣轉售或做成同類型圖庫。
更重要的是，SVG Repo 同時收錄 Public Domain、MIT、GPL、Apache、Creative Commons 與 Logo License 等內容。官方說明以單一圖示頁標示為準，因此不能看到 SVG Repo 就直接判斷免署名商用。
來源：SVG Repo Licensing（查證 2026-08-02）
SVG、PNG 與圖示字型怎麼選？
| 格式 | 優點 | 限制 | 適合使用 |
|---|---|---|---|
| SVG | 縮放清楚，常可用 CSS 改色，檔案通常精簡 | 來源不明的 SVG 可能含不需要的程式或標記 | Logo 以外的網站介面圖示、按鈕、功能說明 |
| PNG | 瀏覽器相容直覺，內容固定，不會執行腳本 | 放大會模糊，不同尺寸常要另存檔 | 有複雜顏色、陰影或系統不支援 SVG 的情境 |
| 圖示字型 | 大量圖示可用 CSS 統一控制 | 可能載入未使用字形，無障礙與載入失敗要另處理 | 既有系統已大量依賴同一套字型 |
| SVG sprite | 可集中管理多個 SVG，重複使用方便 | 建置與引用流程較複雜 | 產品介面與大型網站設計系統 |
一般內容網站只用十幾個功能圖示時，優先選經過清理的 SVG。它能保持銳利，也不必下載整套圖示字型。上傳第三方 SVG 前，要確認來源可信並移除不必要的 metadata、script 與外部引用；WordPress 若沒有允許 SVG，上傳前也要先採用安全的處理方式。
網站使用 Free Icon 的四個實務原則
1. 同一區塊只用同一套視覺語言
圖示功能正確，風格不一致仍會讓網站顯得零碎。先固定線框或填色、圓角或銳角、線寬與基準尺寸，再決定主要與次要狀態。不要在同一排功能卡混用三個圖庫。
2. 圖示不能取代必要文字
放大鏡、選單與關閉符號較容易理解，產業或抽象概念則不一定。重要按鈕應搭配文字標籤，不能只靠使用者猜圖。若圖示本身就是按鈕，互動元素也要有可存取名稱。
3. 裝飾圖示不要讓螢幕閱讀器重複朗讀
旁邊已經有相同文字的裝飾圖片，可使用空的 alt 屬性；純裝飾 inline SVG 可用 aria-hidden="true" 隱藏。若圖示傳達文字沒有說出的資訊，就要提供清楚的替代文字或按鈕名稱。
4. 只載入真的會用到的圖示
為了四個圖示載入整套字型、CSS 與 JavaScript，可能增加網頁請求和未使用資源。可優先下載單一 SVG，使用按需載入的套件，或建立小型 sprite。完成後再用瀏覽器開發者工具與 PageSpeed Insights 檢查實際傳輸量。
免費 Icon 下載前檢查表
- 記下圖示名稱、作者、來源網址、下載日期與授權版本。
- 確認正式用途是個人、商業、客戶交付，還是可轉售商品。
- 查看單一圖示或套件的 license，不只看搜尋結果標題。
- 需要署名時，先確認上線頁面能保留作者與授權連結。
- 使用品牌圖示前，再查品牌官方 Logo 與商標指南。
- 修改、轉售或放入模板前，另外確認衍生作品與再散布條款。
- 保存原始 license 檔與下載紀錄，避免日後無法追溯。
如果是長期營運的公司網站，可以建立一份素材登記表。每次更換圖示時同步記錄來源與授權，會比上線半年後再逐頁追查可靠。
內文精華總結
- Free Icon 只代表免費取得的可能性，不代表一定免署名或可任意商用。
- 網站介面可先從 Heroicons、Lucide、Tabler Icons 等開源圖示庫開始。
- Flaticon、Noun Project 與 Icons8 的免費方案要特別確認署名方式。
- SVG Repo 與品牌圖示平台要查看單一圖示的授權與商標規範。
- 少量網站圖示通常適合用清理過的 SVG，並兼顧替代文字、載入量與視覺一致性。
網站設計延伸閱讀
想把圖示、配色與內容做成一致的正式網站？
找到圖示只是視覺系統的一小步。正式網站還要一起處理版面、字體、配色、手機版、速度、SEO 與後續維護。秒站已整理常見建站基礎，讓你可以從內容與品牌開始調整。
想確認你的圖示與頁面是否適合目前品牌？可用 LINE 聯絡 @site-now。
重點整理
免費 Icon 可以商用嗎？
要看單一圖示或套件的授權，不能只看平台寫著免費。MIT、ISC、Apache 與部分平台自有授權通常允許商用，但可能要求保留版權或授權聲明；CC BY 與不少免費方案則要求署名。品牌 Logo 還可能受商標與品牌規範限制。正式使用前要記錄來源、下載日期與當時的授權版本。
Free Icon 下載後一定要署名嗎？
不一定。Flaticon 免費授權、Noun Project 的免費 CC BY 圖示，以及 Icons8 免費方案通常需要依官方方式署名。iconmonstr 與 SVG Repo 預設授權的部分內容不強制署名；MIT 與 ISC 等開源套件通常要保留檔案或散布內容中的授權聲明，而不是在每個圖示旁顯示來源。
Flaticon 免費版可以商用嗎？
依 Flaticon 2026 年 4 月版官方條款，免費使用 Flaticon Content 時，必須依平台當時指定方式標示平台或公司與作者。標示 Editorial Use 的內容不能用來推廣商品或服務。若正式專案無法保留署名，應購買符合用途的授權，並再次確認下載當下條款。
SVG 和 PNG 圖示哪一種比較適合網站？
一般介面圖示通常優先選 SVG，因為縮放清楚，常能用 CSS 改色，而且少量圖示的檔案可很精簡。PNG 適合複雜色彩、陰影，或系統不支援 SVG 的情境。第三方 SVG 要來自可信來源，並清理不必要的 script、外部引用與 metadata。
免費 Icon 可以改顏色或線條嗎？
要看授權是否允許修改。多數 MIT、ISC、Apache 與部分平台自有授權允許改作，但可能要保留聲明，也可能禁止把修改後圖示當成獨立商品或圖示庫轉售。品牌標誌不要因為檔案可編輯就任意變色或變形，還要遵守品牌官方商標指南。
網站圖示尺寸應該用多大？
常見介面可先以 16、20、24 或 32 px 的設計格建立規則，再依按鈕與版面調整；重點不是單一標準答案，而是同一區塊的基準尺寸、線寬和留白一致。觸控按鈕還要保留足夠可點擊範圍，不能把可點區域縮成圖示本身。
如何確認單一圖示的授權？
先開啟單一圖示頁或官方 repository，找到 license 名稱與連結，再確認商用、署名、修改、再散布與轉售條件。接著檢查是否為品牌 Logo 或 Editorial Use，保存頁面網址、作者、下載日期、授權檔與版本。SVG Repo 與 Noun Project 等聚合平台尤其要逐張確認。
Free Icon 放進網站後如何兼顧速度與無障礙？
少量圖示可優先用清理過的單一 SVG，避免為幾個圖示載入整套字型與 JavaScript。裝飾圖示可用空 alt 或 aria-hidden，重要操作則要有清楚的文字或可存取名稱。上線後再用瀏覽器開發者工具與 PageSpeed Insights 檢查傳輸量、未使用資源和版面顯示。
