Principe général

Bootstrap inclut une mécanique de gestion des couleurs à laquelle il convient d'ajouter certains ajustements. Il est interessant de "neutraliser" certaines variables de couleurs et de prévoir certaines variables réutilisables (toutes les variables en italique ci-dessous).
Les couleurs peuvent être rangées dans plusieurs sections : niveau de gris, branding et feedbacks.

A noter également que certaines couleurs disposent d'une variation light(-l) et d'une variation dark (-d).
La présence d'un rond de couleur tomate précise que la couleur vient directement de la charte client (référence officielle).

Branding
Brand 1
$brand-1-l
#AA192D
$brand-1
#EB002D
$primary $col-highlight $col-promo
$brand-1-d
#FCE9EB
$brand-1-xd
#1F1416
$dark $secondary $col-title $col-link
Brand 2
$brand-2-xl
#EFF3F6
$brand-2-l
#DFE7EC
$brand-2
#A0D8F8
$brand-2-d
#5D89A2
$secondary $col-current $col-checked
Brand 3
$brand-3-l
#F9F4EE
$brand-3
#F4EADE
Gray
Gray
$gray-98
#faf9f9
$light
$gray-95
#f4f1f1
$col-disabled-bg
$gray-85
#d9d9d9
$col-separator $col-disabled $col-border
$gray-50
#808080
$col-placeholder $col-txt-l
$gray-30
#4d4d4d
$gray-20
#333333
$col-txt
$gray-100
#f8f9fa
$gray-200
#ebecee
$gray-300
#e2e1e4
$gray-400
#d4d3d7
$gray-500
#b6b3b9
$gray-600
#787277
$gray-700
#514e52
$gray-800
#3a393c
$gray-900
#252427
Black, white, dark, light
$white
#FFFFFF
$light
#faf9f9
$dark
#1F1416
$black
#000000
Feedback
Primary & secondary
$primary
#007bff
$secondary
#6c757d
OK & KO
$success
#6AA421
$col-ok
$danger
#dc3545
$col-ko
Others
$info
#5D89A2
$warning
#dc3545