顏色

顏色的靈感是來自於設置在寧靜場合之中強調色的標示，參考當代建築、道路標誌、地面標線 以及體育場地給的啟發。強調明顯的陰影及聚光，使用意想不到的鮮豔色彩。

Color Swatch 0.13 MB (.zip)

色票

色票包含了基本色和強調色，可以被用來繪圖或是發展成你的品牌色。它們被設計成彼此相互協調。

這些色票從基本色開始填滿色譜，建立一個完整的色票，可供Android、網頁及iOS使用。 Google建議在你的應用程式中使用這500色作為基本色，其他顏色則作為強調色。

下載色卡

0.02 MB (.zip)

使用者介面的顏色運用

選擇你的色票

從主要色票中選擇的基本色調侷限在三種以內，次要色票中則選擇一種強調色 強調色依情況，是可有可無的預備方案。

關聯

自定義色票

定義你的應用程式色票

範例：主要色票

範例：次要色票

在灰階文字、icon以及分隔線上使用alpha值

為了傳達層次化的訊息，可以使用深淺不同的文字。白色背景文字的標準alpha值為87%（#000000）。次要文字，也就是視覺階層上再低一階的文字，則應該有54%（#000000）的alpha值。像那些在文字欄位和標籤上給使用者看的文字提示，應該有更低階的視覺效果，適用26%（#000000）的alpha值。

其他元件，如icon與分隔線，也可使用黑色背景的alpha值來取代實心顏色，這樣可以確保它們在任何顏色背景上都可發揮作用。

工具欄與狀態欄

工具欄以及更大的色塊應該使用主要色500，這應該是你的應用程式主色，狀態欄應該是主要色的較暗色調700。

大膽地在大面積的區塊上使用顏色是被鼓勵的，你所選擇的色票上的不同顏色，可以使用在應用程式介面中的不同元件上。

強調色

強調色用於您的主要操作按鈕以及元件上，如開關或滑桿。

好的做法

僅使用強調色在內文中強調連結

不好的做法

別使用強調色強調整個內文

好的做法

不好的做法

別在應用程式欄或大面積區域上使用強調色。避免在浮動按鈕和背景上使用相同的色彩。

備用強調色

如果你的強調色對於背景來說實在太亮或太暗，你可以選擇比起原來的強調色更亮或更暗的顏色。如果你的強調色起不了任何作用，在白色背景上使用主要色500。如果你的背景已經是主要色500，可使用100%的白色或54%的黑色。

好的做法

不好的做法

主題

主題讓你在應用程式上有一致性的風格。主題指定了表面的暗色、陰影的階層以及墨水元件的適當透明度。

為了促進應用程式之間的一致性，有兩個主題可供選擇：明亮系及暗色系。

下載主題

1.23MB (.ai)

使用 Material 主題

自定義屬於你的品牌識別

翻譯： Tillonter

更新：Casper