什么时候用
- 按钮 = 动作（提交、切换、打开对话框）；去往另一页用链接。确实要做成按钮外观的导航，用
href让它渲染成<a>。 - 行内的次要动作用
link变体，不要在一段正文里放实底按钮。
选哪种变体
| 变体 | 用在 | 出处 |
|---|---|---|
primary | 一个区域里最主要的那个动作——一处只放一枚 | 青（暗）/ 蓝（亮）实底 |
contrast | 「开始行动」「确认」这类强动作，黑白反转比彩色更像游戏 | 游戏内 btn_on |
| 默认 | 普通动作、次要动作 | 游戏标准按钮 btn_off #313131 |
outline | 需要比默认更显眼、又不抢主动作时 | — |
ghost | 工具栏、动作簇里成排的轻量动作 | 页面动作簇 |
danger | 不可逆的破坏性动作（删除、清空）；可叠 stripes | 游戏确认按钮 #711111、BREAKING 红 |
link | 正文里的次要动作 | 链接色 |
规则
- 红只表示危险。 不要为了醒目把普通按钮做成
danger。 - 直角。
pill只给确需胶囊形的场合（极少），系统默认没有圆角。 - 没有辉光。 强调靠明度反转和色条，不靠阴影发光；
primary悬停的 3px 淡色外圈是焦点语言，不是装饰。 - 文案用动词：「编辑」「开始行动」「加入监视列表」，不写「点击这里」。
- 加载中用
loading，不要自己换文字、再禁用。
DO / DON'T
| DO | DON'T |
|---|---|
一组动作里一个 primary，其余默认 / ghost | 一排三个 primary |
图标按钮写 label | 只有图标、没有可读名称 |
危险动作二次确认（对话框里的主动作用 danger） | 用红色做「保存」 |