material design UI 色版



http://www.google.com/design/spec/style/color.html#color-ui-color-palette 

Google material design提供了色板的参考值，下面是显示效果。

colors.xml

[html] view plain copy print ?

1. <?xml version="1.0" encoding="utf-8"?>  
2.     <resources>  
3.         <color name="red50">#fde0dc</color>  
4.         <color name="red100">#f9bdbb</color>  
5.         <color name="red200">#f69988</color>  
6.         <color name="red300">#f36c60</color>  
7.         <color name="red400">#e84e40</color>  
8.         <color name="red500">#e51c23</color>  
9.         <color name="red600">#dd191d</color>  
10.         <color name="red700">#d01716</color>  
11.         <color name="red800">#c41411</color>  
12.         <color name="red900">#b0120a</color>  
13.         <color name="reda100">#ff7997</color>  
14.         <color name="reda200">#ff5177</color>  
15.         <color name="reda400">#ff2d6f</color>  
16.         <color name="reda700">#e00032</color>          
17.           
18.         <color name="pink50">#fce4ec</color>  
19.         <color name="pink100">#f8bbd0</color>  
20.         <color name="pink200">#f48fb1</color>  
21.         <color name="pink300">#f06292</color>  
22.         <color name="pink400">#ec407a</color>  
23.         <color name="pink500">#e91e63</color>  
24.         <color name="pink600">#d81b60</color>  
25.         <color name="pink700">#c2185b</color>  
26.         <color name="pink800">#ad1457</color>  
27.         <color name="pink900">#880e4f</color>  
28.         <color name="pinka100">#ff80ab</color>  
29.         <color name="pinka200">#ff4081</color>  
30.         <color name="pinka400">#f50057</color>  
31.         <color name="pinka700">#c51162</color>  
32.                           
33.         <color name="purple50">#f3e5f5</color>  
34.         <color name="purple100">#e1bee7</color>  
35.         <color name="purple200">#ce93d8</color>  
36.         <color name="purple300">#ba68c8</color>  
37.         <color name="purple400">#ab47bc</color>  
38.         <color name="purple500">#9c27b0</color>  
39.         <color name="purple600">#8e24aa</color>  
40.         <color name="purple700">#7b1fa2</color>  
41.         <color name="purple800">#6a1b9a</color>  
42.         <color name="purple900">#4a148c</color>  
43.         <color name="purplea100">#ea80fc</color>  
44.         <color name="purplea200">#e040fb</color>  
45.         <color name="purplea400">#d500f9</color>  
46.         <color name="purplea700">#aa00ff</color>  
47.                   
48.         <color name="deeppurple50">#ede7f6</color>  
49.         <color name="deeppurple100">#d1c4e9</color>  
50.         <color name="deeppurple200">#b39ddb</color>  
51.         <color name="deeppurple300">#9575cd</color>  
52.         <color name="deeppurple400">#7e57c2</color>  
53.         <color name="deeppurple500">#673ab7</color>  
54.         <color name="deeppurple600">#5e35b1</color>  
55.         <color name="deeppurple700">#512da8</color>  
56.         <color name="deeppurple800">#4527a0</color>  
57.         <color name="deeppurple900">#311b92</color>  
58.         <color name="deeppurplea100">#b388ff</color>  
59.         <color name="deeppurplea200">#7c4dff</color>  
60.         <color name="deeppurplea400">#651fff</color>  
61.         <color name="deeppurplea700">#6200ea</color>  
62.                   
63.         <color name="indigo50">#e8eaf6</color>  
64.         <color name="indigo100">#c5cae9</color>  
65.         <color name="indigo200">#9fa8da</color>  
66.         <color name="indigo300">#7986cb</color>  
67.         <color name="indigo400">#5c6bc0</color>  
68.         <color name="indigo500">#3f51b5</color>  
69.         <color name="indigo600">#3949ab</color>  
70.         <color name="indigo700">#303f9f</color>  
71.         <color name="indigo800">#283593</color>  
72.         <color name="indigo900">#1a237e</color>  
73.         <color name="indigoa100">#8c9eff</color>  
74.         <color name="indigoa200">#536dfe</color>  
75.         <color name="indigoa400">#3d5afe</color>  
76.         <color name="indigoa700">#304ffe</color>  
77.                   
78.         <color name="blue50">#e7e9fd</color>  
79.         <color name="blue100">#d0d9ff</color>  
80.         <color name="blue200">#afbfff</color>  
81.         <color name="blue300">#91a7ff</color>  
82.         <color name="blue400">#738ffe</color>  
83.         <color name="blue500">#5677fc</color>  
84.         <color name="blue600">#4e6cef</color>  
85.         <color name="blue700">#455ede</color>  
86.         <color name="blue800">#3b50ce</color>  
87.         <color name="blue900">#2a36b1</color>  
88.         <color name="bluea100">#a6baff</color>  
89.         <color name="bluea200">#6889ff</color>  
90.         <color name="bluea400">#4d73ff</color>  
91.         <color name="bluea700">#4d69ff</color>  
92.                   
93.         <color name="lightblue50">#e1f5fe</color>  
94.         <color name="lightblue100">#b3e5fc</color>  
95.         <color name="lightblue200">#81d4fa</color>  
96.         <color name="lightblue300">#4fc3f7</color>  
97.         <color name="lightblue400">#29b6f6</color>  
98.         <color name="lightblue500">#03a9f4</color>  
99.         <color name="lightblue600">#039be5</color>  
100.         <color name="lightblue700">#0288d1</color>  
101.         <color name="lightblue800">#0277bd</color>  
102.         <color name="lightblue900">#01579b</color>  
103.         <color name="lightbluea100">#80d8ff</color>  
104.         <color name="lightbluea200">#40c4ff</color>  
105.         <color name="lightbluea400">#00b0ff</color>  
106.         <color name="lightbluea700">#0091ea</color>     
107.           
108.         <color name="cyan50">#e0f7fa</color>  
109.         <color name="cyan100">#b2ebf2</color>  
110.         <color name="cyan200">#80deea</color>  
111.         <color name="cyan300">#4dd0e1</color>  
112.         <color name="cyan400">#26c6da</color>  
113.         <color name="cyan500">#00bcd4</color>  
114.         <color name="cyan600">#00acc1</color>  
115.         <color name="cyan700">#0097a7</color>  
116.         <color name="cyan800">#00838f</color>  
117.         <color name="cyan900">#006064</color>  
118.         <color name="cyana100">#84ffff</color>  
119.         <color name="cyana200">#18ffff</color>  
120.         <color name="cyana400">#00e5ff</color>  
121.         <color name="cyana700">#00b8d4</color>  
122.           
123.         <color name="teal50">#e0f2f1</color>  
124.         <color name="teal100">#b2dfdb</color>  
125.         <color name="teal200">#80cbc4</color>  
126.         <color name="teal300">#4db6ac</color>  
127.         <color name="teal400">#26a69a</color>  
128.         <color name="teal500">#009688</color>  
129.         <color name="teal600">#00897b</color>  
130.         <color name="teal700">#00796b</color>  
131.         <color name=