圖標是具有指代意義的圖形，也是一種標識。通過使用圖標表達命令，強調狀態，表示產品或類別。為了系統及跨平臺之間圖形認知保持一致， 圖標在設計和使用時有以下兩個原則點需要註意：
簡單的圖形語言以及高辨識度。清晰、直觀的圖標更能明確指代含義便於識別記憶；
保持圖標之間一致的風格和表現方式。界面中的所有圖標都應該在細節設計、透視和筆畫權重上保持一致。
一、系統圖標
系統圖標通常用來表示常用的操作，比如：刪除、保存、編輯。也可以用來表示一個文件或者狀態。
2、關鍵輪廓線
根據不同的圖標形狀類型使用不同的輪廓線，可以使圖標之間保持一致的視覺效果。
請將所有圖標在 1024×1024（16×16 的 64 倍）的畫板中制作。
3、細節
a）筆畫
一致的筆畫權重是保持整個圖標系統視覺統一的關鍵，如系統圖標的線條統一為 72px 寬度。
b）邊角
一致的角度半徑也是保持整個圖標系統視覺統一的重要元素
外輪廓線統一半徑為 72px 的圓角，icon 內部空間的邊角保持直角，筆畫的終端為圓角。
c）視覺修正
在一些特殊情況下（比如，icon 的形狀比較復雜緊湊），可以通過調整線條的粗細或圓角的大小等微妙的變化來增加圖標的易讀性。
d)透視角度
始終保持簡潔、平面的風格,不要讓圖標具有多維度空間感，或者充滿了細節。保持平面、簡潔的風格
e)命名規則
統一的命名方式有助於管理圖標，也能更快速的找到需要的圖標。例如，環繞型的圖標統一以「-o」後綴。
f)圖標尺寸
應用於頁面時請使用規範尺寸，與字體搭配時和字體的尺寸保持一致。
例如：和 12pt 字體搭配時，圖標使用 12px，圖標與文字的間距為 8px。
g)顏色
圖標的顏色需要與搭配文案的色值保持一致（表示狀態的除外）。
二、業務圖標
業務圖標不同於系統圖標，本身不帶有功能性的操作，而是輔助配合文案的一個抽象化圖形。相較於系統圖標，業務圖標在設計的細節上更為豐富，使用的尺寸也比較大。
註：業務圖標的設計原則與系統圖標基本一致，在細節處理上（如筆畫權重、圓角大小等）可視具體場景而定。
a)圖標尺寸
在常規使用中，有 32px（最小尺寸）、48px 和 64px（最大尺寸）三種選擇。
b)顏色
業務圖標有單色（中性色）和雙色（中性色+主色）兩種，主色的面積不超過整個 icon 的 40%。

前端的UI設計與交互之圖標篇