暗主題
暗主題是一個低亮度的用戶界面展示大量的暗表面
使用
在暗主題中，大部分用戶界面展示為暗表面。它被設計為默認主題（亮主題）的補充模式。
暗主題減少設備屏幕發出的光亮，同時還保證了最低的色彩對比度。它們通過減少眼睛疲勞提升視覺功效，根據當前的光線環境調節亮度，在黑暗環境中促進屏幕的使用——這些都能節省電池能量。有OLED屏幕的設備還能從隨時關閉暗像素的功能中受益。
準則
通過灰度變暗
使用暗灰度而不是黑色——在更廣闊的深度范圍內表現層級和空間。
使用色彩強調
在暗主題的界面中運用有限的強調色，那么大部分的空間還是專用于暗表面。
節省能量
在要求效率的產品中（比如有OLED屏幕的設備上），通過減少亮像素的使用節省電池壽命。
增強易用性
?關注一般的暗主題用戶（比如弱視的人），需要符合可用性色彩對比標準。
特性
材料設計中的暗主題是通過以下特性定義的：
對比度：暗表面和100%白色的主體文本的對比度至少為15.8:1
深度：對于更高的視覺層級，組件通過展示更亮的表面顏色表現深度。
低飽和度：主色是低飽和度的，那么它們在所有的層級中都可以通過網頁內容可用性指南（WCAG）AA 標準中最小的4.5:1（當和主體文本一起使用時）比例。
有限的色彩：大量的表面使用暗表面顏色，同時使用有限的強調色（亮的、低飽和度的顏色或者明亮的，高飽和和度顏色）
剖析
暗主題界面使用暗表面主導，使用稀少的強調色。它們發出少量的光同時保持高標準的可用性。
背景（0dp 層級的表面）
表面（1dp 層級的表面）
主色
輔助色
在背景上的顏色
在表面上的顏色
在主色傷的顏色
在輔助色上的顏色
行為
暗主題可以通過顯示出來的按鈕去打開或關閉
優先的，通過圖標按鈕的切換去控制主題的關閉
較低優先級的，通過在菜單或設置中的切換控制
在頂部應用欄中的主題切換
在更多菜單中的暗主題切換
在一個應用設置中的暗主題切換
屬性
暗主題使用暗灰色，而不是黑色，作為組件中主要的表面顏色。暗灰色可以表現出更廣闊的色彩、層級和深度，因為在灰色（而不是黑色）上更容易看到陰影。
暗灰色還能減少眼睛疲勞，因為在暗灰色表面上的亮文字比在黑表面上的亮文字有更弱的對比度。
建議使用的暗主題表面色是#121212
層級
在暗主題中，組件保持在亮主題中一樣默認的層級。然而，在暗主題中，不同層級的表面是通過不同的方式表現出來。
更高的層級，更亮的表面
越高層級的表面（距離虛擬的光源更近），表面就越亮。亮度是通過應用半透明的白色覆蓋物表現出來的。
ligter.mp4
當表面提升高度時，它的顏色變得更亮
一個表面通過應用半透明的白色覆蓋物變得更亮
1.表面
2.層級覆蓋物
表面上的覆蓋物也使組件之間的層級更容易區分，且更容易看到陰影。覆蓋物增加了表面和它們陰影之間的對比，讓每個表面的邊界更加明顯。
overlay.mp4
默認的主題使用陰影表現層級，同時暗主題通過調整表面的顏色表現層級
這些表面的值被設計得最大化可讀性，同時保證了不同的層級之間是分得清的
覆蓋物透明度范圍從最低的0%到最高的16%層級
覆蓋物表明了組件間的層級不同
A.在1dp層級的卡片使用5%的覆蓋物
B.在6dp層級的浮動按鈕使用輔助色而沒有覆蓋物
C.在8dp層級的底部按鈕使用12%的覆蓋物
使用主色或輔助色的組件不使用層級覆蓋物。在暗主題里，陰影還是暗的，以準確的表達出投影。
避免在主色和輔色的組件上使用層級覆蓋物
不要使用發光在陰影中表現層級，因為它們不能像投影那樣準確的表達出層級。
易用性和對比度
暗主題的表面必須足夠暗以展示白色文本。它們必須在文本和背景之間使用最少的對比15.8:1層級。這樣能夠保證當在最高層級上運用主題文本時，文本能夠通過WCAG's AA標準的4.5:1.
得到品牌的暗表面，把品牌主色的透明度降到最低，放到建議的暗主題表面色（#121212）上面。顏色（#1F1B24）就是結合8%的主色和暗主題表面色#121212的結果。
如果背景顏色沒有足夠暗以符合白色文本和表面的15.8:1最低對比層級，那么文本在最高層級的表面上就不能通過4.5:1的標準。
確保背景顏色足夠暗，那么主題文字在最高層級的表面上符合最低4.5:1（AA）對比。
需要電池使用效率的用戶界面可以使用真黑色。在這些情況下，一些設備（比如使用OLED屏幕的穿戴設備）可以關閉任何顯示黑色的像素以節省電池能量。
oled.mp4
在OLED屏幕上，關閉或打開像素會在屏幕滾動時引起延遲，使像素變得模糊。
界面應用
主題顏色
所有暗主題顏色應該使用足夠的對比度去顯示元素，對于主體文本當應用到所有層級表面時，通過WCAG's AA 標準最低4.5:1。
低飽和度顏色提高易用性
暗主題應該避免使用高飽和度的顏色，因為它們不能通過WCAG's AA標準 最低的4.5:1,對于主體文本在暗表面上。飽和的顏色在暗背景上也能產生視覺的顫動，從而引起眼睛的疲勞。
相反的，低飽和度的顏色能作為更易讀的替代被使用。
你色盤上的低飽和度的顏色可以提升可讀性，減少視覺顫動。
避免使用在暗主題上引起視覺顫動的高飽和度顏色
主要顏色
主要顏色是在你的應用屏幕和組件上出現最頻繁的顏色。材料設計的基準暗主題使用200色調作為主色（在所有的層級表面上，對于文本都能通過WCAG's AA標準，最低4.5:1）。
暗主題中的一個主色版樣例
1.主色指示器
2.色調系列
主色變體
有亮表面的組件能顯示你暗主題主色的變體。
這個暗主題界面使用了主色（紫色 200）和主色變體（紫色 700）
輔助色
輔助色能夠用來強調你的界面中選中的部分。在暗主題中，輔助色可以降低飽和度以符合 4.5:1 對比層級。
在暗主題中一個輔助色板樣例
1.輔助色指示器
2.色調系列
這個界面使用了主色和輔助色的變體
強調色
在暗主題中，暗表面占據界面的主要部分。強調色一般都是亮色（低飽和 淡雅的）或者是明亮（飽和的，鮮艷的顏色）以幫助突出元素。它們應該被謹慎使用以突出關鍵元素，比如文本或者按鈕。
找出強調色
色板生成器可以用來生成一個顏色主題。它還能生成色調板，那是一系列從亮到暗的顏色變體，通過你的主色或者輔助色生成的。你可以為你的暗主題選擇這些變體。
為了在暗主題中更加靈活和可用，推薦使用亮色調（200—50）。而不是默認的顏色主題（范圍在 900-500 的飽和顏色）
1.默認主題的主色指示器
2.暗主題的主色指示器
亮色調（在200—50范圍內的顏色）在暗主題表面（所有層級）上有更好的可讀性。
避免在暗主題中使用飽和顏色，因為它們在暗表面上會引起視覺顫動。
默認主題中在頂部應用欄中使用顏色
在暗主題中，頂部應用欄中使用暗色而不是主色或者輔助色
品牌色
為了保持品牌識別度，原有飽和度的品牌色可以在暗主題中使用，雖然被應用到有限的一到兩個關鍵品牌元素，比如標志或著品牌按鈕。通過謹慎地使用品牌色，元素在層級中保持了優先級。
原有飽和度的品牌色被應用到懸浮操作按鈕上，同時低飽和度的暗主題主色被應用到文本上。
1.暗主題主色
2.品牌色
暗主題基礎色板
材料設計的基準主題包含了暗主題的色調板。暗主題顏色應該被運用到暗主題界面上，包括：
顏色（主色、輔助色和主色變體）
表面（背景和組件）
狀態（比如錯誤狀態）
內容（字體和圖標）
暗主題基準材料色板
1.材料設計基準默認主題
2.材料設計基準暗主題
錯誤色
錯誤色被用來表明錯誤狀態。材料基準暗主題錯誤色是#CF6679
暗主題顏色是通過把亮主題的錯誤色（#B000020）和40%白色覆蓋使它變亮得到的，使它能通過AA級別的對比標準。
字體和圖標顏色
上面的顏色
上面的顏色（'On' colors ）主要是運用在主要表面上的文本、圖標和描邊上，使用主色、輔助色、表面色、背景色、或者錯誤色。
默認的，暗主題的“上面的顏色”一般是白色和黑色。
界面展示了暗主題的文字和圖標的基準顏色
在暗背景上的亮色文本
當亮的文本顯示在暗背景上（這里展示的是白色在黑色上）時，它需要使用如下的透明度等級：
高優先級文本使用87%的透明度
中等優先級文本和提示文本使用60%的透明度
失效文本使用38%的透明度
高優先級、中等優先級和失效文本
習慣應用
材料設計中的有些場景可以從使用選擇暗主題元素中獲益
大的表面
使用一大塊屏幕的組件，比如應用欄和背景幕，可以在它們的組件上使用暗主題。
為小的表面保留亮色
不要在大的表面上使用亮色，因為它們發出太多的光亮
如果一個暗色比推薦的表面色（#121212）更好，確保它們能通過15.8:1的對比度
避免在背景幕上使用暗主題的主色，因為它會在屏幕的大塊地方覆蓋上亮色
結合亮主題和暗主題
當在暗主題中使用亮表面時，亮色可以用在選擇組件的表面上以保持優先級。
比如，暗主題中的提示條可以顯示亮表面以突出它。做到這一點，它可以運用亮主題的表面和表面上的顏色。
提示條在暗主題中使用亮表面幫助它突出
1.在表面上
2.表面
3.主色變體
狀態
狀態通過覆蓋物的運用視覺地傳達出組件或可交互的元素所在的狀態。在暗主題中，狀態使用它們在默認主題（亮主題）中一樣的覆蓋值，并且調整它們以通過AA等級的對比度標準
有兩種類型的容器使用狀態覆蓋物：使用“表面”顏色的容器和使用“主”色的容器
表面容器
表面容器使用的顏色應該和它的圖標和文本標簽（如果沒有圖標）相匹配
激活的、移入的、焦點的、按下的和拖拽的容器狀態使用表面顏色
激活的、移入的、焦點的、按下的和拖拽的容器使用表面顏色和內容的主色
主色的容器
對于使用主色的表面容器，它們的狀態覆蓋物是白色
激活的、移入的、焦點的、按下的和拖拽的容器使用半透明的主色
激活的、移入的、焦點的、按下的和拖拽的容器使用半透明的主色
失效的狀態
所有失效的組件在容器邊框和填充上使用12%的白色，在文本標簽和圖標等內容上使用38%的白色
1.帶邊框的容器：12%的白色
2.標簽/圖標：38%的白色
3.填充的內容：12%的白色
