图标
图标内联成描边 SVG，不用图标字体。
图标内联成描边 SVG。规格：fill:none · stroke:currentColor · stroke-width:1.5 · linecap/linejoin:round，颜色永远从父级的语义文本令牌继承——自带硬编码颜色的图标， 是一个在下一个状态里就会出错的图标。 不用图标字体：它是外部依赖，取不到时纯图标按钮会变成空白方框。图标出现的频率决定了不该赌一个外部依赖。
命中区四档，字形跟着走
20px 那一档低于无障碍最小尺寸，只有当同一操作还能通过一个达到 24px 的目标触达时才允许使用。注意档位名与控件高度重名但数值不同：mini 控件是 24px 高，mini 图标按钮是 20px 见方。
三类图标，三种义务
| 类型 | 义务 | 为什么 |
|---|---|---|
| 装饰性 | aria-hidden="true" | 它与自己的文字标签并列，否则被播报两次 |
| 可交互 | aria-label | 描述动作而不是描述图案：「换一个种子」不是「骰子」 |
| 指示性 | 屏幕阅读器文本 | 状态点这类图标，颜色和形状本身不传达含义 |
方向性图标——箭头、chevron、返回与前进、缩进、撤销——需要一个能让 RTL 翻转的 class。时钟、对勾、播放按钮、Logo、带时间轴的图表，永远不要翻转。上/下箭头不需要翻转，所以在能选的时候优先用上下。