CorColor

Usar nossa paleta neutra aprovada para planos de fundo, notificações, texto e botões ajudará seu aplicativo a se sentir mais em casa no Microsoft Teams.Using our approved neutral palette for backgrounds, notifications, text, and buttons will help your app feel more at home in Teams. Como o Microsoft Teams tem dois temas de cor (claros e escuros), é uma boa ideia garantir que seu aplicativo fique ótimo nos dois temas.Since Teams has two color themes (light and dark), it’s a good idea to make sure your app looks great in both themes.

$app-preto (#252423)$app-black (#252423)

Nossa cor de texto usada com mais frequência.Our most commonly-used text color. Podemos usá-lo em cinco níveis de opacidade para o texto.We use it at five levels of opacity for text. O texto deve ser usado principalmente em 100%, 74%, 64% de opacidade, pois é acessível.Text should mainly be used at 100%, 74%, 64% opacity since it is accessible. O texto em 52% e 36% deve ser usado com moderação, já que não está acessível.Text at 52% and 36% should be used sparingly since it is not accessible.

  1. 100%-cabeçalhos e texto base100% - Headers and base text
  2. 74%-rótulos, subtítulos, atribuições e botões de ícone74% - Labels, subheads, attributions, and icon buttons
  3. 64%-visualizações de mensagem, texto de ajuda (não mostrado)64% - Message previews, help text (not shown)
  4. 52%-carimbos de data/hora52% - Timestamps
  5. 36%-texto desabilitado36% - Disabled text

Também usamos $app-black em outros opacities para alguns elementos da interface do usuário:We also use $app-black at other opacities for some UI elements:

  1. planos de fundo de 14%14% - Banner backgrounds
  2. 5%-botões desabilitados e bordas de cartão5% - Disabled button and card borders

Rampa de cores de tema padrãoDefault theme color ramp

Consulte a caneta Microsoft Teams design Guidelines – rampa de cores de tema padrão no CodePen.See the Pen Microsoft Teams design guidelines - default theme color ramp on CodePen.

Outras cores de tema padrãoOther default theme colors

Consulte a caneta Microsoft Teams design Guidelines-outras cores de tema padrão no CodePen.See the Pen Microsoft Teams design guidelines - other default theme colors on CodePen.

Rampa de cores do tema escuroDark theme color ramp

Consulte a caneta Microsoft Teams design Guidelines-rampa de cores de tema escuro no CodePen.See the Pen Microsoft Teams design guidelines - dark theme color ramp on CodePen.

Outras cores de temas escurosOther dark theme colors

Consulte a caneta Microsoft Teams design Guidelines-outras cores de tema escuro no CodePen.See the Pen Microsoft Teams design guidelines - other dark theme colors on CodePen.