1 1
const red = Object.freeze({
2
  base: '#f44336',
3
  lighten5: '#ffebee',
4
  lighten4: '#ffcdd2',
5
  lighten3: '#ef9a9a',
6
  lighten2: '#e57373',
7
  lighten1: '#ef5350',
8
  darken1: '#e53935',
9
  darken2: '#d32f2f',
10
  darken3: '#c62828',
11
  darken4: '#b71c1c',
12
  accent1: '#ff8a80',
13
  accent2: '#ff5252',
14
  accent3: '#ff1744',
15
  accent4: '#d50000',
16
})
17

18 1
const pink = Object.freeze({
19
  base: '#e91e63',
20
  lighten5: '#fce4ec',
21
  lighten4: '#f8bbd0',
22
  lighten3: '#f48fb1',
23
  lighten2: '#f06292',
24
  lighten1: '#ec407a',
25
  darken1: '#d81b60',
26
  darken2: '#c2185b',
27
  darken3: '#ad1457',
28
  darken4: '#880e4f',
29
  accent1: '#ff80ab',
30
  accent2: '#ff4081',
31
  accent3: '#f50057',
32
  accent4: '#c51162',
33
})
34

35 1
const purple = Object.freeze({
36
  base: '#9c27b0',
37
  lighten5: '#f3e5f5',
38
  lighten4: '#e1bee7',
39
  lighten3: '#ce93d8',
40
  lighten2: '#ba68c8',
41
  lighten1: '#ab47bc',
42
  darken1: '#8e24aa',
43
  darken2: '#7b1fa2',
44
  darken3: '#6a1b9a',
45
  darken4: '#4a148c',
46
  accent1: '#ea80fc',
47
  accent2: '#e040fb',
48
  accent3: '#d500f9',
49
  accent4: '#aa00ff',
50
})
51

52 1
const deepPurple = Object.freeze({
53
  base: '#673ab7',
54
  lighten5: '#ede7f6',
55
  lighten4: '#d1c4e9',
56
  lighten3: '#b39ddb',
57
  lighten2: '#9575cd',
58
  lighten1: '#7e57c2',
59
  darken1: '#5e35b1',
60
  darken2: '#512da8',
61
  darken3: '#4527a0',
62
  darken4: '#311b92',
63
  accent1: '#b388ff',
64
  accent2: '#7c4dff',
65
  accent3: '#651fff',
66
  accent4: '#6200ea',
67
})
68

69 1
const indigo = Object.freeze({
70
  base: '#3f51b5',
71
  lighten5: '#e8eaf6',
72
  lighten4: '#c5cae9',
73
  lighten3: '#9fa8da',
74
  lighten2: '#7986cb',
75
  lighten1: '#5c6bc0',
76
  darken1: '#3949ab',
77
  darken2: '#303f9f',
78
  darken3: '#283593',
79
  darken4: '#1a237e',
80
  accent1: '#8c9eff',
81
  accent2: '#536dfe',
82
  accent3: '#3d5afe',
83
  accent4: '#304ffe',
84
})
85

86 1
const blue = Object.freeze({
87
  base: '#2196f3',
88
  lighten5: '#e3f2fd',
89
  lighten4: '#bbdefb',
90
  lighten3: '#90caf9',
91
  lighten2: '#64b5f6',
92
  lighten1: '#42a5f5',
93
  darken1: '#1e88e5',
94
  darken2: '#1976d2',
95
  darken3: '#1565c0',
96
  darken4: '#0d47a1',
97
  accent1: '#82b1ff',
98
  accent2: '#448aff',
99
  accent3: '#2979ff',
100
  accent4: '#2962ff',
101
})
102

103 1
const lightBlue = Object.freeze({
104
  base: '#03a9f4',
105
  lighten5: '#e1f5fe',
106
  lighten4: '#b3e5fc',
107
  lighten3: '#81d4fa',
108
  lighten2: '#4fc3f7',
109
  lighten1: '#29b6f6',
110
  darken1: '#039be5',
111
  darken2: '#0288d1',
112
  darken3: '#0277bd',
113
  darken4: '#01579b',
114
  accent1: '#80d8ff',
115
  accent2: '#40c4ff',
116
  accent3: '#00b0ff',
117
  accent4: '#0091ea',
118
})
119

120 1
const cyan = Object.freeze({
121
  base: '#00bcd4',
122
  lighten5: '#e0f7fa',
123
  lighten4: '#b2ebf2',
124
  lighten3: '#80deea',
125
  lighten2: '#4dd0e1',
126
  lighten1: '#26c6da',
127
  darken1: '#00acc1',
128
  darken2: '#0097a7',
129
  darken3: '#00838f',
130
  darken4: '#006064',
131
  accent1: '#84ffff',
132
  accent2: '#18ffff',
133
  accent3: '#00e5ff',
134
  accent4: '#00b8d4',
135
})
136

137 1
const teal = Object.freeze({
138
  base: '#009688',
139
  lighten5: '#e0f2f1',
140
  lighten4: '#b2dfdb',
141
  lighten3: '#80cbc4',
142
  lighten2: '#4db6ac',
143
  lighten1: '#26a69a',
144
  darken1: '#00897b',
145
  darken2: '#00796b',
146
  darken3: '#00695c',
147
  darken4: '#004d40',
148
  accent1: '#a7ffeb',
149
  accent2: '#64ffda',
150
  accent3: '#1de9b6',
151
  accent4: '#00bfa5',
152
})
153

154 1
const green = Object.freeze({
155
  base: '#4caf50',
156
  lighten5: '#e8f5e9',
157
  lighten4: '#c8e6c9',
158
  lighten3: '#a5d6a7',
159
  lighten2: '#81c784',
160
  lighten1: '#66bb6a',
161
  darken1: '#43a047',
162
  darken2: '#388e3c',
163
  darken3: '#2e7d32',
164
  darken4: '#1b5e20',
165
  accent1: '#b9f6ca',
166
  accent2: '#69f0ae',
167
  accent3: '#00e676',
168
  accent4: '#00c853',
169
})
170

171 1
const lightGreen = Object.freeze({
172
  base: '#8bc34a',
173
  lighten5: '#f1f8e9',
174
  lighten4: '#dcedc8',
175
  lighten3: '#c5e1a5',
176
  lighten2: '#aed581',
177
  lighten1: '#9ccc65',
178
  darken1: '#7cb342',
179
  darken2: '#689f38',
180
  darken3: '#558b2f',
181
  darken4: '#33691e',
182
  accent1: '#ccff90',
183
  accent2: '#b2ff59',
184
  accent3: '#76ff03',
185
  accent4: '#64dd17',
186
})
187

188 1
const lime = Object.freeze({
189
  base: '#cddc39',
190
  lighten5: '#f9fbe7',
191
  lighten4: '#f0f4c3',
192
  lighten3: '#e6ee9c',
193
  lighten2: '#dce775',
194
  lighten1: '#d4e157',
195
  darken1: '#c0ca33',
196
  darken2: '#afb42b',
197
  darken3: '#9e9d24',
198
  darken4: '#827717',
199
  accent1: '#f4ff81',
200
  accent2: '#eeff41',
201
  accent3: '#c6ff00',
202
  accent4: '#aeea00',
203
})
204

205 1
const yellow = Object.freeze({
206
  base: '#ffeb3b',
207
  lighten5: '#fffde7',
208
  lighten4: '#fff9c4',
209
  lighten3: '#fff59d',
210
  lighten2: '#fff176',
211
  lighten1: '#ffee58',
212
  darken1: '#fdd835',
213
  darken2: '#fbc02d',
214
  darken3: '#f9a825',
215
  darken4: '#f57f17',
216
  accent1: '#ffff8d',
217
  accent2: '#ffff00',
218
  accent3: '#ffea00',
219
  accent4: '#ffd600',
220
})
221

222 1
const amber = Object.freeze({
223
  base: '#ffc107',
224
  lighten5: '#fff8e1',
225
  lighten4: '#ffecb3',
226
  lighten3: '#ffe082',
227
  lighten2: '#ffd54f',
228
  lighten1: '#ffca28',
229
  darken1: '#ffb300',
230
  darken2: '#ffa000',
231
  darken3: '#ff8f00',
232
  darken4: '#ff6f00',
233
  accent1: '#ffe57f',
234
  accent2: '#ffd740',
235
  accent3: '#ffc400',
236
  accent4: '#ffab00',
237
})
238

239 1
const orange = Object.freeze({
240
  base: '#ff9800',
241
  lighten5: '#fff3e0',
242
  lighten4: '#ffe0b2',
243
  lighten3: '#ffcc80',
244
  lighten2: '#ffb74d',
245
  lighten1: '#ffa726',
246
  darken1: '#fb8c00',
247
  darken2: '#f57c00',
248
  darken3: '#ef6c00',
249
  darken4: '#e65100',
250
  accent1: '#ffd180',
251
  accent2: '#ffab40',
252
  accent3: '#ff9100',
253
  accent4: '#ff6d00',
254
})
255

256 1
const deepOrange = Object.freeze({
257
  base: '#ff5722',
258
  lighten5: '#fbe9e7',
259
  lighten4: '#ffccbc',
260
  lighten3: '#ffab91',
261
  lighten2: '#ff8a65',
262
  lighten1: '#ff7043',
263
  darken1: '#f4511e',
264
  darken2: '#e64a19',
265
  darken3: '#d84315',
266
  darken4: '#bf360c',
267
  accent1: '#ff9e80',
268
  accent2: '#ff6e40',
269
  accent3: '#ff3d00',
270
  accent4: '#dd2c00',
271
})
272

273 1
const brown = Object.freeze({
274
  base: '#795548',
275
  lighten5: '#efebe9',
276
  lighten4: '#d7ccc8',
277
  lighten3: '#bcaaa4',
278
  lighten2: '#a1887f',
279
  lighten1: '#8d6e63',
280
  darken1: '#6d4c41',
281
  darken2: '#5d4037',
282
  darken3: '#4e342e',
283
  darken4: '#3e2723',
284
})
285

286 1
const blueGrey = Object.freeze({
287
  base: '#607d8b',
288
  lighten5: '#eceff1',
289
  lighten4: '#cfd8dc',
290
  lighten3: '#b0bec5',
291
  lighten2: '#90a4ae',
292
  lighten1: '#78909c',
293
  darken1: '#546e7a',
294
  darken2: '#455a64',
295
  darken3: '#37474f',
296
  darken4: '#263238',
297
})
298

299 1
const grey = Object.freeze({
300
  base: '#9e9e9e',
301
  lighten5: '#fafafa',
302
  lighten4: '#f5f5f5',
303
  lighten3: '#eeeeee',
304
  lighten2: '#e0e0e0',
305
  lighten1: '#bdbdbd',
306
  darken1: '#757575',
307
  darken2: '#616161',
308
  darken3: '#424242',
309
  darken4: '#212121',
310
})
311

312 1
const shades = Object.freeze({
313
  black: '#000000',
314
  white: '#ffffff',
315
  transparent: 'transparent',
316
})
317

318
export default Object.freeze({
319
  red,
320
  pink,
321
  purple,
322
  deepPurple,
323
  indigo,
324
  blue,
325
  lightBlue,
326
  cyan,
327
  teal,
328
  green,
329
  lightGreen,
330
  lime,
331
  yellow,
332
  amber,
333
  orange,
334
  deepOrange,
335
  brown,
336
  blueGrey,
337
  grey,
338
  shades,
339
})

Read our documentation on viewing source code .

Loading