iconmonstr 超過 4000 個免費圖示 SVG、EPS、PSD 和 PNG 格式下載

最後更新於 2020 年 07 月 07 日

如果你在製作專案或開發網站、應用程式需要用到圖示,網路上有非常多免費圖示可供下載選擇,通常只需要找到合適的設計風格,稍微研究一下授權方式就能使用,不需要自己重新開發一套圖示,特別是一些線條較為簡單、精簡的圖案設計很適合使用在各種情境,例如修改自 Font Awesome 的 Line Awesome、具完整自訂性的 Ikonate、手工打造的高品質圖示集 ZwiconFeather IconsOcticons 等等。

本文要推薦的iconmonstr」是一個以簡單線條構成的免費圖示集,收錄超過 4496 個圖案!值得一提的是這個圖示集是單一創作者維護,而且還在不斷成長中。iconmonstr 各種圖案都很獨特,風格則有填充、粗線條或是僅帶有邊框,使用者可以下載各種檔案格式,包括 SVGEPSPSDPNG,也能產生嵌入 SVG Inline 或 Base64 原始碼。

iconmonstr 所有圖示皆可免費使用於個人和商業用途,不過受限於授權規範,不提供一次下載所有圖案,除此之外,iconmonstr 還有提供一套圖示字型「Iconic Font」,有超過 300 個小型免費圖示,很適合使用於網頁或介面開發。

iconmonstr
https://iconmonstr.com/

使用教學

STEP 1

開啟 iconmonstr 網站會看到最近新加入的圖示,可以發現每個圖案都有兩個或三個風格版本,像是填滿或僅有外框的圖案,從上方 Fill/BoldThin 切換特定風格,查找特定分類可透過搜尋功能輸入關鍵字,或是點選「Collections」查看完整分類。

STEP 2

iconmonstr 圖示設計主要分成兩種,一種是填滿、邊框較粗的 Fill / Bold 圖示,目前總數大約有 4200 多個。

另一種是線條較細、中間留空的 Thin 圖示,總數有 200 多個,應該是後來開發的圖案才有加入這種效果,相較之下比較輕量化的感覺,前者看起來比較重。

STEP 3

如果你想找特定類別的圖示,從首頁點選「Collections」也能依照分類尋找。

STEP 4

點選圖示進入下載頁面,會看到各種常用或常見圖片格式,例如 SVGEPSPSDPNG 等等,有些圖案還會提供圖示字型,勾選同意授權條款後按下「Download」就能取得圖示檔案。如果要取得 SVG 或 Base64 原始碼可按下「」嵌入按鈕,會得到相關的原始碼。

要注意的是如果你有使用阻擋廣告 Adblock 擴充功能或軟體,網站會要求停用 Adblock 以支持這項服務,否則會無法取得圖示,記得先把外掛停掉才能正常下載。

若你要下載的是 PNG 圖片格式,iconmonstr 也有線上編輯器可以快速調整大小、縮放、顏色、底色或是外框樣式,也能測試在白色或深色背景下顯示效果。

值得一試的三個理由:

  1. 以簡單線條構成的免費圖示,收錄超過 4000 種圖案
  2. 提供 SVG、EPS、PSD、PNG 和內嵌原始碼等各種格式
  3. 可免費使用於個人和商業用途

 

相關的文章

Line Awesome 超過 4000 個免費線稿圖示,修改自知名 Font Awesome

如果說到最知名的免費圖示字型(Icons Font),我想大家一定聽過 Font Awesome,這套圖示最初發佈於 2012 年,現今則由 1,544 個圖案組成,主要分為免費、開放原始碼和付費 Pro 圖示兩大類型,在使用 Font Scripts 網站中佔有 20% 市佔率,可以想見我們看到的很多圖案可能都是來自它。若要使用這套圖示,除了直接從官方網站或 GitHub 下載整套圖示集,亦可透過開放式內容傳遞網路提供的鏈結載入相關圖案。

Smart Upscaler 使用 AI 自動放大、增強圖片,不會出現模糊失真問題

現在透過機器學習(Machine Learning,簡稱 ML)技術可以更完美做到以前可能無法做到的事,例如線上去背工具能夠很快速分離出圖片裡的主體和背景,即使是非常細節都能在幾秒鐘內處理完成;還有之前介紹過的 Moises.ai 則是線上去除音樂裡的人聲部分,直接讓歌曲變成無人聲的伴奏版;比較特別的是 ColouriseSG 幫黑白老相片快速上色線上工具,能夠判斷照片的每個部分並進行適當著色,讓老照片得以重生。

useAnimations 免費動態圖示下載,可用於應用程式或網站介面開發

如果要開發應用程式或製作網站,我們通常會尋找適合的免費圖示,如此一來就能減少開發成本,也能更快製作出符合期待的介面,像是 Ikonate、Potlab Icons、Unicons 和 illustrio 都可以直接套用到使用者操作介面的圖示集,而且也具備一定程度的可自訂性,對於開發者來說是不可多得的資源。

Taiwan Icon Font 屬於台灣的免費圖示,收錄台北101、珍珠奶茶等圖案

愛台灣可以有很多表現方式,例如拍照上傳社群網站讓世界看到台灣的美,走訪各鄉鎮看看台灣大街小巷,雖然大家都很熱衷出國自助旅遊,但其實台灣也有不少很美麗、很有特色的地方,可惜假日出去總是人擠人,不在台灣還是會想念台灣美食。對於亞洲鄰近國家觀光客來說,他們也非常喜歡台灣,不少日本人很愛到台灣旅遊,都能拍出讓我覺得很不像台灣的相片。

JetBrains Mono 更適合閱讀程式碼的等寬字型,內建四種字重斜體可商用

這幾年不少大公司都把字型開放出來讓需要的使用者可以自由下載使用,例如微軟專為新的終端機程式設計的 Cascadia Code,美國政府在 USWDS(U.S. Web Design System)設計的 Public Sans,IBM 公司自行開發的 IBM Plex 字型,或是由 Red Hat 贊助以 Highway Gothic 為靈感設計的 Overpass Font 等等,這些字型都有非常高的品質,針對特定功能或需求而生,更重要的是授權方式清楚,使用時也不用擔心侵權等問題。

Snapfont 在網頁即時套用測試 Google Fonts 和本機字型顯示效果(Chrome 擴充功能)

對中文網頁來說,CSS 字型設定一直是個麻煩的問題,想直接載入字型檔案容量太大,拖慢網頁速度、耗費過多流量,通常會使用網頁字型解決,像是 Google Fonts 和 Adobe Fonts(以前叫作 Typekit)就有提供思源黑體和思源宋體等中文網頁字型,只要加入一段 JavaScript 程式碼並調整一下 CSS 樣式表就能使用,讓網頁的中文部分更易於閱讀,設計看起來也更有質感。

回應