GitHub 釋出開放原始碼免費圖示 Octicons，開發者可自由下載或用於商業專案

還記得嗎？GitHub 之前將網站前端 CSS 設計框架開放原始碼釋出為 Primer 專案，為廣大開發者提供了更大的靈活性，而最近更把 GitHub 使用的圖示一併整理後釋出，推出完全免費、可自由下載使用的 Octicons。讓我想起前段時間 Google 也釋出數百個向量圖示，並放到 GitHub 網站上供開發者自由下載，這些圖示的設計都相當簡潔，而且辨識度高，很適合用於應用程式或網站開發。

GitHub 釋出的 Octicons 圖示集收錄 150 個以上常用標誌，同時也是 GitHub 網站使用的圖示，如果需要，可以免費下載、並將它們自由套用到自己的專案開發。

Octicons 提供包括 TTF、CSS 檔在內等多種檔案格式，若要在自己的電腦上使用圖示，可以選擇把 TTF 字型檔安裝進去，若要用於網頁或應用程式開發，只要載入 Octicons 的樣式檔（CSS），以調用方式把圖示的特定名稱寫進去，即可產生特定圖示。

根據網站上的說明，Octicons 在 16px 大小的倍數上可獲得最佳的效果。

網站名稱：GitHub Octicons
網站鏈結：https://octicons.github.com/

使用教學

STEP 1

開啟 Octicons 網站後，可以從首頁預覽這套圖示的呈現效果，點選上方的「Download Octicons」按鈕來下載完整圖示包。

STEP 2

如果不知道怎麼載入圖示，可以先參考 Usage 頁面說明，簡單來說，若你要在網頁內使用某個圖示，先把下載的 Octicons 相關檔案（包括 CSS 檔）上傳、由原始碼載入，然後把該圖示頁面的程式碼範例複製下來，貼到網站裡就能夠使用。

這是最基本的用法，當然還有更多的用法，總之檔案都在圖示包裡面，下載後就能運用。

STEP 3

GitHub Octicons 的使用方法（Usage）頁面還頗詳細的，若你要在自己的電腦上使用這套圖示的話，只要下載、解壓縮，把 TTF 字型檔安裝到系統內即可。如果是在你的開發專案上使用，則可以把 CSS 樣式表載入、使用 HTML 語法來調用特定圖示。