Hệ Thống Màu Material Design
Embed This Widget
Add the script tag and a data attribute to embed this widget.
Embed via iframe for maximum compatibility.
<iframe src="https://colorfyi.com/iframe/glossary/material-design/" width="420" height="400" frameborder="0" style="border:0;border-radius:10px;max-width:100%" loading="lazy"></iframe>Paste this URL in WordPress, Medium, or any oEmbed-compatible platform.
https://colorfyi.com/glossary/material-design/Add a dynamic SVG badge to your README or docs.
[](https://colorfyi.com/glossary/material-design/)Use the native HTML custom element.
Hệ thống thiết kế toàn diện của Google, định nghĩa cách tiếp cận có cấu trúc để chọn màu, tạo chủ đề và áp dụng màu sắc trên các thành phần giao diện.
Material Design's color system is built around primary and secondary color roles, each with multiple tonal variants. Material Design 3 (Material You) introduced dynamic color, which generates an entire UI palette from a single seed color using the HCT (Hue-Chroma-Tone) color space. The system defines 13 tonal palettes and maps them to specific UI roles like surface, on-surface, primary-container, and on-primary. This systematic approach ensures consistent contrast ratios and visual hierarchy. The Material color utilities provide tools for generating accessible color schemes from any starting color.