Material 3 表情符號色彩架構會使用動態色彩主題設定,這會根據在 HCT (色相、彩度和色調) 色彩系統中對應的兩個種子色彩。
重要條款
- 顏色角色
- 就像塗鴉畫布上的「數字」一樣,顏色角色會指派給特定 UI 元素。這些名稱包括 primary、on primary 和 primary container。淺色和深色主題都會使用相同的色彩角色。查看所有顏色角色
- HCT
- HCT 代表色相、彩度和色調。
使用色相、彩度和色調 (HCT) 定義顏色
HCT 顏色產生器會根據初始顏色建立一組調色盤,以便建立三維顏色模型,並根據色相 (顏色)、彩度 (飽和度) 和色調 (亮度) 定義顏色
主要強調色有三種:原色、二次色和三次色。中性色調 (例如帶有原色調的各種灰色) 由於屬於單色調,因此非常適合用於豐富內容的容器顏色。
色調
色調是指人類對顏色的感知,例如紅色、橘色、黃色、綠色、藍色和紫色。色調以 0 到 360 的數字量化,並以圓形光譜表示 (值 0 和 360 是相同的色調)。
高彩度
色度是指顏色看起來是否鮮豔或偏中性 (灰色、黑色或白色)。色度會以數字量化,範圍從 0 (完全灰色、黑色或白色) 到無限 (最鮮豔),不過 HCT 中的色度值上限約為 120。
由於生物和螢幕算繪的限制,不同色調和色相會有不同的最大色度值。
語氣
色調是指顏色的明亮程度。色調有時也稱為亮度。色調會以數字量化,範圍從 0 (純黑,無亮度) 到 100 (純白,完整亮度)。
色調對於視覺無障礙至關重要,因為它決定了對比度。色調差異越大,對比度就越高;差異越小,對比度就越低。
動態色彩 (色彩主題設定)
Wear OS 導入的佈景主題系統符合 無障礙網頁內容規範 (WCAG)-AAA,並衍生自兩種指定的種子顏色。具體來說,這些種子顏色是主要和三次色調色盤的基礎。系統會使用這兩個初始顏色,產生包含主要、次要、三次和表面調色盤的完整調色盤。接著,這個產生的主題會套用至 Wear OS 元件、系統 UI 元素、資訊方塊和應用程式。



視偏好而定,您可以使用特定的種子顏色或品牌顏色來衍生動態色彩。
從種子顏色
動態色彩會根據特定原色自動建立無障礙色彩配置。
由於 UI 可能會使用多種不同的來源顏色,因此建議您一開始使用基準色彩配置進行設計,確保產品中正確的顏色角色會對應至正確的元件。使用 Material 主題設定建構工具,查看 UI 模擬內容在各種來源顏色下的樣貌,並視需要調整設定。
調色盤 (取自錶面初始顏色)
套用至方塊的色彩主題
已套用顏色主題的應用程式畫面
從品牌顏色
與 Material 3 Expressive 處理顏色角色的方式類似,Wear OS 會將顏色套用至個人化體驗,以便透過動態且易於存取的色彩表達方式,Wear OS 只會使用深色主題,因為可穿戴式裝置介面是以黑色背景建構。由於 Wear OS 是運行於觸控裝置的平台,因此調色盤的顏色較少,因為它不需要太多懸停和聚焦狀態。使用 Wear OS 專屬的色彩主題建構工具,針對您的品牌建構自訂主題,並產生完整的參考調色盤和指派的顏色角色,這些角色可支援 Material Design 符記,並且可與系統 UI 元件完美搭配運作。
調色盤 (取自圖片的種子顏色)
套用至方塊的色彩主題
已套用顏色主題的應用程式畫面