Teams Web 版和桌面版均支持默认（浅色）、深色和高对比度主题，而 Teams移动版则只支持浅色和深色主题。 每个主题都有自己的配色方案。
准则
使用标准 Teams 颜色，这些颜色旨在满足 Web 内容辅助功能指南 (WCAG) 2.1 对比度要求，确保跨支持的主题提供一致且可访问的体验。
必要时添加颜色
从白色画布开始，仅在需要时添加颜色。 避免使用颜色来绘制大型图面，例如卡片。 请改用颜色来创建层次结构，例如，突出显示重要操作。
将辅助功能放在第一位
始终以呈现应用内容为目标，并考虑到所有用户需求和首选项。 必须可访问文本和重要元素（如图标）的颜色。
一致地使用颜色
不要不一致地使用颜色来混淆。 使用 Teams 核心颜色和辅助颜色，它们传达活动、错误和其他常见状态。
主要颜色和颜色标记
每个 Teams 主题都有自己的配色方案。 若要自动处理主题更改，可以在设计中指定颜色标记。
了解如何 在 Teams 应用项目中使用颜色令牌。
使用令牌进行设计的示例
以下标记值适用于默认 (浅色) 主题：
| 计数器 | 说明 |
|---|---|
| A | 背景 2：画布背景色 |
| B | 默认前景：主要文本颜色 |
| C | 前景 1：辅助文本颜色 |
| D | 品牌背景：主按钮背景色 |
| E | 品牌前景：链接文本颜色 |
将应用调色板与 Teams 集成
原色
| 计数器 | 说明 |
|---|---|
| 1 | 嵌入组件中的操作按钮颜色 |
| 2 | 个人应用中的“操作”按钮颜色 |
应用主色
辅助颜色
| 计数器 | 说明 |
|---|---|
| 1 | Teams 辅助颜色 |
| 2 | 示例应用中的自定义辅助颜色 |
最佳做法
做：有目的地使用颜色
颜色必须用于突出显示功能、定义层次结构和传达不同的状态。 避免在与任何语义无关时使用颜色。
操作：使用中性调色板创建深度
始终使用此工具包中提供的中性灰度调色板作为 UI 的基础。 可以包括灰色的其他步骤，以增强深度和层次结构感。 层在 z 轴上移动时必须显得更亮。
不要：仅使用颜色进行品牌打造
不要仅出于品牌打造目的或视觉喜悦使用颜色。 避免在大图面上使用颜色，例如卡片和标题的背景。
不要：变得太复杂
例如，对于浅色和深色主题，没有不同的灰色底纹。 此外，在大图面上，切勿使用非灰度中性颜色。