Guide de style - Couleurs

Utilisations

Dans la palette de couleurs du Système de Design, chaque groupe de couleurs correspond à un certain type d'usages. Ce mode de fonctionnement garantit le maintien d'une cohérence entre les différentes interfaces, afin d'optimiser l'expérience de l'utilisateur.

Couleurs primaires

Couleurs primaires
Couleurs	Noms	Usages
	Primary #1D71B8	Boutons primaires Boutons primaires outline Liens Illustrations, pictogrammes Éléments graphiques / patterns État actif sur les textes Checkbox actifs et boutons radio actifs Listes à puces et listes numérotées
	Primary Darker #0F3F68	État « Pressé » du bouton principal Illustrations/pictogrammes
	Primary Dark #155891	État « Hover » du bouton principal Illustrations/pictogrammes

Couleurs secondaires

Couleurs secondaires
Couleurs	Noms	Usages
	Secondary #D20050	Illustrations/pictogrammes Éléments graphiques Liens "serviciels"

Couleurs neutres

Couleurs neutres
Couleurs	Noms	Usages
	Black #343852	Titres (du H1 au H6) Boutons secondaires outline Pictogrammes/illustrations
	Gray-800 #464C6D	Pictogrammes/illustrations
	Gray-700 #697097	Chapôs Paragraphes Surtitres Pictogrammes/illustrations
	Gray-600 #969CBB	Bordures de champs Pictogrammes/illustrations Bordure des boutons d'ajout
	Gray-500 #C5C8DA	Pictogrammes/illustrations
	Gray-400 #DEE0EA	Bordures et séparateurs Pictogrammes/illustrations
	Gray-300 #EDEEF3	Pictogrammes/illustrations
	Gray-200 #F2F3F7	Pictogrammes/illustrations
	Gray-100 #F8F9FB	Arrière-plans Pictogrammes/illustrations
	White #FFFFFF	Arrière-plans Pictogrammes/illustrations

Couleurs fonctionnelles

Couleurs fonctionnelles
Couleurs	Noms	Usages
	Error #D20024	Textes d'erreur Bordure des champs en erreur Éléments graphiques des messages de statut
	Warning #E69215	Éléments graphiques des messages de statut
	Success #9AB938	Éléments graphiques des messages de statut
	Information #369AEE	Éléments graphiques des messages de statut