CouleurColor

L’utilisation de notre palette de couleurs neutre approuvée pour les arrière-plans, les notifications, le texte et les boutons aidera votre application à se sentir plus à la maison dans Teams.Using our approved neutral palette for backgrounds, notifications, text, and buttons will help your app feel more at home in Teams. Étant donné que teams comporte deux thèmes de couleur (clair et sombre), il est recommandé de s’assurer que votre application paraît belle dans les deux thèmes.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 noir (#252423)$app-black (#252423)

La couleur de texte la plus couramment utilisée.Our most commonly-used text color. Nous l’utilisons à cinq niveaux d’opacité pour le texte.We use it at five levels of opacity for text. Le texte doit être utilisé principalement à 100%, 74%, 64% d’opacité, car il est accessible.Text should mainly be used at 100%, 74%, 64% opacity since it is accessible. Le texte à 52% et 36% doivent être utilisés avec parcimonie, étant donné qu’il n’est pas accessible.Text at 52% and 36% should be used sparingly since it is not accessible.

  1. 100%-en-têtes et texte de base100% - Headers and base text
  2. 74%-étiquettes, sous-titres, attributions et boutons d’icône74% - Labels, subheads, attributions, and icon buttons
  3. 64%-aperçus de messages, texte d’aide (non illustré)64% - Message previews, help text (not shown)
  4. 52%-horodatages52% - Timestamps
  5. 36%-texte désactivé36% - Disabled text

Nous utilisons également $app-black sur d’autres opacities pour certains éléments de l’interface utilisateur :We also use $app-black at other opacities for some UI elements:

  1. 14%-arrière-plans de bannière14% - Banner backgrounds
  2. 5%-bordures de bouton et de carte désactivées5% - Disabled button and card borders

Rampe couleur par défaut du thèmeDefault theme color ramp

Voir le stylo Microsoft teams Design Guidelines-gamme de couleurs de thème par défaut sur CodePen.See the Pen Microsoft Teams design guidelines - default theme color ramp on CodePen.

Autres couleurs de thème par défautOther default theme colors

Voir le stylo Microsoft teams Design Guidelines-autres couleurs de thème par défaut sur CodePen.See the Pen Microsoft Teams design guidelines - other default theme colors on CodePen.

Rampe couleur de thème foncéDark theme color ramp

Voir le stylo Microsoft teams Design Guidelines-gamme de couleurs de thème foncé sur CodePen.See the Pen Microsoft Teams design guidelines - dark theme color ramp on CodePen.

Autres couleurs de thème foncéOther dark theme colors

Voir le stylo Microsoft teams Design Guidelines-autres couleurs de thème foncé sur CodePen.See the Pen Microsoft Teams design guidelines - other dark theme colors on CodePen.