创意窝 
扁平风图标看着简单，真要凑成一套却容易各画各的。统一的诀窍不在感觉，而在三条可执行的基线：形状骨架、线条粗细、色彩规则。先立基线，再画图标，整套图标的家族感自然就出来了。
一、形状基线：先定骨架，再谈风格
同一套图标应该长在同一副骨架上。常见做法是用统一网格确定有效绘制区，比如 24×24 的图标统一留出 2 单位内边距，保证视觉体积一致；圆形与方形图标的外接尺寸保持同一档，避免一个显胖一个显瘦。圆角半径也要提前约定，线性图标常用 1 到 2 单位的圆角，同一套里不要一半全直角、一半大圆角。填充型与线面结合型可以混用，但外形轮廓的胖瘦、开合角度要维持同一个调性，用户才会觉得它们是一家人。
二、线条基线：粗细统一，断点有谱
线性图标的线条粗细是家族感最直接的来源。整套图标用同一档描边宽度，通常以 1.5 到 2 单位为常见区间，放大显示时按倍数同步加粗，而不是随手拉伸。线条的端点与拐角处理要写进规范：圆头还是方头、拐角是尖角还是圆角，确定之后不在新图标里擅自更改。遇到必须断开的笔画，比如删除线、禁止符，断口的位置与比例给出一到两个标准样式，避免每个图标断得随心所欲。
三、色彩基线：主色、辅色与状态色分开管
扁平图标的颜色同样要分层管理。可以约定默认主色一个、辅助色一到两个，再单独定义禁用、选中、警示等状态色，状态色只走状态通道，不掺进装饰性配色。同一套图标的默认色保持一致，需要区分类别时用色相区分，而不是把明度调得忽高忽低，保证在浅色背景下都压得住。若需要双色搭配，提前规定主色占大面积、辅色做点缀的比例，不要一半图标上重下轻、另一半正好相反。
四、一张自查表收尾
三条基线落地后，可以用一张清单逐项核对新图标：
| 基线 | 检查项 | 通过标准 |
|---|---|---|
| 形状 | 网格与边距 | 全部图标共用同一绘制网格 |
| 形状 | 圆角与体积 | 外接尺寸一致，圆角档位统一 |
| 线条 | 描边宽度 | 同一倍率下粗细一致，端点风格统一 |
| 色彩 | 用色数量 | 默认色一致，状态色独立管理 |
扁平风图标系统的统一，本质是把「看起来差不多」翻译成可检查的硬指标。形状定骨架、线条定气质、色彩定分工，三条基线立住后，新图标照着画、老图标照着查，整套图标才经得起项目一轮轮迭代。
微信扫一扫 
