/
DarkMode.ts
122 lines (120 loc) · 3.06 KB
/
DarkMode.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import { DefaultTheme } from 'styled-components'
import { lighten } from 'polished'
const DarkTheme: DefaultTheme = {
// USE THESE \\
whiteFade100: 'rgba(255, 255, 255, 0.1)',
whiteFade200: 'rgba(255, 255, 255, 0.2)',
whiteFade300: 'rgba(255, 255, 255, 0.3)',
whiteFade400: 'rgba(255, 255, 255, 0.4)',
whiteFade600: 'rgba(255, 255, 255, 0.6)',
whiteFade700: 'rgba(255, 255, 255, 0.7)',
whiteFade800: 'rgba(255, 255, 255, 0.8)',
whiteFade900: 'rgba(255, 255, 255, 0.9)',
greyFade000: 'rgba(255, 255, 255, 0.02)',
greyFade100: 'rgba(255, 255, 255, 0.1)',
greyFade200: 'rgba(255, 255, 255, 0.2)',
greyFade300: 'rgba(255, 255, 255, 0.3)',
greyFade400: 'rgba(80, 89, 107, 0.4)',
greyFade600: 'rgba(3, 17, 47, 0.6)',
greyFade800: 'rgba(18, 29, 51, 0.8)',
grey000: '#50596B',
grey100: '#50596B',
grey200: '#B1B8C7',
grey300: '#B1B8C7',
grey400: '#98A1B2',
grey500: '#828B9E',
grey600: '#677185',
grey700: lighten(0.1, '#50596B'),
grey800: lighten(0.1, '#B1B8C7'),
grey900: '#121D33',
blue000: '#ECF5FE',
blue100: '#D8EBFD',
blue200: '#BBDBFC',
blue300: '#85B5F8',
blue400: '#619FF7',
blue500: '#3D89F5',
blue600: '#0C6CF2',
blue700: '#1656B9',
blue800: '#144699',
blue900: '#0D3578',
green000: '#E6F5EB',
green100: '#D1F0DB',
green200: '#B8E5C7',
green300: '#8BDCB3',
green400: '#59CD93',
green500: '#339F7B',
green600: '#00994C',
green700: '#006B47',
green800: '#04593D',
green900: '#004025',
orange000: '#FFF2E5',
orange100: '#FFE6CC',
orange200: '#FFD6AD',
orange300: '#FFC994',
orange400: '#FFB266',
orange500: '#F5A250',
orange600: '#F28B24',
orange700: '#D96716',
orange800: '#B24400',
orange900: '#8C2F00',
red000: '#FAECEB',
red100: '#F5D9D7',
red200: '#F0C3C0',
red300: '#F6A7A1',
red400: '#F28979',
red500: '#EA5B50',
red600: '#D93B30',
red700: '#B2251B',
red800: '#99180F',
red900: '#800900',
algo: '#000000',
btc: '#FF9B22',
'btc-light': '#FFF2E5',
bch: '#8DC351',
'bch-light': 'rgba(141, 195, 81, 0.15)',
eth: '#473BCB',
'eth-light': '#EFECFE',
pax: '#00522C',
stx: '#211F6D',
'usd-d': '#00522C',
'usd-d-light': 'rgba(0, 82, 44, 0.15)',
xlm: '#797979',
'xlm-light': 'rgba(0, 0, 0, 0.15)',
usdt: '#26A17B',
'usdt-light': 'rgba(38, 161, 123, 0.15)',
// OLD - AVOID USE \\
// Brand
'brand-yellow': '#665227',
'brand-yellow-lighter': '#7F735A',
'logo-primary': '#153A62',
'logo-secondary': '#799EB2',
'logo-tertiary': '#3558A8',
'logo-quaternary': '#B2D5E5',
'logo-quinary': '#10ADE4',
// Exchange
exchangeNight: '#0A0D10',
exchangeTurquoise: '#42F1B8',
// Action
sent: '#D93B30',
received: '#00994C',
transferred: '#3D89F5',
// State
error: '#651D1E',
warn: '#7F4F48',
success: '#00422C',
// Marketing
'marketing-primary': '#3558A8',
'marketing-secondary': '#153A62',
// Whites
white: '#1c1c1c',
silver: '#838383',
alwaysWhite: '#FFFFFF',
// Blacks
black: lighten(0.1, '#B1B8C7'),
textBlack: '#9c9c9c',
// Blues
purple: '#4C18BA',
// Service Announcements
info: '#2C5687'
}
export default DarkTheme