本文出自Mockplus團隊，Mockplus是一款更快更簡單的原型設計工具。
自Material Design的設計理念推出以來，Google的內部設計語言實現了從古老的使用者介面向現代網路的現代外觀的轉變。最大的改變之一是使用大膽鮮明的顏色。Material Design的色彩指南將其顏色風格描述為“受到柔和環境，深色陰影和明亮亮點並置的大膽色調的啟發。”
越來越多的網站和App在設計中運用到材料設計，並趨向於使用谷歌官方的材料設計色彩搭配。Material design的顏色概念大多借用了扁平設計的趨勢。它配色大膽明亮。字型排版也跟simple sans serifs字型一樣遵循扁平主題。
根據Material design的官方檔案：
“色彩從當代建築、路標、人行橫道以及運動場館中獲取靈感，由此引發出大膽的顏色表達啟用了色彩，與單調乏味的周邊環境形成鮮明的對比。強調大膽的陰影和高光。引出意想不到且充滿活力的顏色。”
顏色是品牌標識中最重要的元素之一。例如Facebook中的藍色或UBER中的黑白主題。而在我們自己的設計中，使用哪種工具，選擇哪種顏色能最好的突出品牌感，也是一件頭疼的事情。以下是我整理的材料設計的顏色工具，希望能助你一臂之力。
材料設計顏色工具
1. Material.io
網站特點：完整的配色方案
地址：http: www.material.io
Material.io是谷歌官方的材料設計配色工具。使用者只需要在右側調色盤中選中喜歡的顏色，左側介面區域會立即顯示該種顏色在App介面中所呈現的效果。右下方的配色方案區域會顯示當前的主色彩、次要色彩和文字顏色的色號。而你需要的就是將它提供的配色方案運用到你的App設計中。
Tips：
（1）在Material Design中，主要顏色是指在您的應用中最常出現的顏色。一個輔助色是指用來強調自己的UI的關鍵部分的顏色。
（2）次要顏色最適合用於：
- 按鈕，浮動操作按鈕和按鈕文字
- 文字欄位，游標和文字選擇
- 進度條
- 選擇控制元件，按鈕和滑塊
- 連結
- 標題
2. Material Colors
網站特點：
- 配色即時預覽
- 支援下載
- 線上分享
Material Colors不僅是個調色盤，也是圖示工具和色彩工具。Material Palette主要特色是可以讓使用者一邊選擇顏色同時還能實時預覽效果圖，並且使用者只需要選擇1個或2個顏色後系統會自己匹配出一組APP UI 配色方案。值得一提的是，這個網站提供了線上分享和多種格式的下載。
3. Material UI
網站特色：
- 顏色程式碼可直接複製貼上
- 支援多種顏色格式切換
這個工具主要是面向希望快速訪問材料設計顏色程式碼的開發人員和設計人員。使用者可以點選顏色框並將相應的顏色程式碼自動複製到剪貼簿。這個網站也被稱作是顏色“小抄”，它把所有能提供給的顏色都匯聚在一個頁面上供使用者選擇，非常方便。
4. Material Design Palette Generator
網站特色：自定義色板
如果你對自定義色板感興趣，那麼試試Material-design-like這個工具吧。首先，你需要手動設定一種顏色——不是系統色也可以哦——然後在同色系的色彩選擇對話視窗中找到你最喜歡的圖形編輯器。材料設計皮膚生成器將根據你選擇的顏色生成你的色板。
5. Color - Materialize
網站特色：支援顏色明暗調整
地址：materializecss.com/color.html
這是一個基於材料設計基礎顏色的調色盤。這些顏色中的每一種都用基本顏色類和可選的變亮或變暗類來定義。
安卓材料色彩資源
1. Sketchappsources
這個網站提供各種設計相關的免費資源下載。你可以在這裡找到安卓材料設計的調色盤資源並且可以免費下載。
2. Android Material Design Colours
這是Github上面的網友提供的安卓材料顏色程式碼。每個主色調下面都涵蓋了各種不同色調的顏色程式碼。直接複製貼上即可使用，節省了不少時間。
Material design風格應用設計欣賞
1. Google Hangouts
谷歌旗下產品之一，在應用設計方面很好的遵循了Material design的設計原則和配色方案。是一款典型的谷歌材料設計的App案例。
2. Weather Timeline
這款應用的配色非常符合上面提到的材料設計色彩工具的配色原則。在主色彩、次要色彩和文字顏色，以及按鈕顏色的搭配上非常鮮明且大膽。
Material design風格網頁設計欣賞
1. Google
提到Material design，怎麼能錯過谷歌呢？作為谷歌自家的設計語言，當然是在自家網站上運用最為出色了。Material Design風格的設計在於擁有乾淨的排版和簡單的佈局,易於理解,內容才是焦點。
2. WhatsApp
WhatsApp作為一款深受老外喜愛的及時通訊工具，在其網頁版的設計和手機端設計上都貫徹了材料設計的理念。WhatsApp在主色調的選取上並沒使用很豔麗的顏色，反而似乎是為了給人一種沉穩的感覺，在配色上混入了一點點的灰色。
看完上面的工具和案例後，你是否也想過如何藉助材料設計理念與色彩搭配建立自己的網站或手機App呢?
答案很簡單。你只需要一款材料設計風格的原型工具！作為一款正宗國產的原型設計工具，Mockplus無論在網站原型設計或是手機App原型設計方面都有其獨特的優勢。結合軟體內建的材料設計風格的元件和上面我為大家總結的材料設計配色方案，輕鬆設計一款Materia design風格的應用或網站不再是難題！
總結
顏色作為品牌標識中最重要的元素，在實際運用的時候需要慎重考慮。如何正確的使用顏色搭配，是一門大學問。希望上面羅列的資源可以幫你挑選出最美的Material design色彩方案。