Evil Icons 簡約風格免費圖示，開放原始碼 SVG、AI 及 Sketch 三格式下載

一般在開發專案或應用程式時會用到圖示集，不但能提升介面質感，也能讓使用者更容易學習使用，其實網路上也已有不少免費圖示素材可以下載、使用在自己的專案上，節省重新設計或繪製時間預算，當然要找到能夠搭配的圖案可能不是那麼容易，我傾向介紹一些較為簡單、線條乾淨的圖示組，這會更適合整合到各種設計風格。

Evil Icons 是我最近發現的免費圖示集，這是一套簡單、乾淨 SVG 圖示，開放原始碼，對於開發者來說只要幾行程式碼就能輕鬆調用，支援 Rails、Sprockets、Node.js、Gulp、Grunt 和 CDN，如果你想要自己稍作修改或重新設計，Evil Icons 還提供 SVG、AI 及 Sketch 圖示格式下載。

最快速套用 Evil Icons 至網站的作法是直接使用 CDN 也就是 jsDelivr 的 Evil Icons，只要將兩行程式碼插入網站（分別是最小化後的 CSS 和 JS），就能透過 CSS 來調用圖示或調整顏色尺寸。

Evil Icons 收錄的圖案總數有 70 個，三種圖示大小，線條簡單乾淨。

網站名稱：Evil Icons
網站鏈結：https://evil-icons.io/

使用教學

STEP 1

開啟 Evil Icons 網站後，可以看到所有圖示的預覽及代碼，這套圖示集是 SVG 格式，有 70 種不同圖案設計，其實都是蠻容易用到的圖案，在社群圖示部分也有台灣很多人使用的 Facebook、Google+ 和 Instagram。

如果想預覽不同的大小尺寸呈現效果，可點選左上角的 S、M 和 L 來切換，圖示大小看起來有完全不同的感覺，也能運用在不同位置。

STEP 2

如果你想要打包下載整套 Evil Icons 圖示，點選網頁上方的「Download」就會有下載選項，分別提供四種格式：SVG、Illustrator CC 及 Illustrator CS 適用的 AI 格式及 Sketch。

STEP 3

因為 Evil Icons 屬於開放原始碼專案，可以在 GitHub 頁面找到更多詳細使用說明，其中我認為將圖示套用到網頁設計最快的方法就是利用 CDN 服務（jsDelivr），只要在網頁載入兩段程式碼，就能依照下方的範例來顯示圖示，非常好用。

其他更多將 Evil Icons 套用到你當前開發專案的用法，除了從 GitHub 找到，也能自己把圖示下載下來研究一下，應該不會太難，這套圖示是由 Evil Martians 公司的兩位成員設計製作，以 MIT License 授權釋出。

想在 Google 搜尋優先看到免費資源網的內容？

加入 Google 偏好來源