[非程式人的前端開發自學之路] Day 23 ICON Font 服務

在開發網站前端時，最害怕遇到的事情就是，因為老闆企劃一直做些小修改造成一直重工的情況，一堆 ICON 要調個大小、顏色、陰影，造成設計師一直重工出圖，工程師一直重覆上傳更新。

ICON Font 技術是運用字型向量的特性，將 ICON 包裝成字型檔，讓 ICON 可以自由地放大縮小，顏色上也是自由設定，需要加上陰影就使用 text-shadow 來達成，因此當使用了 ICON Font 服務，當修改需求不斷地過來，只要修改一些程式碼所有的東西都一次修改完成，不用再做重複出圖的工作了。

Font Awesome

向量文字，放大解析度還是一樣

一直持續更新增加新的 ICON

缺點是不能選擇需要的載入，因此會載入許多用不到的 icon

fontastic

顏色、大小、漸層、陰影都由 CSS 處理

客製化需求，不引入多餘 icon

fontello

當需要自己繪製 ICON 的情況

支援 SVG 轉換成 icon font

可以將自己繪製的 SVG 打包成 ICON

icomoon

多種免費付費 ICON Font

支援 icon 輸出成 PNG, SVG

可以下載下來自己加工