顏色

材料設計定義了各種顏色。這些顏色在視覺化中使用。建議盡可能使用顏色值來聲明一種顏色,以確保對比度和設計後來會相互匹配。特別要注意這一點,因為當從亮到暗的設計切換時,文字可能會變得無法閱讀。

提示: 您可以在專案設定中更改視覺化選項卡下的顏色。這樣就能創建個性化設計。

背景顏色

這是所有可能的視覺化背景顏色。

名稱 顏色 文字顏色
紅色 red #D32F2F #FFFFFF
粉色 pink #C2185B #FFFFFF
紫色 purple #7B1FA2 #FFFFFF
深紫色 deep_purple #512DA8 #FFFFFF
靛藍色 indigo #303F9F #FFFFFF
藍色 blue #1976D2 #FFFFFF
淺藍色 light_blue #0288D1 #FFFFFF
綠松石色 cyan #0097A7 #FFFFFF
海綠色 teal #00796B #FFFFFF
綠色 green #388E3C #FFFFFF
淺綠色 light_green #689F38 #FFFFFF
柠檬綠色 lime #AFB42B #000000
黃色 yellow #FBC02D #000000
琥珀色 amber #FFA000 #000000
橙色 orange #F57C00 #000000
深橙色 deep_orange #E64A19 #FFFFFF
錯誤 error #B00020 #FFFFFF

符號和文字顏色

這些顏色建議用於文本,並且在平面圖上的符號中使用,以表示足夠的對比度。

名稱 顏色 文字顏色
紅色 red #F44336 #FFFFFF
粉色 pink #E91E63 #FFFFFF
紫色 purple #9C27B0 #FFFFFF
深紫色 deep_purple #673AB7 #FFFFFF
靛藍色 indigo #3F51B5 #FFFFFF
藍色 blue #2196F3 #FFFFFF
淺藍色 light_blue #03A9F4 #000000
綠松石色 cyan #00BCD4 #000000
海綠色 teal #009688 #FFFFFF
綠色 green #4CAF50 #000000
淺綠色 light_green #8BC34A #000000
柠檬綠色 lime #CDDC39 #000000
黃色 yellow #FFEB3B #000000
琥珀色 amber #FFC107 #000000
橙色 orange #FF9800 #000000
深橙色 deep_orange #FF5722 #FFFFFF
棕色 brown #795548 #FFFFFF
灰色 gray #9E9E9E #000000
藍灰色 blue_gray #607D8B #FFFFFF
錯誤 error #B00020 #FFFFFF