Das Farbsystem von Material Design entsteht aus einer einzigen Quellfarbe und wird als 13-stufige Tonleiter (0 bis 100) sowie semantische Rollen wie primary, secondary, tertiary und surface ausgedrückt. So bleibt der Kontrast zwischen hellem und dunklem Theme berechenbar.
Verwendung
Rollen über generierte CSS-Variablen wie --md-sys-color-primary oder den Material Theme Builder anwenden. Die dunkelsten Stufen für Text, die hellsten für Flächen reservieren, um WCAG-Kontrast zu erfüllen.