Material Design xây dựng hệ màu từ một màu nguồn duy nhất, được biểu thị thành thang tông 13 bước (0 đến 100) cùng các vai trò ngữ nghĩa như primary, secondary, tertiary và surface. Thang này giữ độ tương phản ổn định giữa chủ đề sáng và tối.
Cách sử dụng
Áp dụng vai trò qua các biến CSS như --md-sys-color-primary hoặc dùng Material Theme Builder. Dành bước tối nhất cho văn bản và bước sáng nhất cho bề mặt để đạt chuẩn tương phản WCAG.