>

Avec ces mots, Google présente la conception des matériaux comme un guide de site pour les pages Web et définit le style de tous ses produits jusqu'à la dernière version du système d'exploitation mobile Android, Lollipop.


L'idée de base de la conception des matériaux est de faire en sorte que les éléments graphiques des matériaux, qui ne sont plus plats et sans ombres comme dans le design plat, prennent une épaisseur et un espace physique. Ensuite, ils sont représentés comme un objet tridimensionnel, la vraie lumière, la surface et le mouvement sont la clé pour passer à mesure qu'ils se déplacent, interagissent et existent dans l'espace. Inspiré par l'étude du papier et de l'encre, mais technologiquement avancé et ouvert à l'imagination et à la magie, le Material Design devient presque une synthèse de Piso Diseño et de Scheumorfismo.


Red

#ffebee

255, 235, 238

#ffcdd2

255, 205, 210

#ef9a9a

239, 154, 154

#e57373

229, 115, 115

#ef5350

239, 83, 80

#f44336

244, 67, 54

#e53935

229, 57, 53

#d32f2f

211, 47, 47

#c62828

198, 40, 40

#b71c1c

183, 28, 28

#ff8a80

255, 138, 128

#ff5252

255, 82, 82

#ff1744

255, 23, 68

#d50000

213, 0, 0

Pink

#fce4ec

252, 228, 236

#f8bbd0

248, 187, 208

#f48fb1

244, 143, 177

#f06292

240, 98, 146

#ec407a

236, 64, 122

#e91e63

233, 30, 99

#d81b60

216, 27, 96

#c2185b

194, 24, 91

#ad1457

173, 20, 87

#880e4f

136, 14, 79

#ff80ab

255, 128, 171

#ff4081

255, 64, 129

#f50057

245, 0, 87

#c51162

197, 17, 98

Purple

#f3e5f5

243, 229, 245

#e1bee7

225, 190, 231

#ce93d8

206, 147, 216

#ba68c8

186, 104, 200

#ab47bc

171, 71, 188

#9c27b0

156, 39, 176

#8e24aa

142, 36, 170

#7b1fa2

123, 31, 162

#6a1b9a

106, 27, 154

#4a148c

74, 20, 140

#ea80fc

234, 128, 252

#e040fb

224, 64, 251

#d500f9

213, 0, 249

#aa00ff

170, 0, 255

Deep purple

#ede7f6

237, 231, 246

#d1c4e9

209, 196, 233

#b39ddb

179, 157, 219

#9575cd

149, 117, 205

#7e57c2

126, 87, 194

#673ab7

103, 58, 183

#5e35b1

94, 53, 177

#512da8

81, 45, 168

#4527a0

69, 39, 160

#311b92

49, 27, 146

#b388ff

179, 136, 255

#7c4dff

124, 77, 255

#651fff

101, 31, 255

#6200ea

98, 0, 234

Indigo

#e8eaf6

232, 234, 246

#c5cae9

197, 202, 233

#9fa8da

159, 168, 218

#7986cb

121, 134, 203

#5c6bc0

92, 107, 192

#3f51b5

63, 81, 181

#3949ab

57, 73, 171

#303f9f

48, 63, 159

#283593

40, 53, 147

#1a237e

26, 35, 126

#8c9eff

140, 158, 255

#536dfe

83, 109, 254

#3d5afe

61, 90, 254

#304ffe

48, 79, 254

Blue

#e3f2fd

227, 242, 253

#bbdefb

187, 222, 251

#90caf9

144, 202, 249

#64b5f6

100, 181, 246

#42a5f5

66, 165, 245

#2196f3

33, 150, 243

#1e88e5

30, 136, 229

#1976d2

25, 118, 210

#1565c0

21, 101, 192

#0d47a1

13, 71, 161

#82b1ff

130, 177, 255

#448aff

68, 138, 255

#2979ff

41, 121, 255

#2962ff

41, 98, 255

Light blue

#e1f5fe

225, 245, 254

#b3e5fc

179, 229, 252

#81d4fa

129, 212, 250

#4fc3f7

79, 195, 247

#29b6f6

41, 182, 246

#03a9f4

3, 169, 244

#039be5

3, 155, 229

#0288d1

2, 136, 209

#0277bd

2, 119, 189

#01579b

1, 87, 155

#80d8ff

128, 216, 255

#40c4ff

64, 196, 255

#00b0ff

0, 176, 255

#0091ea

0, 145, 234

Cyan

#e0f7fa

224, 247, 250

#b2ebf2

178, 235, 242

#80deea

128, 222, 234

#4dd0e1

77, 208, 225

#26c6da

38, 198, 218

#00bcd4

0, 188, 212

#00acc1

0, 172, 193

#0097a7

0, 151, 167

#00838f

0, 131, 143

#006064

0, 96, 100

#84ffff

132, 255, 255

#18ffff

24, 255, 255

#00e5ff

0, 229, 255

#00b8d4

0, 184, 212

Teal

#e0f2f1

224, 242, 241

#b2dfdb

178, 223, 219

#80cbc4

128, 203, 196

#4db6ac

77, 182, 172

#26a69a

38, 166, 154

#009688

0, 150, 136

#00897b

0, 137, 123

#00796b

0, 121, 107

#00695c

0, 105, 92

#004d40

0, 77, 64

#a7ffeb

167, 255, 235

#64ffda

100, 255, 218

#1de9b6

29, 233, 182

#00bfa5

0, 191, 165

Green

#e8f5e9

232, 245, 233

#c8e6c9

200, 230, 201

#a5d6a7

165, 214, 167

#81c784

129, 199, 132

#66bb6a

102, 187, 106

#4caf50

76, 175, 80

#43a047

67, 160, 71

#388e3c

56, 142, 60

#2e7d32

46, 125, 50

#1b5e20

27, 94, 32

#b9f6ca

185, 246, 202

#69f0ae

105, 240, 174

#00e676

0, 230, 118

#00c853

0, 200, 83

Light green

#f1f8e9

241, 248, 233

#dcedc8

220, 237, 200

#c5e1a5

197, 225, 165

#aed581

174, 213, 129

#9ccc65

156, 204, 101

#8bc34a

139, 195, 74

#7cb342

124, 179, 66

#689f38

104, 159, 56

#558b2f

85, 139, 47

#33691e

51, 105, 30

#ccff90

204, 255, 144

#b2ff59

178, 255, 89

#76ff03

118, 255, 3

#64dd17

100, 221, 23

Lime

#f9fbe7

249, 251, 231

#f0f4c3

240, 244, 195

#e6ee9c

230, 238, 156

#dce775

220, 231, 117

#d4e157

212, 225, 87

#cddc39

205, 220, 57

#c0ca33

192, 202, 51

#afb42b

175, 180, 43

#9e9d24

158, 157, 36

#827717

130, 119, 23

#f4ff81

244, 255, 129

#eeff41

238, 255, 65

#c6ff00

198, 255, 0

#aeea00

174, 234, 0

Yellow

#fffde7

255, 253, 231

#fff9c4

255, 249, 196

#fff59d

255, 245, 157

#fff176

255, 241, 118

#ffee58

255, 238, 88

#ffeb3b

55, 235, 59

#fdd835

253, 216, 53

#fbc02d

251, 192, 45

#f9a825

249, 168, 37

#f57f17

245, 127, 23

#ffff8d

255, 255, 141

#ffff00

255, 255, 0

#ffea00

255, 234, 0

#ffd600

255, 214, 0

Amber

#fff8e1

255, 248, 225

#ffecb3

255, 236, 179

#ffe082

255, 224, 130

#ffd54f

255, 213, 79

#ffca28

255, 202, 40

#ffc107

255, 193, 7

#ffb300

255, 179, 0

#ffa000

255, 160, 0

#ff8f00

255, 143, 0

#ff6f00

255, 111, 0

#ffe57f

255, 229, 127

#ffd740

255, 215, 64

#ffc400

255, 196, 0

#ffab00

255, 171, 0

Orange

#fff3e0

255, 243, 224

#ffe0b2

255, 224, 178

#ffcc80

255, 204, 128

#ffb74d

255, 183, 77

#ffa726

255, 167, 38

#ff9800

255, 152, 0

#fb8c00

251, 140, 0

#f57c00

245, 124, 0

#ef6c00

239, 108, 0

#e65100

230, 81, 0

#ffd180

255, 209, 128

#ffab40

255, 171, 64

#ff9100

255, 145, 0

#ff6d00

255, 109, 0

Deep orange

#fbe9e7

251, 233, 231

#ffccbc

255, 204, 188

#ffab91

255, 171, 145

#ff8a65

255, 138, 101

#ff7043

255, 112, 67

#ff5722

255, 87, 34

#f4511e

244, 81, 30

#e64a19

230, 74, 25

#d84315

216, 67, 21

#bf360c

191, 54, 12

#ff9e80

255, 158, 128

#ff6e40

255, 110, 64

#ff3d00

255, 61, 0

#dd2c00

221, 44, 0

Brown

#efebe9

239, 235, 233

#d7ccc8

215, 204, 200

#bcaaa4

188, 170, 164

#a1887f

161, 136, 127

#8d6e63

141, 110, 99

#795548

121, 85, 72

#6d4c41

109, 76, 65

#5d4037

93, 64, 55

#4e342e

78, 52, 46

#3e2723

62, 39, 35

Grey

#fafafa

250, 250, 250

#f5f5f5

245, 245, 245

#eeeeee

238, 238, 238

#e0e0e0

224, 224, 224

#bdbdbd

189, 189, 189

#9e9e9e

158, 158, 158

#757575

117, 117, 117

#616161

97, 97, 97

#424242

66, 66, 66

#212121

33, 33, 33

Blue grey

#eceff1

236, 239, 241

#cfd8dc

207, 216, 220

#b0bec5

176, 190, 197

#90a4ae

144, 164, 174

#78909c

120, 144, 156

#607d8b

96, 125, 139

#546e7a

84, 110, 122

#455a64

69, 90, 100

#37474f

55, 71, 79

#263238

38, 50, 56

White

#ffffff

255, 255, 255

#000000

0, 0, 0