如果你在製作專案或開發網站、應用程式需要用到圖示,網路上有非常多免費圖示可供下載選擇,通常只需要找到合適的設計風格,稍微研究一下授權方式就能使用,不需要自己重新開發一套圖示,特別是一些線條較為簡單、精簡的圖案設計很適合使用在各種情境,例如修改自 Font Awesome 的 Line Awesome、具完整自訂性的 Ikonate、手工打造的高品質圖示集 Zwicon 和 Feather Icons、Octicons 等等。
本文要推薦的「iconmonstr」是一個以簡單線條構成的免費圖示集,收錄超過 4496 個圖案!值得一提的是這個圖示集是單一創作者維護,而且還在不斷成長中。iconmonstr 各種圖案都很獨特,風格則有填充、粗線條或是僅帶有邊框,使用者可以下載各種檔案格式,包括 SVG
、EPS
、PSD
和 PNG
,也能產生嵌入 SVG Inline 或 Base64 原始碼。
iconmonstr 所有圖示皆可免費使用於個人和商業用途,不過受限於授權規範,不提供一次下載所有圖案,除此之外,iconmonstr 還有提供一套圖示字型「Iconic Font」,有超過 300 個小型免費圖示,很適合使用於網頁或介面開發。
iconmonstr
https://iconmonstr.com/
使用教學
STEP 1
開啟 iconmonstr 網站會看到最近新加入的圖示,可以發現每個圖案都有兩個或三個風格版本,像是填滿或僅有外框的圖案,從上方 Fill/Bold 和 Thin 切換特定風格,查找特定分類可透過搜尋功能輸入關鍵字,或是點選「Collections」查看完整分類。
STEP 2
iconmonstr 圖示設計主要分成兩種,一種是填滿、邊框較粗的 Fill / Bold 圖示,目前總數大約有 4200 多個。
另一種是線條較細、中間留空的 Thin 圖示,總數有 200 多個,應該是後來開發的圖案才有加入這種效果,相較之下比較輕量化的感覺,前者看起來比較重。
STEP 3
如果你想找特定類別的圖示,從首頁點選「Collections」也能依照分類尋找。
STEP 4
點選圖示進入下載頁面,會看到各種常用或常見圖片格式,例如 SVG
、EPS
、PSD
或 PNG
等等,有些圖案還會提供圖示字型,勾選同意授權條款後按下「Download」就能取得圖示檔案。如果要取得 SVG 或 Base64 原始碼可按下「」嵌入按鈕,會得到相關的原始碼。
要注意的是如果你有使用阻擋廣告 Adblock 擴充功能或軟體,網站會要求停用 Adblock 以支持這項服務,否則會無法取得圖示,記得先把外掛停掉才能正常下載。
若你要下載的是 PNG 圖片格式,iconmonstr 也有線上編輯器可以快速調整大小、縮放、顏色、底色或是外框樣式,也能測試在白色或深色背景下顯示效果。
值得一試的三個理由:
- 以簡單線條構成的免費圖示,收錄超過 4000 種圖案
- 提供 SVG、EPS、PSD、PNG 和內嵌原始碼等各種格式
- 可免費使用於個人和商業用途