【Free Icon】15 個免費 Icon 圖示網站,支援 PNG、SVG 格式(可商用)

【Free Icon】15 個免費 Icon 圖示網站,支援 PNG、SVG 格式(可商用)

在進行網頁設計或是 Logo 設計 時,建議可以搭配 Icons 來輔助文字,整體呈現就會變得更豐富!

現在有許多 Icon 圖示網站,可以免費下載 PNG、JPG、SVG 等格式的 Icon 圖標,還能免費商用。更多 圖檔格式介紹

今天我們精選了 15 個免費 Icon 圖示網站,圖示都設計得非常精緻,數量也很多,讓你挑不完!那麼就開始吧:)


Flaticon

Flaticon 是 Freepik 旗下,專門提供 icon 圖示資源網站

Flaticon 是 Freepik 旗下,專門提供免費 Icon 圖示(圖標)的線上網站。

網站中有眾多 Icon 圖示包可供站長選擇,除了能單一款下載,也能直接下載同類型的一整包 Icon,讓站長不用再尋尋覓覓。

除此之外,你還能自由編輯 Icon 顏色&調整下載尺寸,是個很貼心的功能。

不過須特別注意,Flaticon 有自己的 版權規則會需要「 標註圖源出處 」才可免費使用,或者也可付費購買會員,即可享有免標記出處的權限。

如果你有大量的 Icon 圖標、圖示的需求,使用 Flaticon 相信會有所收穫!

Freepik 也有在 Figma 推出 Flaticon 外掛,可自由改變 Icons 元素的顏色、大小用於設計中。免費版一天可插入 10 個 Icons,大家可多多利用唷:)


Iconoir

Iconoir Icons 網站

Iconoir 是一款高品質開源 Icons 素材網站,不需登入帳號就能免費下載 Icon 圖示,並可用於商業用途。

網站有超過千種 Icons 選擇,你可以自行調整圖示的大小、粗細、顏色等..,調整完畢後就可以一鍵複製 SVG 代碼,或是下載 SVG 檔案。

在 Iconoir 上可以找到多種特別的圖標樣式,不論是表情符號、風景 Icons、社群媒體 Icons,各種主題都有,還可以直接透過關鍵字搜尋,非常方便。

Iconoir 上的 Icons 都是 SVG 格式,讓你不管怎麼縮放,圖標都不失真!


Icons8

Icons8 3D 素材資源

Icons8 是一款國外知名的 Icons 素材網站,網站上有高達百萬種免費 Icons 、圖片可以下載,也包含了免費 3D Icons。

Icons8 的 3D 素材風格較多元,除了一般的 3D 樣式外,還有黏土材質的 3D 素材,非常可愛有趣。

Icons8 3D 素材

Icons8 提供 PNG、SVG 兩種檔案下載格式,此外,也能直接透過複製貼上,將素材加入設計檔內。

若你是想將 3D 素材加到網頁中,也能直接複製 HTML code,貼到網站程式碼中,不需下載超方便!

Icons8 也有推出 Figma 外掛,讓你可以直接在 Figma 專案內使用素材,推薦給使用 Figma 設計的朋友!


IconScout

IconScout 3D 素材資源

IconScout 是國外知名的素材網站,網站上提供超過百萬種素材資源,包含插圖、動畫、3D Icons 等..。

IconScout 上的 3D Icons 就多達二十幾萬種,有免費及需要付費的樣式,下載前需注意。

IconScout 提供人物角色、電商插畫、Emoji、幾何圖形等..多種樣式的 3D 素材,同類型的素材還會整理在一個素材包內,讓你一次下載整套的 3D Icons 超方便!

IconScout 3D 素材包,一次下載多個素材

IconScout 還有一個很方便的功能,就是可以直接複製 3D 素材,然後貼在你的設計上,不需下載到電腦上佔用空間,對設計者來說是個很方便的功能,也是免費就能使用,大家可以試試看唷:)

IconScout 也有 Figma 外掛,免費版有使用數量的限制,稍微可惜了一點。

但 IconScout Figma 外掛可選擇插入 PNG 或 SVG 圖示,還能搭配 Lottie 動畫呈現,滿實用的!有興趣的朋友可參考看看囉!更多 Lottie 是什麼


TW Icon Fonts

TW Icon Fonts 台灣旅遊特色 Icons 網站

TW Icon Fonts 是一款以台灣旅遊景點做發想的開源 Icons 網站,由兩位住在台灣的日本人和英國人開發,創作目的是為了將台灣的魅力,分享給世界所有人。

網站上可以找到各種台灣旅遊相關 Icons,像是 101 大樓、天燈、珍珠奶茶等..,各種可以代表台灣的可愛圖示。

由於創作目的是為了推廣台灣,所以網站上的所有 Icons 都不需付費,可以免費使用於個人、商業創作,甚至還能重製。

網站開發者也持續在更新、推出更多服務,若你正在製作台灣相關的設計,非常推薦使用唷:)


IconStore

IconStore 擁有眾多風格且優質的 icon 圖示資源包

IconStore 是免費優質的圖示搜集網站,有蠻多不同風格的 CC0 圖示,大多偏向線條簡約風,適用於各種類型的網站。

使用者無須擁有帳戶,即可免費下載,當然也可申請帳戶,自由投稿你製作的 icon 圖示包。

如果需要將圖示用於品牌核心設計(例如:Logo)就需要徵求作者同意。更多 版權規則 參考。

至於其他用途(像是放置於主選單、網頁平面設計等 .. ),只要是在合理使用的範圍,站長們都可以放心使用唷!


Boxicons

Boxicons Icons 網站

Boxicons 是一款專為網頁設計的 Icons,網站上除了提供 PNG 檔案下載,還能直接複製 HTML 程式碼,貼到你的網站程式碼中。

Boxicons 的 Icons 都可以自由變更顏色,還可以旋轉圖示、加入動態效果,調整完後就能輕鬆複製 HTML 程式碼。

Boxicons 目前有超過一千多種 Icons 選擇,包含網站常用功能(首頁、搜尋、購物車等)、知名企業 Logo、表情、食物等..,應有盡有,大家可以自行前往查看:)


Noun Project

Noun Project Icons 素材網站

Noun Project 是一款強大的 Icons 網站,有超過百萬個 Icons,由來自世界各地的設計師所創作。

Noun Project 提供 PNG 及 SVG 兩種檔案下載。除了 Icons 外,Noun Project 也提供高品質的照片素材,方便你一站就將素材找齊!

Noun Project 提供免費版本,不過免費版會需要標註圖源出處!或是可考慮付費升級,就不用特別標註,還能調整編輯 Icons 樣式,有需要的朋友再參考就可以囉。


UXWing

UXWing Icons 素材網站

UXWing 是一款由專業設計師推出的 Icons 素材網站,提供高品質的 PNG、SVG 檔案,且可免費商用,不需標註出處。

網站上的 Icons 偏圓滑可愛,還有社群媒體 Icons 可下載,同一款 Icons 還有多種配色設計可選擇。

雖然 UXWing 的素材可以免費商用,但不能使用於公司 Logo 設計,使用前可以先查看 相關規定 唷。


Pngtree

Pngtree Icons 素材網站

Pngtree 是一款國外素材網站,在這裡可以找到高品質的照片、插圖、Icons 等..素材,還有社群貼文模板。

Pngtree 上的素材風格多元,有色彩豐富的 Icons,也有 3D 圖標可以下載,和 Freepik 一樣,都是由不同的設計師上傳分享。

Pngtree 有提供免費版但限制較多,除了需要標註圖源出處外,免費版一天限定只能下載一次素材,升級付費版則不限下載次數,大家可以自行評估看看囉!


Material Symbols

Google Material Symbols

Material Symbols 是一款由 Google 推出的 Icons,和 Google Fonts 一樣,可以下載檔案或是直接複製程式碼放到網站中。

Material Symbols 目前有超過三千多種 Icons,每種圖示也有 3 ~ 4 種不同的樣式,你也能自行調整線條的粗細、大小等..。

Material Symbols 還有推出 Figma 外掛,若你是習慣使用 Figma 設計的朋友,可以搭配使用唷!更多 Figma 中文教學


Feather

Feather Icons 素材網站

Feather 是一款簡單的 Icons 分享網站,提供上百種開源 Icons 圖示,可免費下載使用。

你可以在網站上客製 Icons 粗細、顏色、大小,只要調整一次,就能同步套用到所有 Icons,非常方便瀏覽。

點選喜歡的 Icons 就可以直接下載 SVG 檔案,算是滿方便的一款素材網站。

Feather Icons 也有推出 Figma 外掛,同樣可以免費下載使用,找到喜歡的 Icons,點擊就能輕鬆插入設計,推薦大家多多利用!


Freepik

Freepik 優質素材圖庫,提供大量照片、插圖、Icons 等素材

Freepik 是一款國外知名且優質的素材圖庫,提供向量圖、照片、PSD 文件、Icons、背景圖等 .. 大量素材。

它有提供每日一定數量的免費下載,但需要標記作者以及網站名稱,才能夠合理使用。

Freepik 以向量圖為最主要的特色,以英文關鍵字下去搜尋,幾乎都會有豐富的資源,可供站長在設計時發揮使用。

如果你有大量的向量素材使用需求,Freepik 也有提供會員制,可享有不限數量的全網站素材下載,而且不用標記作者名稱。可前往 Freepik 方案 了解更多。

Freepik 近期也搭上 AI 熱潮,推出 AI 生成圖片功能,可免費使用,大家可以試試看囉:)

此外,強大的圖庫網站 Freepik 還有推出免費的 Figma 外掛,可輕鬆搜尋並插入圖片於設計中,也可透過顏色分類篩選照片,或隨機插入高品質照片,推薦給大家!


Font Awesome

Font Awesome Icons 素材網站

Font Awesome 是一款專業設計師推出的網頁 Icons 素材網,有上萬個 Icons 圖標,多種樣式可選擇。

Font Awesome 提供免費版本,免費版可使用兩千多種 Icons,你可以在網站上客製 Icons 顏色,還能加上動態效果。

調整完畢後,可以選擇複製 HTML、SVG 代碼,或是下載 SVG 檔到電腦上,不論是網頁或是平面設計都適合,推薦給大家!


3D ICONS

3D ICONS 素材資源

3D ICONS 是一個提供多種開源 3D 素材的網站,不需付任何費用,就能將 3D 素材使用在個人或是商業專案內。

網站目前提供多種樣式的 3D Icons 素材,質感都非常不錯,且都是 CC0 開源素材,代表下載素材後,你可以再自行改作、調整素材樣式。

3D ICONS 上的素材有四種配色風格,有繽紛配色、漸層配色、全白配色或是質感的黑金配色,讓你自由選擇。

3D ICONS 多款質感 3D Icons

3D ICONS 也推出了 Figma 外掛,同樣是免費就能使用,你可以輕鬆在 Figma 上加入各種配色的 3D Icons,還能選擇不同角度樣式!推薦給大家!

好啦,以上就是今天的分享,希望你有收穫滿滿唷:)


常見問題

什麼是開源素材?

開源素材代表該作品可免費商業使用,且不用標記圖源,但還是需會有相關規定需要注意,建議下載前要先仔細閱讀網站規定唷!

下載免費 Icons 需要注意什麼?

建議下載前要先仔細閱讀相關規定,部分免費素材雖然可以免費下載,但可能會需要標註圖源出處或是有使用限制等..,需要注意。

建議使用什麼格式作為 Icons 檔案格式呢?

因為 Icons 有時會需要配合設計主體去放大或縮小,建議可下載 PNG 或是 SVG 檔,這樣放大縮小 Icons 就不會有失真的問題囉! 


WordPress 學習資源

學習 WordPress 網站架設流程中,或許會遇到一些解決不了問題,可以在下方留言給我,我會盡力協助解答!

接下來,額外分享 3 項架站資源,可有效幫助大家處理網站問題。

資源一:WP 高手架站課(線上課程)

這門 WordPress 高手架站課 濃縮了犬哥多年在網頁設計的實戰經驗,從網頁設計觀念、WordPress / WooCommerce 後台操作、熱門主題.外掛教學、品牌網站 / 部落格 / 電商網站,3 大類型網站建置方法等 .. 豐富內容,一次教會你。

課程內容非常的紮實(長度超過 20 小時)。如果你剛學習自架網站,這門課程可以讓你用最快的速度,就學會這項技能!

幫你增加網路曝光,提高你的線上營收!

WordPress 高手架站課|一堂課讓你變架站高手!

資源二:犬哥數位(專業 WordPress 網頁設計公司)

如果你沒時間自己架站、或是遇到解決不了的網站問題。歡迎洽詢 犬哥數位(WordPress 網頁設計公司),請專家製作會更有效率!

WordPress 網頁設計公司|犬哥數位

資源三:更多犬哥教學資源

如果你在操作過程中遇到問題,可以加入 流量研究室 – 犬哥網站(目前有超過 9000+ 團員)。除了有網友一同幫你解惑外,犬哥團隊也會同步在社團幫助大家。

加入 FB 犬哥社團
加入 FB 犬哥社團(目前有超過 9000+ 團員)

另外這是送給剛起步經營自媒體的朋友們,不論是經營網站、各類社群等都適用,立即加入 Line 群 免費領取「 神級自媒體起號工具包 」。

如果你想學更多品牌設計、社群行銷知識,也歡迎追蹤 犬哥網站 IG。或是喜歡看影片學習,可關注 YouTube 頻道

關於作者

犬哥網站:網頁設計 x 網路行銷教學平台

犬哥網站

我們分享 WordPress 架站 x 網路行銷知識,不需會任何程式技術,就能自己建立各種網站。 搭配豐富的網路行銷教學,幫助你被更多人看到。 趕快跟著我們的腳步,開始學習吧:)

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

返回頂端