
重點整理
IconStore 的圖示都由設計師繪製,可用於商業用途且不必標註連結,但著作權仍屬作者,未經書面同意不得重新散布。進站後可依分類搜尋,並用 Colored、Glyph、Outline 篩選風格,點選圖示組即可下載。授權細節以官網說明為準。
網頁素材分享不論是網頁設計還是現在的簡報版面設計趨勢,你可能很常會聽到或是使用Icon 這個英文詞彙,但你知道 Icon 的意思是什麼嗎?
具有美感及意義的 Icon 是需要花時間構思及設計的,現在也有許多免費 Icon分享網站能直接使用,但是能免費使用的 Icon 視覺品質卻是參差不齊,有的也無法商用,今天鵠學苑要來介紹 Icon 免費下載 IconStore 網站,裡面所有的 Icon 是設計師繪製,所以視覺品質非常好,也能作為商業用途使用,不用著名連結,但是要注意的是著作權不能歸自己,未經作者書面同意,不得重新分發。現在,讓我們一起來認識 IconStore 吧!
IconStore 網站介紹
在設計中, Icon 指的是帶有意義與指示性的『圖標』,藉由簡單的圖像繪製讓使用者更了解文字或是使用內容,方便使用者對於內文、功能做一個辨識。在網站設計與簡報編排中,透過 Icon 的規劃,可以使原本單調的文字區塊視覺化,瀏覽者不會直接面對一大堆的內文,重點式的規劃搭配圖像降低瀏覽者對於大量文字的不耐煩,甚至能有耐心的閱讀內容,達成製作網站或是簡報的目的。例如 鵠崙設計 官網的頁面就使用大量的 Icon 規劃,將 WordPress 優勢重點清楚呈現,一目瞭然,更多的 Icon 使用範例與規劃可以上 客戶案例 來看看。



IconStore 網站使用方式
第一步:進到 IconStore 頁面後,左上角有搜尋功能,能查找關鍵字, Categories 點開後,會出現所有 Icon 的種類,可以點選自己所需要的分類。
Fillter 篩選風格:
- Colored – 有顏色、上色風格的 Icon
- Glyph – 單色風格的 Icon
- Outline – 有外框設計的 Icon

第二步:下方右邊選單可以選擇排序方式,例如上架時間或是受歡迎程度。左方的篩選功能可以依照自己想要的風格篩選。可以先選擇左上種類再進行篩選,會更快找到你所需要的 Icon 。

第三步:下方更多按鈕底點選後可展示更多 Icon 。

第四步:將滑鼠移到縮圖上,會出現此組 Icon 的簡易說明。

第五步:點選你要的 Icon 後,左邊圖片會顯示此組所有的 Icon 設計,藍色的Download 按鈕點選會立即下載,下載按鈕下方則顯示此組 Icon 的資訊,例如上傳日期、Icon尺寸與數量、檔案類型與下載次數。

第六步:右邊則是顯示設計者的資訊,若是你很喜歡這位設計者的風格,可以點選他的頭貼與名字,看看設計者其他種類的Icon;清單頁也可以直接點選設計者頭貼。


下載的 icon 怎麼放進 WordPress 網站?
- 當圖片上傳:PNG 可以直接上傳到媒體庫使用。WordPress 預設不允許上傳 SVG,因為 SVG 可以夾帶程式碼,需要用專門處理 SVG 安全過濾的外掛才能上傳。
- 用頁面編輯器的圖示功能:Elementor 等編輯器的圖示小工具支援上傳 SVG 圖示,可以直接改顏色和大小。
- 統一風格:同一頁的圖示盡量來自同一組,線條粗細與圓角一致,畫面才不會雜亂。
圖示是輔助說明,旁邊仍要有文字,讀者和搜尋引擎才看得懂這個區塊在講什麼。
常見問題
IconStore 的圖示可以商用嗎?
可以,IconStore 說明圖示可用於個人與商業用途,也不必在網站上標註連結,但著作權仍屬原作者,未經書面同意不能重新散布或轉售。各組圖示的授權細節以官網與檔案內附的說明為準。
IconStore 下載的圖示是什麼格式?
每組圖示的格式不同,下載按鈕下方會列出檔案類型、尺寸與數量,常見的有 SVG、PNG 與設計軟體原始檔。放在網頁上優先使用 SVG,縮放不會失真,也方便用 CSS 改顏色。
找不到需要的 icon 時還有哪些免費圖示網站?
IconStore 的數量不算多,找不到時可以改用 Flaticon、Google 的 Material Symbols、Font Awesome 免費版等圖示庫。每個網站的授權條件不同,有些免費圖示要求標註出處,下載前先確認。
結語
相較於其他免費下載 Icon 的網站,IconStore的選擇可能較少與更新速度較慢,但是好的視覺品質是這個網站的一大優點,而且更重要的是不必在程式碼中埋入網址,是快速開發者的一大福音。不只是網頁設計,許多平面的編排如簡報、傳單設計也能使用 Icon 來重點化資訊與豐富視覺。
