深色模式

在深色模式下，表面、墨色、线和柔和色调会变；贴纸不变。贴纸保留自己的颜色和墨色文字，并多出一圈模切边，让它在周围的深色表面上依然分得开。

原则

• 表面越往里越亮。 外框和侧边栏最暗；纸面、卡片、弹出层和下沉填充依次变亮。
• 贴纸永远不反色。
• 每个新组件都要在两种模式下检查。

会变的

• 表面：layer-frame 和 layer-sidebar，然后是 layer-canvas、layer-card、layer-popover 和 fill-muted，每一层都比前一层亮。具体数值见颜色。
• 墨色、线和柔和色调。
• 任务状态像素点的颜色。
• 外框是中性的深色，不是黄色。导航条上的选中项仍然是黄色贴纸：它表示「你在这里」，不属于外框。

不变的

贴纸保留自己的颜色和墨色文字：头像、粉色按钮、黄色选中、开关、位置图块、徽标、工作空间图块（墨色底上的黄色）和回应。

模切边

贴纸的边是墨色的，在深色表面上会看不见。在深色模式下，每张贴纸都在墨色边外面多一圈模切边（sticker-edge）。

• 给每张贴纸加上模切边：
  • 头像；
  • 黄色选中：侧边栏的行、导航条的项、标签页、分段控件、切换按钮组、手机标签栏；
  • 粉色、橙色和红色按钮（禁用时不加：禁用的按钮不再是贴纸）；
  • 开关；
  • 计数徽标和 @ 徽标；
  • 消息和 Markdown 中提及这个人的地方；
  • 回复数。
• 模切边位于贴纸的盒子之外。这样盒子对齐网格，看得见的边也随之对齐：在深色模式下，头像和标签页贴纸是对齐的，而不是相差 3px。
• 不要裁切装有贴纸的容器，因为边在盒子外面。只截断文字：把标签片、徽标和头像放在同一行、被省略号截断的文字之外。

相关内容

• 颜色：token 及其在两种模式下的值。
• 品牌：深色模式下的回应。