@atlaskit/tokens 13.2.0 → 13.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/dist/cjs/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
- package/dist/cjs/artifacts/themes/atlassian-light.js +2 -2
- package/dist/cjs/artifacts/token-default-values.js +118 -107
- package/dist/cjs/artifacts/token-names.js +118 -107
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3415 -3173
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +3183 -2941
- package/dist/cjs/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3415 -3173
- package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +3183 -2941
- package/dist/cjs/entry-points/token-metadata.codegen.js +1751 -1652
- package/dist/cjs/utils/token-order.js +1 -1
- package/dist/cjs/utils/token-usage-guidelines.js +14 -1
- package/dist/es2019/artifacts/themes/atlassian-dark-increased-contrast.js +118 -107
- package/dist/es2019/artifacts/themes/atlassian-dark.js +118 -107
- package/dist/es2019/artifacts/themes/atlassian-light-increased-contrast.js +118 -107
- package/dist/es2019/artifacts/themes/atlassian-light.js +118 -107
- package/dist/es2019/artifacts/token-default-values.js +118 -107
- package/dist/es2019/artifacts/token-names.js +118 -107
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3415 -3173
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +3183 -2941
- package/dist/es2019/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3415 -3173
- package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +3183 -2941
- package/dist/es2019/entry-points/token-metadata.codegen.js +1751 -1652
- package/dist/es2019/utils/token-order.js +1 -1
- package/dist/es2019/utils/token-usage-guidelines.js +14 -1
- package/dist/esm/artifacts/themes/atlassian-dark-increased-contrast.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-dark.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-light-increased-contrast.js +2 -2
- package/dist/esm/artifacts/themes/atlassian-light.js +2 -2
- package/dist/esm/artifacts/token-default-values.js +118 -107
- package/dist/esm/artifacts/token-names.js +118 -107
- package/dist/esm/artifacts/tokens-raw/atlassian-dark-increased-contrast.js +3415 -3173
- package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +3183 -2941
- package/dist/esm/artifacts/tokens-raw/atlassian-light-increased-contrast.js +3415 -3173
- package/dist/esm/artifacts/tokens-raw/atlassian-light.js +3183 -2941
- package/dist/esm/entry-points/token-metadata.codegen.js +1751 -1652
- package/dist/esm/utils/token-order.js +1 -1
- package/dist/esm/utils/token-usage-guidelines.js +14 -1
- package/dist/types/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-dark.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
- package/dist/types/artifacts/themes/atlassian-light.d.ts +2 -2
- package/dist/types/artifacts/token-default-values.d.ts +118 -107
- package/dist/types/artifacts/token-names.d.ts +235 -213
- package/dist/types/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
- package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
- package/dist/types/artifacts/types-internal.d.ts +2 -2
- package/dist/types/artifacts/types.d.ts +2 -2
- package/dist/types/entry-points/css-type-schema.codegen.d.ts +6 -6
- package/dist/types/entry-points/token-metadata.codegen.d.ts +1 -1
- package/dist/types/types.d.ts +23 -0
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark-increased-contrast.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/themes/atlassian-light-increased-contrast.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/themes/atlassian-light.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/token-default-values.d.ts +118 -107
- package/dist/types-ts4.5/artifacts/token-names.d.ts +235 -213
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light.d.ts +1 -1
- package/dist/types-ts4.5/artifacts/types-internal.d.ts +2 -2
- package/dist/types-ts4.5/artifacts/types.d.ts +2 -2
- package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +6 -6
- package/dist/types-ts4.5/entry-points/token-metadata.codegen.d.ts +1 -1
- package/dist/types-ts4.5/types.d.ts +23 -0
- package/figma/atlassian-dark-increased-contrast.json +1301 -1202
- package/figma/atlassian-dark.json +1299 -1200
- package/figma/atlassian-light-increased-contrast.json +1301 -1202
- package/figma/atlassian-light.json +1304 -1205
- package/package.json +1 -1
|
@@ -1,2767 +1,2740 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "Dark increased-contrast",
|
|
3
3
|
"tokens": {
|
|
4
|
-
"Dark increased-contrast/color.
|
|
5
|
-
"value": "#
|
|
4
|
+
"Dark increased-contrast/color.background.accent.lime.subtlest": {
|
|
5
|
+
"value": "#28311B",
|
|
6
6
|
"attributes": {
|
|
7
7
|
"group": "paint",
|
|
8
8
|
"state": "active",
|
|
9
|
-
"introduced": "
|
|
10
|
-
"description": "Use for
|
|
9
|
+
"introduced": "1.6.0",
|
|
10
|
+
"description": "Use for for backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
11
11
|
}
|
|
12
12
|
},
|
|
13
|
-
"Dark increased-contrast/color.
|
|
14
|
-
"value": "#
|
|
13
|
+
"Dark increased-contrast/color.background.accent.lime.subtlest.hovered": {
|
|
14
|
+
"value": "#37471F",
|
|
15
15
|
"attributes": {
|
|
16
16
|
"group": "paint",
|
|
17
17
|
"state": "active",
|
|
18
|
-
"introduced": "1.
|
|
19
|
-
"description": "
|
|
18
|
+
"introduced": "1.19.0",
|
|
19
|
+
"description": "Hovered state of color.background.accent.lime.subtlest."
|
|
20
20
|
}
|
|
21
21
|
},
|
|
22
|
-
"Dark increased-contrast/color.
|
|
23
|
-
"value": "#
|
|
22
|
+
"Dark increased-contrast/color.background.accent.lime.subtlest.pressed": {
|
|
23
|
+
"value": "#3F5224",
|
|
24
24
|
"attributes": {
|
|
25
25
|
"group": "paint",
|
|
26
26
|
"state": "active",
|
|
27
|
-
"introduced": "1.
|
|
28
|
-
"description": "
|
|
27
|
+
"introduced": "1.19.0",
|
|
28
|
+
"description": "Pressed state of color.background.accent.lime.subtlest."
|
|
29
29
|
}
|
|
30
30
|
},
|
|
31
|
-
"Dark increased-contrast/color.
|
|
32
|
-
"value": "#
|
|
31
|
+
"Dark increased-contrast/color.background.accent.lime.subtler": {
|
|
32
|
+
"value": "#37471F",
|
|
33
33
|
"attributes": {
|
|
34
34
|
"group": "paint",
|
|
35
35
|
"state": "active",
|
|
36
|
-
"introduced": "
|
|
37
|
-
"description": "Use for
|
|
36
|
+
"introduced": "1.6.0",
|
|
37
|
+
"description": "Use for for backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
38
38
|
}
|
|
39
39
|
},
|
|
40
|
-
"Dark increased-contrast/color.
|
|
41
|
-
"value": "#
|
|
40
|
+
"Dark increased-contrast/color.background.accent.lime.subtler.hovered": {
|
|
41
|
+
"value": "#3F5224",
|
|
42
42
|
"attributes": {
|
|
43
43
|
"group": "paint",
|
|
44
44
|
"state": "active",
|
|
45
|
-
"introduced": "
|
|
46
|
-
"description": "
|
|
45
|
+
"introduced": "1.19.0",
|
|
46
|
+
"description": "Hovered state of color.background.accent.lime.subtler."
|
|
47
47
|
}
|
|
48
48
|
},
|
|
49
|
-
"Dark increased-contrast/color.
|
|
50
|
-
"value": "#
|
|
49
|
+
"Dark increased-contrast/color.background.accent.lime.subtler.pressed": {
|
|
50
|
+
"value": "#4C6B1F",
|
|
51
51
|
"attributes": {
|
|
52
52
|
"group": "paint",
|
|
53
53
|
"state": "active",
|
|
54
|
-
"introduced": "
|
|
55
|
-
"description": "
|
|
54
|
+
"introduced": "1.19.0",
|
|
55
|
+
"description": "Pressed state of color.background.accent.lime.subtler."
|
|
56
56
|
}
|
|
57
57
|
},
|
|
58
|
-
"Dark increased-contrast/color.
|
|
59
|
-
"value": "#
|
|
58
|
+
"Dark increased-contrast/color.background.accent.lime.subtle": {
|
|
59
|
+
"value": "#4C6B1F",
|
|
60
60
|
"attributes": {
|
|
61
61
|
"group": "paint",
|
|
62
62
|
"state": "active",
|
|
63
|
-
"introduced": "
|
|
64
|
-
"description": "Use for
|
|
63
|
+
"introduced": "1.6.0",
|
|
64
|
+
"description": "Use for vibrant for backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
65
65
|
}
|
|
66
66
|
},
|
|
67
|
-
"Dark increased-contrast/color.
|
|
68
|
-
"value": "#
|
|
67
|
+
"Dark increased-contrast/color.background.accent.lime.subtle.hovered": {
|
|
68
|
+
"value": "#3F5224",
|
|
69
69
|
"attributes": {
|
|
70
70
|
"group": "paint",
|
|
71
71
|
"state": "active",
|
|
72
|
-
"introduced": "
|
|
73
|
-
"description": "
|
|
72
|
+
"introduced": "1.19.0",
|
|
73
|
+
"description": "Hovered state of color.background.accent.lime.subtle."
|
|
74
74
|
}
|
|
75
75
|
},
|
|
76
|
-
"Dark increased-contrast/color.
|
|
77
|
-
"value": "#
|
|
76
|
+
"Dark increased-contrast/color.background.accent.lime.subtle.pressed": {
|
|
77
|
+
"value": "#37471F",
|
|
78
78
|
"attributes": {
|
|
79
79
|
"group": "paint",
|
|
80
80
|
"state": "active",
|
|
81
|
-
"introduced": "
|
|
82
|
-
"description": "
|
|
81
|
+
"introduced": "1.19.0",
|
|
82
|
+
"description": "Pressed state of color.background.accent.lime.subtle."
|
|
83
83
|
}
|
|
84
84
|
},
|
|
85
|
-
"Dark increased-contrast/color.
|
|
86
|
-
"value": "#
|
|
85
|
+
"Dark increased-contrast/color.background.accent.lime.bolder": {
|
|
86
|
+
"value": "#D3F1A7",
|
|
87
87
|
"attributes": {
|
|
88
88
|
"group": "paint",
|
|
89
89
|
"state": "active",
|
|
90
|
-
"introduced": "
|
|
91
|
-
"description": "Use for
|
|
90
|
+
"introduced": "1.6.0",
|
|
91
|
+
"description": "Use for for backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
92
92
|
}
|
|
93
93
|
},
|
|
94
|
-
"Dark increased-contrast/color.
|
|
95
|
-
"value": "#
|
|
94
|
+
"Dark increased-contrast/color.background.accent.lime.bolder.hovered": {
|
|
95
|
+
"value": "#EFFFD6",
|
|
96
96
|
"attributes": {
|
|
97
97
|
"group": "paint",
|
|
98
98
|
"state": "active",
|
|
99
|
-
"introduced": "
|
|
100
|
-
"description": "
|
|
99
|
+
"introduced": "1.19.0",
|
|
100
|
+
"description": "Hovered state of color.background.accent.lime.bolder."
|
|
101
101
|
}
|
|
102
102
|
},
|
|
103
|
-
"Dark increased-contrast/color.
|
|
104
|
-
"value": "#
|
|
103
|
+
"Dark increased-contrast/color.background.accent.lime.bolder.pressed": {
|
|
104
|
+
"value": "#BDE97C",
|
|
105
105
|
"attributes": {
|
|
106
106
|
"group": "paint",
|
|
107
107
|
"state": "active",
|
|
108
|
-
"introduced": "
|
|
109
|
-
"description": "
|
|
108
|
+
"introduced": "1.19.0",
|
|
109
|
+
"description": "Pressed state of color.background.accent.lime.bolder."
|
|
110
110
|
}
|
|
111
111
|
},
|
|
112
|
-
"Dark increased-contrast/color.
|
|
113
|
-
"value": "#
|
|
112
|
+
"Dark increased-contrast/color.background.accent.red.subtlest": {
|
|
113
|
+
"value": "#42221F",
|
|
114
114
|
"attributes": {
|
|
115
115
|
"group": "paint",
|
|
116
116
|
"state": "active",
|
|
117
117
|
"introduced": "0.7.0",
|
|
118
|
-
"description": "Use for
|
|
118
|
+
"description": "Use for red backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
119
119
|
}
|
|
120
120
|
},
|
|
121
|
-
"Dark increased-contrast/color.
|
|
122
|
-
"value": "#
|
|
121
|
+
"Dark increased-contrast/color.background.accent.red.subtlest.hovered": {
|
|
122
|
+
"value": "#5D1F1A",
|
|
123
123
|
"attributes": {
|
|
124
124
|
"group": "paint",
|
|
125
125
|
"state": "active",
|
|
126
|
-
"introduced": "
|
|
127
|
-
"description": "
|
|
126
|
+
"introduced": "1.19.0",
|
|
127
|
+
"description": "Hovered state of color.background.accent.red.subtlest."
|
|
128
128
|
}
|
|
129
129
|
},
|
|
130
|
-
"Dark increased-contrast/color.
|
|
131
|
-
"value": "#
|
|
130
|
+
"Dark increased-contrast/color.background.accent.red.subtlest.pressed": {
|
|
131
|
+
"value": "#872821",
|
|
132
132
|
"attributes": {
|
|
133
133
|
"group": "paint",
|
|
134
134
|
"state": "active",
|
|
135
|
-
"introduced": "
|
|
136
|
-
"description": "
|
|
135
|
+
"introduced": "1.19.0",
|
|
136
|
+
"description": "Pressed state of color.background.accent.red.subtlest."
|
|
137
137
|
}
|
|
138
138
|
},
|
|
139
|
-
"Dark increased-contrast/color.
|
|
140
|
-
"value": "#
|
|
139
|
+
"Dark increased-contrast/color.background.accent.red.subtler": {
|
|
140
|
+
"value": "#5D1F1A",
|
|
141
141
|
"attributes": {
|
|
142
142
|
"group": "paint",
|
|
143
143
|
"state": "active",
|
|
144
|
-
"introduced": "0.
|
|
145
|
-
"description": "Use for
|
|
144
|
+
"introduced": "0.7.0",
|
|
145
|
+
"description": "Use for red backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
146
146
|
}
|
|
147
147
|
},
|
|
148
|
-
"Dark increased-contrast/color.
|
|
149
|
-
"value": "#
|
|
148
|
+
"Dark increased-contrast/color.background.accent.red.subtler.hovered": {
|
|
149
|
+
"value": "#872821",
|
|
150
150
|
"attributes": {
|
|
151
151
|
"group": "paint",
|
|
152
152
|
"state": "active",
|
|
153
|
-
"introduced": "
|
|
154
|
-
"description": "
|
|
153
|
+
"introduced": "1.19.0",
|
|
154
|
+
"description": "Hovered state of color.background.accent.red.subtler."
|
|
155
155
|
}
|
|
156
156
|
},
|
|
157
|
-
"Dark increased-contrast/color.
|
|
158
|
-
"value": "#
|
|
157
|
+
"Dark increased-contrast/color.background.accent.red.subtler.pressed": {
|
|
158
|
+
"value": "#AE2E24",
|
|
159
159
|
"attributes": {
|
|
160
160
|
"group": "paint",
|
|
161
161
|
"state": "active",
|
|
162
|
-
"introduced": "
|
|
163
|
-
"description": "
|
|
162
|
+
"introduced": "1.19.0",
|
|
163
|
+
"description": "Pressed state of color.background.accent.red.subtler."
|
|
164
164
|
}
|
|
165
165
|
},
|
|
166
|
-
"Dark increased-contrast/color.
|
|
167
|
-
"value": "#
|
|
166
|
+
"Dark increased-contrast/color.background.accent.red.subtle": {
|
|
167
|
+
"value": "#AE2E24",
|
|
168
168
|
"attributes": {
|
|
169
169
|
"group": "paint",
|
|
170
170
|
"state": "active",
|
|
171
171
|
"introduced": "0.7.0",
|
|
172
|
-
"description": "Use for
|
|
172
|
+
"description": "Use for vibrant red backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
173
173
|
}
|
|
174
174
|
},
|
|
175
|
-
"Dark increased-contrast/color.
|
|
176
|
-
"value": "#
|
|
175
|
+
"Dark increased-contrast/color.background.accent.red.subtle.hovered": {
|
|
176
|
+
"value": "#872821",
|
|
177
177
|
"attributes": {
|
|
178
178
|
"group": "paint",
|
|
179
179
|
"state": "active",
|
|
180
|
-
"introduced": "
|
|
181
|
-
"description": "
|
|
180
|
+
"introduced": "1.19.0",
|
|
181
|
+
"description": "Hovered state of color.background.accent.red.subtle."
|
|
182
182
|
}
|
|
183
183
|
},
|
|
184
|
-
"Dark increased-contrast/color.
|
|
185
|
-
"value": "#
|
|
184
|
+
"Dark increased-contrast/color.background.accent.red.subtle.pressed": {
|
|
185
|
+
"value": "#5D1F1A",
|
|
186
186
|
"attributes": {
|
|
187
187
|
"group": "paint",
|
|
188
188
|
"state": "active",
|
|
189
|
-
"introduced": "
|
|
190
|
-
"description": "
|
|
189
|
+
"introduced": "1.19.0",
|
|
190
|
+
"description": "Pressed state of color.background.accent.red.subtle."
|
|
191
191
|
}
|
|
192
192
|
},
|
|
193
|
-
"Dark increased-contrast/color.
|
|
194
|
-
"value": "#
|
|
193
|
+
"Dark increased-contrast/color.background.accent.red.bolder": {
|
|
194
|
+
"value": "#FFD5D2",
|
|
195
195
|
"attributes": {
|
|
196
196
|
"group": "paint",
|
|
197
197
|
"state": "active",
|
|
198
|
-
"introduced": "0.0
|
|
199
|
-
"description": "Use for
|
|
198
|
+
"introduced": "0.7.0",
|
|
199
|
+
"description": "Use for red backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
200
200
|
}
|
|
201
201
|
},
|
|
202
|
-
"Dark increased-contrast/color.
|
|
203
|
-
"value": "#
|
|
202
|
+
"Dark increased-contrast/color.background.accent.red.bolder.hovered": {
|
|
203
|
+
"value": "#FFECEB",
|
|
204
204
|
"attributes": {
|
|
205
205
|
"group": "paint",
|
|
206
206
|
"state": "active",
|
|
207
|
-
"introduced": "
|
|
208
|
-
"description": "
|
|
207
|
+
"introduced": "1.19.0",
|
|
208
|
+
"description": "Hovered state of color.background.accent.red.bolder."
|
|
209
209
|
}
|
|
210
210
|
},
|
|
211
|
-
"Dark increased-contrast/color.
|
|
212
|
-
"value": "#
|
|
211
|
+
"Dark increased-contrast/color.background.accent.red.bolder.pressed": {
|
|
212
|
+
"value": "#FFB8B2",
|
|
213
213
|
"attributes": {
|
|
214
214
|
"group": "paint",
|
|
215
215
|
"state": "active",
|
|
216
|
-
"introduced": "
|
|
217
|
-
"description": "
|
|
216
|
+
"introduced": "1.19.0",
|
|
217
|
+
"description": "Pressed state of color.background.accent.red.bolder."
|
|
218
218
|
}
|
|
219
219
|
},
|
|
220
|
-
"Dark increased-contrast/color.
|
|
221
|
-
"value": "#
|
|
220
|
+
"Dark increased-contrast/color.background.accent.orange.subtlest": {
|
|
221
|
+
"value": "#3A2C1F",
|
|
222
222
|
"attributes": {
|
|
223
223
|
"group": "paint",
|
|
224
224
|
"state": "active",
|
|
225
|
-
"introduced": "0.
|
|
226
|
-
"description": "Use for
|
|
225
|
+
"introduced": "0.7.0",
|
|
226
|
+
"description": "Use for orange backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
227
227
|
}
|
|
228
228
|
},
|
|
229
|
-
"Dark increased-contrast/color.
|
|
230
|
-
"value": "#
|
|
229
|
+
"Dark increased-contrast/color.background.accent.orange.subtlest.hovered": {
|
|
230
|
+
"value": "#693200",
|
|
231
231
|
"attributes": {
|
|
232
232
|
"group": "paint",
|
|
233
233
|
"state": "active",
|
|
234
|
-
"introduced": "
|
|
235
|
-
"description": "
|
|
234
|
+
"introduced": "1.19.0",
|
|
235
|
+
"description": "Hovered state of color.background.accent.orange.subtlest."
|
|
236
236
|
}
|
|
237
237
|
},
|
|
238
|
-
"Dark increased-contrast/color.
|
|
239
|
-
"value": "#
|
|
238
|
+
"Dark increased-contrast/color.background.accent.orange.subtlest.pressed": {
|
|
239
|
+
"value": "#7A3B00",
|
|
240
240
|
"attributes": {
|
|
241
241
|
"group": "paint",
|
|
242
242
|
"state": "active",
|
|
243
|
-
"introduced": "
|
|
244
|
-
"description": "
|
|
243
|
+
"introduced": "1.19.0",
|
|
244
|
+
"description": "Pressed state of color.background.accent.orange.subtlest."
|
|
245
245
|
}
|
|
246
246
|
},
|
|
247
|
-
"Dark increased-contrast/color.
|
|
248
|
-
"value": "#
|
|
247
|
+
"Dark increased-contrast/color.background.accent.orange.subtler": {
|
|
248
|
+
"value": "#693200",
|
|
249
249
|
"attributes": {
|
|
250
250
|
"group": "paint",
|
|
251
251
|
"state": "active",
|
|
252
|
-
"introduced": "0.0
|
|
253
|
-
"description": "Use for
|
|
252
|
+
"introduced": "0.7.0",
|
|
253
|
+
"description": "Use for orange backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
254
254
|
}
|
|
255
255
|
},
|
|
256
|
-
"Dark increased-contrast/color.
|
|
257
|
-
"value": "#
|
|
256
|
+
"Dark increased-contrast/color.background.accent.orange.subtler.hovered": {
|
|
257
|
+
"value": "#7A3B00",
|
|
258
258
|
"attributes": {
|
|
259
259
|
"group": "paint",
|
|
260
260
|
"state": "active",
|
|
261
|
-
"introduced": "
|
|
262
|
-
"description": "
|
|
261
|
+
"introduced": "1.19.0",
|
|
262
|
+
"description": "Hovered state of color.background.accent.orange.subtler."
|
|
263
263
|
}
|
|
264
264
|
},
|
|
265
|
-
"Dark increased-contrast/color.
|
|
266
|
-
"value": "#
|
|
265
|
+
"Dark increased-contrast/color.background.accent.orange.subtler.pressed": {
|
|
266
|
+
"value": "#9E4C00",
|
|
267
267
|
"attributes": {
|
|
268
268
|
"group": "paint",
|
|
269
269
|
"state": "active",
|
|
270
|
-
"introduced": "
|
|
271
|
-
"description": "
|
|
270
|
+
"introduced": "1.19.0",
|
|
271
|
+
"description": "Pressed state of color.background.accent.orange.subtler."
|
|
272
272
|
}
|
|
273
273
|
},
|
|
274
|
-
"Dark increased-contrast/color.
|
|
275
|
-
"value": "#
|
|
274
|
+
"Dark increased-contrast/color.background.accent.orange.subtle": {
|
|
275
|
+
"value": "#9E4C00",
|
|
276
276
|
"attributes": {
|
|
277
277
|
"group": "paint",
|
|
278
278
|
"state": "active",
|
|
279
|
-
"introduced": "0.0
|
|
280
|
-
"description": "Use for
|
|
279
|
+
"introduced": "0.7.0",
|
|
280
|
+
"description": "Use for vibrant orange backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
281
281
|
}
|
|
282
282
|
},
|
|
283
|
-
"Dark increased-contrast/color.
|
|
284
|
-
"value": "#
|
|
283
|
+
"Dark increased-contrast/color.background.accent.orange.subtle.hovered": {
|
|
284
|
+
"value": "#7A3B00",
|
|
285
285
|
"attributes": {
|
|
286
286
|
"group": "paint",
|
|
287
287
|
"state": "active",
|
|
288
|
-
"introduced": "
|
|
289
|
-
"description": "
|
|
288
|
+
"introduced": "1.19.0",
|
|
289
|
+
"description": "Hovered state of color.background.accent.orange.subtle."
|
|
290
290
|
}
|
|
291
291
|
},
|
|
292
|
-
"Dark increased-contrast/color.
|
|
293
|
-
"value": "#
|
|
292
|
+
"Dark increased-contrast/color.background.accent.orange.subtle.pressed": {
|
|
293
|
+
"value": "#693200",
|
|
294
294
|
"attributes": {
|
|
295
295
|
"group": "paint",
|
|
296
296
|
"state": "active",
|
|
297
|
-
"introduced": "
|
|
298
|
-
"description": "
|
|
299
|
-
}
|
|
300
|
-
},
|
|
301
|
-
"Dark increased-contrast/color.text.discovery.bolder": {
|
|
302
|
-
"value": "#F8EEFE",
|
|
303
|
-
"attributes": {
|
|
304
|
-
"group": "paint",
|
|
305
|
-
"state": "active",
|
|
306
|
-
"introduced": "8.1.0",
|
|
307
|
-
"description": "Use for text on top of discovery semantic labels to ensure accessibility and desired visual appearance."
|
|
308
|
-
}
|
|
309
|
-
},
|
|
310
|
-
"Dark increased-contrast/color.text.information": {
|
|
311
|
-
"value": "#CFE1FD",
|
|
312
|
-
"attributes": {
|
|
313
|
-
"group": "paint",
|
|
314
|
-
"state": "active",
|
|
315
|
-
"introduced": "0.6.0",
|
|
316
|
-
"description": "Use for informative text or to communicate something is in progress, such as in-progress lozenges."
|
|
297
|
+
"introduced": "1.19.0",
|
|
298
|
+
"description": "Pressed state of color.background.accent.orange.subtle."
|
|
317
299
|
}
|
|
318
300
|
},
|
|
319
|
-
"Dark increased-contrast/color.
|
|
320
|
-
"value": "#
|
|
301
|
+
"Dark increased-contrast/color.background.accent.orange.bolder": {
|
|
302
|
+
"value": "#FCE4A6",
|
|
321
303
|
"attributes": {
|
|
322
304
|
"group": "paint",
|
|
323
305
|
"state": "active",
|
|
324
|
-
"introduced": "
|
|
325
|
-
"description": "Use for
|
|
306
|
+
"introduced": "0.7.0",
|
|
307
|
+
"description": "Use for orange backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
326
308
|
}
|
|
327
309
|
},
|
|
328
|
-
"Dark increased-contrast/color.
|
|
329
|
-
"value": "#
|
|
310
|
+
"Dark increased-contrast/color.background.accent.orange.bolder.hovered": {
|
|
311
|
+
"value": "#FFF5DB",
|
|
330
312
|
"attributes": {
|
|
331
313
|
"group": "paint",
|
|
332
314
|
"state": "active",
|
|
333
|
-
"introduced": "
|
|
334
|
-
"description": "
|
|
315
|
+
"introduced": "1.19.0",
|
|
316
|
+
"description": "Hovered state of color.background.accent.orange.bolder."
|
|
335
317
|
}
|
|
336
318
|
},
|
|
337
|
-
"Dark increased-contrast/color.
|
|
338
|
-
"value": "#
|
|
319
|
+
"Dark increased-contrast/color.background.accent.orange.bolder.pressed": {
|
|
320
|
+
"value": "#FBD779",
|
|
339
321
|
"attributes": {
|
|
340
322
|
"group": "paint",
|
|
341
323
|
"state": "active",
|
|
342
|
-
"introduced": "
|
|
343
|
-
"description": "
|
|
324
|
+
"introduced": "1.19.0",
|
|
325
|
+
"description": "Pressed state of color.background.accent.orange.bolder."
|
|
344
326
|
}
|
|
345
327
|
},
|
|
346
|
-
"Dark increased-contrast/color.
|
|
347
|
-
"value": "#
|
|
328
|
+
"Dark increased-contrast/color.background.accent.yellow.subtlest": {
|
|
329
|
+
"value": "#332E1B",
|
|
348
330
|
"attributes": {
|
|
349
331
|
"group": "paint",
|
|
350
332
|
"state": "active",
|
|
351
|
-
"introduced": "0.
|
|
352
|
-
"description": "Use for
|
|
333
|
+
"introduced": "0.7.0",
|
|
334
|
+
"description": "Use for yellow backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
353
335
|
}
|
|
354
336
|
},
|
|
355
|
-
"Dark increased-contrast/color.
|
|
356
|
-
"value": "#
|
|
337
|
+
"Dark increased-contrast/color.background.accent.yellow.subtlest.hovered": {
|
|
338
|
+
"value": "#533F04",
|
|
357
339
|
"attributes": {
|
|
358
340
|
"group": "paint",
|
|
359
341
|
"state": "active",
|
|
360
|
-
"introduced": "
|
|
361
|
-
"description": "
|
|
342
|
+
"introduced": "1.19.0",
|
|
343
|
+
"description": "Hovered state of color.background.accent.yellow.subtlest."
|
|
362
344
|
}
|
|
363
345
|
},
|
|
364
|
-
"Dark increased-contrast/color.
|
|
365
|
-
"value": "#
|
|
346
|
+
"Dark increased-contrast/color.background.accent.yellow.subtlest.pressed": {
|
|
347
|
+
"value": "#614A05",
|
|
366
348
|
"attributes": {
|
|
367
349
|
"group": "paint",
|
|
368
350
|
"state": "active",
|
|
369
|
-
"introduced": "1.
|
|
370
|
-
"description": "
|
|
351
|
+
"introduced": "1.19.0",
|
|
352
|
+
"description": "Pressed state of color.background.accent.yellow.subtlest."
|
|
371
353
|
}
|
|
372
354
|
},
|
|
373
|
-
"Dark increased-contrast/color.
|
|
374
|
-
"value": "#
|
|
355
|
+
"Dark increased-contrast/color.background.accent.yellow.subtler": {
|
|
356
|
+
"value": "#533F04",
|
|
375
357
|
"attributes": {
|
|
376
358
|
"group": "paint",
|
|
377
359
|
"state": "active",
|
|
378
|
-
"introduced": "
|
|
379
|
-
"description": "Use for
|
|
360
|
+
"introduced": "0.7.0",
|
|
361
|
+
"description": "Use for yellow backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
380
362
|
}
|
|
381
363
|
},
|
|
382
|
-
"Dark increased-contrast/color.
|
|
383
|
-
"value": "#
|
|
364
|
+
"Dark increased-contrast/color.background.accent.yellow.subtler.hovered": {
|
|
365
|
+
"value": "#614A05",
|
|
384
366
|
"attributes": {
|
|
385
367
|
"group": "paint",
|
|
386
368
|
"state": "active",
|
|
387
|
-
"introduced": "
|
|
388
|
-
"description": "
|
|
369
|
+
"introduced": "1.19.0",
|
|
370
|
+
"description": "Hovered state of color.background.accent.yellow.subtler."
|
|
389
371
|
}
|
|
390
372
|
},
|
|
391
|
-
"Dark increased-contrast/color.
|
|
392
|
-
"value": "#
|
|
373
|
+
"Dark increased-contrast/color.background.accent.yellow.subtler.pressed": {
|
|
374
|
+
"value": "#7F5F01",
|
|
393
375
|
"attributes": {
|
|
394
376
|
"group": "paint",
|
|
395
377
|
"state": "active",
|
|
396
|
-
"introduced": "1.
|
|
397
|
-
"description": "
|
|
378
|
+
"introduced": "1.19.0",
|
|
379
|
+
"description": "Pressed state of color.background.accent.yellow.subtler."
|
|
398
380
|
}
|
|
399
381
|
},
|
|
400
|
-
"Dark increased-contrast/color.
|
|
401
|
-
"value": "#
|
|
382
|
+
"Dark increased-contrast/color.background.accent.yellow.subtle": {
|
|
383
|
+
"value": "#7F5F01",
|
|
402
384
|
"attributes": {
|
|
403
385
|
"group": "paint",
|
|
404
386
|
"state": "active",
|
|
405
|
-
"introduced": "0.
|
|
406
|
-
"description": "Use for
|
|
387
|
+
"introduced": "0.7.0",
|
|
388
|
+
"description": "Use for vibrant yellow backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
407
389
|
}
|
|
408
390
|
},
|
|
409
|
-
"Dark increased-contrast/color.
|
|
410
|
-
"value": "#
|
|
391
|
+
"Dark increased-contrast/color.background.accent.yellow.subtle.hovered": {
|
|
392
|
+
"value": "#614A05",
|
|
411
393
|
"attributes": {
|
|
412
394
|
"group": "paint",
|
|
413
395
|
"state": "active",
|
|
414
|
-
"introduced": "
|
|
415
|
-
"description": "
|
|
396
|
+
"introduced": "1.19.0",
|
|
397
|
+
"description": "Hovered state of color.background.accent.yellow.subtle."
|
|
416
398
|
}
|
|
417
399
|
},
|
|
418
|
-
"Dark increased-contrast/color.
|
|
419
|
-
"value": "#
|
|
400
|
+
"Dark increased-contrast/color.background.accent.yellow.subtle.pressed": {
|
|
401
|
+
"value": "#533F04",
|
|
420
402
|
"attributes": {
|
|
421
403
|
"group": "paint",
|
|
422
404
|
"state": "active",
|
|
423
|
-
"introduced": "
|
|
424
|
-
"description": "
|
|
405
|
+
"introduced": "1.19.0",
|
|
406
|
+
"description": "Pressed state of color.background.accent.yellow.subtle."
|
|
425
407
|
}
|
|
426
408
|
},
|
|
427
|
-
"Dark increased-contrast/color.
|
|
428
|
-
"value": "#
|
|
409
|
+
"Dark increased-contrast/color.background.accent.yellow.bolder": {
|
|
410
|
+
"value": "#F5E989",
|
|
429
411
|
"attributes": {
|
|
430
412
|
"group": "paint",
|
|
431
413
|
"state": "active",
|
|
432
|
-
"introduced": "0.
|
|
433
|
-
"description": "Use for
|
|
414
|
+
"introduced": "0.7.0",
|
|
415
|
+
"description": "Use for yellow backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
434
416
|
}
|
|
435
417
|
},
|
|
436
|
-
"Dark increased-contrast/color.
|
|
437
|
-
"value": "#
|
|
418
|
+
"Dark increased-contrast/color.background.accent.yellow.bolder.hovered": {
|
|
419
|
+
"value": "#FEF7C8",
|
|
438
420
|
"attributes": {
|
|
439
421
|
"group": "paint",
|
|
440
422
|
"state": "active",
|
|
441
|
-
"introduced": "
|
|
442
|
-
"description": "
|
|
423
|
+
"introduced": "1.19.0",
|
|
424
|
+
"description": "Hovered state of color.background.accent.yellow.bolder."
|
|
443
425
|
}
|
|
444
426
|
},
|
|
445
|
-
"Dark increased-contrast/color.
|
|
446
|
-
"value": "#
|
|
427
|
+
"Dark increased-contrast/color.background.accent.yellow.bolder.pressed": {
|
|
428
|
+
"value": "#EFDD4E",
|
|
447
429
|
"attributes": {
|
|
448
430
|
"group": "paint",
|
|
449
431
|
"state": "active",
|
|
450
|
-
"introduced": "
|
|
451
|
-
"description": "
|
|
432
|
+
"introduced": "1.19.0",
|
|
433
|
+
"description": "Pressed state of color.background.accent.yellow.bolder."
|
|
452
434
|
}
|
|
453
435
|
},
|
|
454
|
-
"Dark increased-contrast/color.
|
|
455
|
-
"value": "#
|
|
436
|
+
"Dark increased-contrast/color.background.accent.green.subtlest": {
|
|
437
|
+
"value": "#1C3329",
|
|
456
438
|
"attributes": {
|
|
457
439
|
"group": "paint",
|
|
458
440
|
"state": "active",
|
|
459
|
-
"introduced": "0.
|
|
460
|
-
"description": "Use for
|
|
441
|
+
"introduced": "0.7.0",
|
|
442
|
+
"description": "Use for green backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
461
443
|
}
|
|
462
444
|
},
|
|
463
|
-
"Dark increased-contrast/color.
|
|
464
|
-
"value": "#
|
|
445
|
+
"Dark increased-contrast/color.background.accent.green.subtlest.hovered": {
|
|
446
|
+
"value": "#164B35",
|
|
465
447
|
"attributes": {
|
|
466
448
|
"group": "paint",
|
|
467
449
|
"state": "active",
|
|
468
|
-
"introduced": "
|
|
469
|
-
"description": "
|
|
450
|
+
"introduced": "1.19.0",
|
|
451
|
+
"description": "Hovered state of color.background.accent.green.subtlest."
|
|
470
452
|
}
|
|
471
453
|
},
|
|
472
|
-
"Dark increased-contrast/color.
|
|
473
|
-
"value": "#
|
|
454
|
+
"Dark increased-contrast/color.background.accent.green.subtlest.pressed": {
|
|
455
|
+
"value": "#19573D",
|
|
474
456
|
"attributes": {
|
|
475
457
|
"group": "paint",
|
|
476
458
|
"state": "active",
|
|
477
|
-
"introduced": "
|
|
478
|
-
"description": "
|
|
459
|
+
"introduced": "1.19.0",
|
|
460
|
+
"description": "Pressed state of color.background.accent.green.subtlest."
|
|
479
461
|
}
|
|
480
462
|
},
|
|
481
|
-
"Dark increased-contrast/color.
|
|
482
|
-
"value": "#
|
|
463
|
+
"Dark increased-contrast/color.background.accent.green.subtler": {
|
|
464
|
+
"value": "#164B35",
|
|
483
465
|
"attributes": {
|
|
484
466
|
"group": "paint",
|
|
485
467
|
"state": "active",
|
|
486
|
-
"introduced": "0.
|
|
487
|
-
"description": "Use for
|
|
468
|
+
"introduced": "0.7.0",
|
|
469
|
+
"description": "Use for green backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
488
470
|
}
|
|
489
471
|
},
|
|
490
|
-
"Dark increased-contrast/color.
|
|
491
|
-
"value": "#
|
|
472
|
+
"Dark increased-contrast/color.background.accent.green.subtler.hovered": {
|
|
473
|
+
"value": "#19573D",
|
|
492
474
|
"attributes": {
|
|
493
475
|
"group": "paint",
|
|
494
476
|
"state": "active",
|
|
495
|
-
"introduced": "
|
|
496
|
-
"description": "
|
|
477
|
+
"introduced": "1.19.0",
|
|
478
|
+
"description": "Hovered state of color.background.accent.green.subtler."
|
|
497
479
|
}
|
|
498
480
|
},
|
|
499
|
-
"Dark increased-contrast/color.
|
|
500
|
-
"value": "#
|
|
481
|
+
"Dark increased-contrast/color.background.accent.green.subtler.pressed": {
|
|
482
|
+
"value": "#216E4E",
|
|
501
483
|
"attributes": {
|
|
502
484
|
"group": "paint",
|
|
503
485
|
"state": "active",
|
|
504
|
-
"introduced": "
|
|
505
|
-
"description": "
|
|
486
|
+
"introduced": "1.19.0",
|
|
487
|
+
"description": "Pressed state of color.background.accent.green.subtler."
|
|
506
488
|
}
|
|
507
489
|
},
|
|
508
|
-
"Dark increased-contrast/color.
|
|
509
|
-
"value": "#
|
|
490
|
+
"Dark increased-contrast/color.background.accent.green.subtle": {
|
|
491
|
+
"value": "#216E4E",
|
|
510
492
|
"attributes": {
|
|
511
493
|
"group": "paint",
|
|
512
494
|
"state": "active",
|
|
513
|
-
"introduced": "0.
|
|
514
|
-
"description": "Use for
|
|
495
|
+
"introduced": "0.7.0",
|
|
496
|
+
"description": "Use for vibrant green backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
515
497
|
}
|
|
516
498
|
},
|
|
517
|
-
"Dark increased-contrast/color.
|
|
518
|
-
"value": "#
|
|
499
|
+
"Dark increased-contrast/color.background.accent.green.subtle.hovered": {
|
|
500
|
+
"value": "#19573D",
|
|
519
501
|
"attributes": {
|
|
520
502
|
"group": "paint",
|
|
521
503
|
"state": "active",
|
|
522
|
-
"introduced": "
|
|
523
|
-
"description": "
|
|
504
|
+
"introduced": "1.19.0",
|
|
505
|
+
"description": "Hovered state of color.background.accent.green.subtle."
|
|
524
506
|
}
|
|
525
507
|
},
|
|
526
|
-
"Dark increased-contrast/color.
|
|
527
|
-
"value": "#
|
|
508
|
+
"Dark increased-contrast/color.background.accent.green.subtle.pressed": {
|
|
509
|
+
"value": "#164B35",
|
|
528
510
|
"attributes": {
|
|
529
511
|
"group": "paint",
|
|
530
512
|
"state": "active",
|
|
531
|
-
"introduced": "
|
|
532
|
-
"description": "
|
|
513
|
+
"introduced": "1.19.0",
|
|
514
|
+
"description": "Pressed state of color.background.accent.green.subtle."
|
|
533
515
|
}
|
|
534
516
|
},
|
|
535
|
-
"Dark increased-contrast/color.
|
|
536
|
-
"value": "#
|
|
517
|
+
"Dark increased-contrast/color.background.accent.green.bolder": {
|
|
518
|
+
"value": "#BAF3DB",
|
|
537
519
|
"attributes": {
|
|
538
520
|
"group": "paint",
|
|
539
521
|
"state": "active",
|
|
540
|
-
"introduced": "0.
|
|
541
|
-
"description": "Use for
|
|
522
|
+
"introduced": "0.7.0",
|
|
523
|
+
"description": "Use for green backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
542
524
|
}
|
|
543
525
|
},
|
|
544
|
-
"Dark increased-contrast/color.
|
|
545
|
-
"value": "#
|
|
526
|
+
"Dark increased-contrast/color.background.accent.green.bolder.hovered": {
|
|
527
|
+
"value": "#DCFFF1",
|
|
546
528
|
"attributes": {
|
|
547
529
|
"group": "paint",
|
|
548
530
|
"state": "active",
|
|
549
|
-
"introduced": "
|
|
550
|
-
"description": "
|
|
531
|
+
"introduced": "1.19.0",
|
|
532
|
+
"description": "Hovered state of color.background.accent.green.bolder."
|
|
551
533
|
}
|
|
552
534
|
},
|
|
553
|
-
"Dark increased-contrast/color.
|
|
554
|
-
"value": "#
|
|
535
|
+
"Dark increased-contrast/color.background.accent.green.bolder.pressed": {
|
|
536
|
+
"value": "#97EDC9",
|
|
555
537
|
"attributes": {
|
|
556
538
|
"group": "paint",
|
|
557
539
|
"state": "active",
|
|
558
|
-
"introduced": "
|
|
559
|
-
"description": "
|
|
540
|
+
"introduced": "1.19.0",
|
|
541
|
+
"description": "Pressed state of color.background.accent.green.bolder."
|
|
560
542
|
}
|
|
561
543
|
},
|
|
562
|
-
"Dark increased-contrast/color.
|
|
563
|
-
"value": "#
|
|
544
|
+
"Dark increased-contrast/color.background.accent.teal.subtlest": {
|
|
545
|
+
"value": "#1E3137",
|
|
564
546
|
"attributes": {
|
|
565
547
|
"group": "paint",
|
|
566
548
|
"state": "active",
|
|
567
|
-
"introduced": "0.
|
|
568
|
-
"description": "Use for
|
|
549
|
+
"introduced": "0.7.0",
|
|
550
|
+
"description": "Use for teal backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
569
551
|
}
|
|
570
552
|
},
|
|
571
|
-
"Dark increased-contrast/color.
|
|
572
|
-
"value": "#
|
|
553
|
+
"Dark increased-contrast/color.background.accent.teal.subtlest.hovered": {
|
|
554
|
+
"value": "#164555",
|
|
573
555
|
"attributes": {
|
|
574
556
|
"group": "paint",
|
|
575
557
|
"state": "active",
|
|
576
|
-
"introduced": "1.
|
|
577
|
-
"description": "
|
|
558
|
+
"introduced": "1.19.0",
|
|
559
|
+
"description": "Hovered state of color.background.accent.teal.subtlest."
|
|
578
560
|
}
|
|
579
561
|
},
|
|
580
|
-
"Dark increased-contrast/color.
|
|
581
|
-
"value": "#
|
|
562
|
+
"Dark increased-contrast/color.background.accent.teal.subtlest.pressed": {
|
|
563
|
+
"value": "#1A5265",
|
|
582
564
|
"attributes": {
|
|
583
565
|
"group": "paint",
|
|
584
566
|
"state": "active",
|
|
585
|
-
"introduced": "
|
|
586
|
-
"description": "
|
|
567
|
+
"introduced": "1.19.0",
|
|
568
|
+
"description": "Pressed state of color.background.accent.teal.subtlest."
|
|
587
569
|
}
|
|
588
570
|
},
|
|
589
|
-
"Dark increased-contrast/color.
|
|
590
|
-
"value": "#
|
|
571
|
+
"Dark increased-contrast/color.background.accent.teal.subtler": {
|
|
572
|
+
"value": "#164555",
|
|
591
573
|
"attributes": {
|
|
592
574
|
"group": "paint",
|
|
593
575
|
"state": "active",
|
|
594
|
-
"introduced": "0.
|
|
595
|
-
"description": "Use
|
|
576
|
+
"introduced": "0.7.0",
|
|
577
|
+
"description": "Use for teal backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
596
578
|
}
|
|
597
579
|
},
|
|
598
|
-
"Dark increased-contrast/color.
|
|
599
|
-
"value": "#
|
|
580
|
+
"Dark increased-contrast/color.background.accent.teal.subtler.hovered": {
|
|
581
|
+
"value": "#1A5265",
|
|
600
582
|
"attributes": {
|
|
601
583
|
"group": "paint",
|
|
602
584
|
"state": "active",
|
|
603
|
-
"introduced": "1.
|
|
604
|
-
"description": "
|
|
585
|
+
"introduced": "1.19.0",
|
|
586
|
+
"description": "Hovered state of color.background.accent.teal.subtler."
|
|
605
587
|
}
|
|
606
588
|
},
|
|
607
|
-
"Dark increased-contrast/color.
|
|
608
|
-
"value": "#
|
|
589
|
+
"Dark increased-contrast/color.background.accent.teal.subtler.pressed": {
|
|
590
|
+
"value": "#206A83",
|
|
609
591
|
"attributes": {
|
|
610
592
|
"group": "paint",
|
|
611
593
|
"state": "active",
|
|
612
|
-
"introduced": "
|
|
613
|
-
"description": "
|
|
594
|
+
"introduced": "1.19.0",
|
|
595
|
+
"description": "Pressed state of color.background.accent.teal.subtler."
|
|
614
596
|
}
|
|
615
597
|
},
|
|
616
|
-
"Dark increased-contrast/color.
|
|
617
|
-
"value": "#
|
|
598
|
+
"Dark increased-contrast/color.background.accent.teal.subtle": {
|
|
599
|
+
"value": "#206A83",
|
|
618
600
|
"attributes": {
|
|
619
601
|
"group": "paint",
|
|
620
602
|
"state": "active",
|
|
621
|
-
"introduced": "0.
|
|
622
|
-
"description": "Use for
|
|
603
|
+
"introduced": "0.7.0",
|
|
604
|
+
"description": "Use for vibrant teal backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
623
605
|
}
|
|
624
606
|
},
|
|
625
|
-
"Dark increased-contrast/color.
|
|
626
|
-
"value": "#
|
|
607
|
+
"Dark increased-contrast/color.background.accent.teal.subtle.hovered": {
|
|
608
|
+
"value": "#1A5265",
|
|
627
609
|
"attributes": {
|
|
628
610
|
"group": "paint",
|
|
629
611
|
"state": "active",
|
|
630
|
-
"introduced": "
|
|
631
|
-
"description": "
|
|
612
|
+
"introduced": "1.19.0",
|
|
613
|
+
"description": "Hovered state of color.background.accent.teal.subtle."
|
|
632
614
|
}
|
|
633
615
|
},
|
|
634
|
-
"Dark increased-contrast/color.
|
|
635
|
-
"value": "#
|
|
616
|
+
"Dark increased-contrast/color.background.accent.teal.subtle.pressed": {
|
|
617
|
+
"value": "#164555",
|
|
636
618
|
"attributes": {
|
|
637
619
|
"group": "paint",
|
|
638
620
|
"state": "active",
|
|
639
|
-
"introduced": "
|
|
640
|
-
"description": "
|
|
621
|
+
"introduced": "1.19.0",
|
|
622
|
+
"description": "Pressed state of color.background.accent.teal.subtle."
|
|
641
623
|
}
|
|
642
624
|
},
|
|
643
|
-
"Dark increased-contrast/color.
|
|
644
|
-
"value": "#
|
|
625
|
+
"Dark increased-contrast/color.background.accent.teal.bolder": {
|
|
626
|
+
"value": "#C6EDFB",
|
|
645
627
|
"attributes": {
|
|
646
628
|
"group": "paint",
|
|
647
629
|
"state": "active",
|
|
648
|
-
"introduced": "
|
|
649
|
-
"description": "Use for
|
|
630
|
+
"introduced": "0.7.0",
|
|
631
|
+
"description": "Use for teal backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
650
632
|
}
|
|
651
633
|
},
|
|
652
|
-
"Dark increased-contrast/color.
|
|
653
|
-
"value": "#
|
|
634
|
+
"Dark increased-contrast/color.background.accent.teal.bolder.hovered": {
|
|
635
|
+
"value": "#E7F9FF",
|
|
654
636
|
"attributes": {
|
|
655
637
|
"group": "paint",
|
|
656
638
|
"state": "active",
|
|
657
|
-
"introduced": "
|
|
658
|
-
"description": "
|
|
639
|
+
"introduced": "1.19.0",
|
|
640
|
+
"description": "Hovered state of color.background.accent.teal.bolder."
|
|
659
641
|
}
|
|
660
642
|
},
|
|
661
|
-
"Dark increased-contrast/color.
|
|
662
|
-
"value": "#
|
|
643
|
+
"Dark increased-contrast/color.background.accent.teal.bolder.pressed": {
|
|
644
|
+
"value": "#B1E4F7",
|
|
663
645
|
"attributes": {
|
|
664
646
|
"group": "paint",
|
|
665
647
|
"state": "active",
|
|
666
|
-
"introduced": "
|
|
667
|
-
"description": "
|
|
648
|
+
"introduced": "1.19.0",
|
|
649
|
+
"description": "Pressed state of color.background.accent.teal.bolder."
|
|
668
650
|
}
|
|
669
651
|
},
|
|
670
|
-
"Dark increased-contrast/color.
|
|
671
|
-
"value": "#
|
|
652
|
+
"Dark increased-contrast/color.background.accent.blue.subtlest": {
|
|
653
|
+
"value": "#1C2B42",
|
|
672
654
|
"attributes": {
|
|
673
655
|
"group": "paint",
|
|
674
656
|
"state": "active",
|
|
675
|
-
"introduced": "0.
|
|
676
|
-
"description": "Use for
|
|
657
|
+
"introduced": "0.7.0",
|
|
658
|
+
"description": "Use for blue backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
677
659
|
}
|
|
678
660
|
},
|
|
679
|
-
"Dark increased-contrast/color.
|
|
680
|
-
"value": "#
|
|
661
|
+
"Dark increased-contrast/color.background.accent.blue.subtlest.hovered": {
|
|
662
|
+
"value": "#123263",
|
|
681
663
|
"attributes": {
|
|
682
664
|
"group": "paint",
|
|
683
665
|
"state": "active",
|
|
684
|
-
"introduced": "
|
|
685
|
-
"description": "
|
|
666
|
+
"introduced": "1.19.0",
|
|
667
|
+
"description": "Hovered state of color.background.accent.blue.subtlest."
|
|
686
668
|
}
|
|
687
669
|
},
|
|
688
|
-
"Dark increased-contrast/color.
|
|
689
|
-
"value": "#
|
|
670
|
+
"Dark increased-contrast/color.background.accent.blue.subtlest.pressed": {
|
|
671
|
+
"value": "#144794",
|
|
690
672
|
"attributes": {
|
|
691
673
|
"group": "paint",
|
|
692
674
|
"state": "active",
|
|
693
|
-
"introduced": "
|
|
694
|
-
"description": "
|
|
675
|
+
"introduced": "1.19.0",
|
|
676
|
+
"description": "Pressed state of color.background.accent.blue.subtlest."
|
|
695
677
|
}
|
|
696
678
|
},
|
|
697
|
-
"Dark increased-contrast/color.
|
|
698
|
-
"value": "#
|
|
679
|
+
"Dark increased-contrast/color.background.accent.blue.subtler": {
|
|
680
|
+
"value": "#123263",
|
|
699
681
|
"attributes": {
|
|
700
682
|
"group": "paint",
|
|
701
683
|
"state": "active",
|
|
702
|
-
"introduced": "
|
|
703
|
-
"description": "Use for
|
|
684
|
+
"introduced": "0.7.0",
|
|
685
|
+
"description": "Use for blue backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
704
686
|
}
|
|
705
687
|
},
|
|
706
|
-
"Dark increased-contrast/color.
|
|
707
|
-
"value": "#
|
|
688
|
+
"Dark increased-contrast/color.background.accent.blue.subtler.hovered": {
|
|
689
|
+
"value": "#144794",
|
|
708
690
|
"attributes": {
|
|
709
691
|
"group": "paint",
|
|
710
692
|
"state": "active",
|
|
711
|
-
"introduced": "
|
|
712
|
-
"description": "
|
|
693
|
+
"introduced": "1.19.0",
|
|
694
|
+
"description": "Hovered state of color.background.accent.blue.subtler."
|
|
713
695
|
}
|
|
714
696
|
},
|
|
715
|
-
"Dark increased-contrast/color.
|
|
697
|
+
"Dark increased-contrast/color.background.accent.blue.subtler.pressed": {
|
|
716
698
|
"value": "#1558BC",
|
|
717
699
|
"attributes": {
|
|
718
700
|
"group": "paint",
|
|
719
701
|
"state": "active",
|
|
720
|
-
"introduced": "
|
|
721
|
-
"description": "
|
|
722
|
-
}
|
|
723
|
-
},
|
|
724
|
-
"Dark increased-contrast/color.border.accent.purple": {
|
|
725
|
-
"value": "#D8A0F7",
|
|
726
|
-
"attributes": {
|
|
727
|
-
"group": "paint",
|
|
728
|
-
"state": "active",
|
|
729
|
-
"introduced": "0.6.0",
|
|
730
|
-
"description": "Use for purple borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
731
|
-
}
|
|
732
|
-
},
|
|
733
|
-
"Dark increased-contrast/color.border.accent.purple.subtle": {
|
|
734
|
-
"value": "#803FA5",
|
|
735
|
-
"attributes": {
|
|
736
|
-
"group": "paint",
|
|
737
|
-
"state": "active",
|
|
738
|
-
"introduced": "13.2.0",
|
|
739
|
-
"description": "Use for decorative purple borders that do not need to meet 3:1 contrast requirements."
|
|
702
|
+
"introduced": "1.19.0",
|
|
703
|
+
"description": "Pressed state of color.background.accent.blue.subtler."
|
|
740
704
|
}
|
|
741
705
|
},
|
|
742
|
-
"Dark increased-contrast/color.
|
|
743
|
-
"value": "#
|
|
706
|
+
"Dark increased-contrast/color.background.accent.blue.subtle": {
|
|
707
|
+
"value": "#1558BC",
|
|
744
708
|
"attributes": {
|
|
745
709
|
"group": "paint",
|
|
746
710
|
"state": "active",
|
|
747
|
-
"introduced": "0.
|
|
748
|
-
"description": "Use for
|
|
711
|
+
"introduced": "0.7.0",
|
|
712
|
+
"description": "Use for vibrant blue backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
749
713
|
}
|
|
750
714
|
},
|
|
751
|
-
"Dark increased-contrast/color.
|
|
752
|
-
"value": "#
|
|
715
|
+
"Dark increased-contrast/color.background.accent.blue.subtle.hovered": {
|
|
716
|
+
"value": "#144794",
|
|
753
717
|
"attributes": {
|
|
754
718
|
"group": "paint",
|
|
755
719
|
"state": "active",
|
|
756
|
-
"introduced": "
|
|
757
|
-
"description": "
|
|
720
|
+
"introduced": "1.19.0",
|
|
721
|
+
"description": "Hovered state of color.background.accent.blue.subtle."
|
|
758
722
|
}
|
|
759
723
|
},
|
|
760
|
-
"Dark increased-contrast/color.
|
|
761
|
-
"value": "#
|
|
724
|
+
"Dark increased-contrast/color.background.accent.blue.subtle.pressed": {
|
|
725
|
+
"value": "#123263",
|
|
762
726
|
"attributes": {
|
|
763
727
|
"group": "paint",
|
|
764
728
|
"state": "active",
|
|
765
|
-
"introduced": "
|
|
766
|
-
"description": "
|
|
729
|
+
"introduced": "1.19.0",
|
|
730
|
+
"description": "Pressed state of color.background.accent.blue.subtle."
|
|
767
731
|
}
|
|
768
732
|
},
|
|
769
|
-
"Dark increased-contrast/color.
|
|
770
|
-
"value": "#
|
|
733
|
+
"Dark increased-contrast/color.background.accent.blue.bolder": {
|
|
734
|
+
"value": "#669DF1",
|
|
771
735
|
"attributes": {
|
|
772
736
|
"group": "paint",
|
|
773
737
|
"state": "active",
|
|
774
|
-
"introduced": "
|
|
775
|
-
"description": "Use for
|
|
738
|
+
"introduced": "0.7.0",
|
|
739
|
+
"description": "Use for blue backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
776
740
|
}
|
|
777
741
|
},
|
|
778
|
-
"Dark increased-contrast/color.
|
|
779
|
-
"value": "#
|
|
742
|
+
"Dark increased-contrast/color.background.accent.blue.bolder.hovered": {
|
|
743
|
+
"value": "#8FB8F6",
|
|
780
744
|
"attributes": {
|
|
781
745
|
"group": "paint",
|
|
782
746
|
"state": "active",
|
|
783
|
-
"introduced": "
|
|
784
|
-
"description": "
|
|
747
|
+
"introduced": "1.19.0",
|
|
748
|
+
"description": "Hovered state of color.background.accent.blue.bolder."
|
|
785
749
|
}
|
|
786
750
|
},
|
|
787
|
-
"Dark increased-contrast/color.
|
|
788
|
-
"value": "#
|
|
751
|
+
"Dark increased-contrast/color.background.accent.blue.bolder.pressed": {
|
|
752
|
+
"value": "#ADCBFB",
|
|
789
753
|
"attributes": {
|
|
790
754
|
"group": "paint",
|
|
791
755
|
"state": "active",
|
|
792
|
-
"introduced": "
|
|
793
|
-
"description": "
|
|
756
|
+
"introduced": "1.19.0",
|
|
757
|
+
"description": "Pressed state of color.background.accent.blue.bolder."
|
|
794
758
|
}
|
|
795
759
|
},
|
|
796
|
-
"Dark increased-contrast/color.
|
|
797
|
-
"value": "#
|
|
760
|
+
"Dark increased-contrast/color.background.accent.purple.subtlest": {
|
|
761
|
+
"value": "#35243F",
|
|
798
762
|
"attributes": {
|
|
799
763
|
"group": "paint",
|
|
800
764
|
"state": "active",
|
|
801
|
-
"introduced": "0.
|
|
802
|
-
"description": "Use for
|
|
765
|
+
"introduced": "0.7.0",
|
|
766
|
+
"description": "Use for purple backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
803
767
|
}
|
|
804
768
|
},
|
|
805
|
-
"Dark increased-contrast/color.
|
|
806
|
-
"value": "#
|
|
769
|
+
"Dark increased-contrast/color.background.accent.purple.subtlest.hovered": {
|
|
770
|
+
"value": "#48245D",
|
|
807
771
|
"attributes": {
|
|
808
772
|
"group": "paint",
|
|
809
773
|
"state": "active",
|
|
810
|
-
"introduced": "
|
|
811
|
-
"description": "
|
|
774
|
+
"introduced": "1.19.0",
|
|
775
|
+
"description": "Hovered state of color.background.accent.purple.subtlest."
|
|
812
776
|
}
|
|
813
777
|
},
|
|
814
|
-
"Dark increased-contrast/color.
|
|
815
|
-
"value": "#
|
|
778
|
+
"Dark increased-contrast/color.background.accent.purple.subtlest.pressed": {
|
|
779
|
+
"value": "#673286",
|
|
816
780
|
"attributes": {
|
|
817
781
|
"group": "paint",
|
|
818
782
|
"state": "active",
|
|
819
|
-
"introduced": "
|
|
820
|
-
"description": "
|
|
783
|
+
"introduced": "1.19.0",
|
|
784
|
+
"description": "Pressed state of color.background.accent.purple.subtlest."
|
|
821
785
|
}
|
|
822
786
|
},
|
|
823
|
-
"Dark increased-contrast/color.
|
|
824
|
-
"value": "#
|
|
787
|
+
"Dark increased-contrast/color.background.accent.purple.subtler": {
|
|
788
|
+
"value": "#48245D",
|
|
825
789
|
"attributes": {
|
|
826
790
|
"group": "paint",
|
|
827
791
|
"state": "active",
|
|
828
|
-
"introduced": "0.
|
|
829
|
-
"description": "Use for
|
|
792
|
+
"introduced": "0.7.0",
|
|
793
|
+
"description": "Use for purple backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
830
794
|
}
|
|
831
795
|
},
|
|
832
|
-
"Dark increased-contrast/color.
|
|
833
|
-
"value": "#
|
|
796
|
+
"Dark increased-contrast/color.background.accent.purple.subtler.hovered": {
|
|
797
|
+
"value": "#673286",
|
|
834
798
|
"attributes": {
|
|
835
799
|
"group": "paint",
|
|
836
800
|
"state": "active",
|
|
837
|
-
"introduced": "
|
|
838
|
-
"description": "
|
|
801
|
+
"introduced": "1.19.0",
|
|
802
|
+
"description": "Hovered state of color.background.accent.purple.subtler."
|
|
839
803
|
}
|
|
840
804
|
},
|
|
841
|
-
"Dark increased-contrast/color.
|
|
842
|
-
"value": "#
|
|
805
|
+
"Dark increased-contrast/color.background.accent.purple.subtler.pressed": {
|
|
806
|
+
"value": "#803FA5",
|
|
843
807
|
"attributes": {
|
|
844
808
|
"group": "paint",
|
|
845
809
|
"state": "active",
|
|
846
|
-
"introduced": "
|
|
847
|
-
"description": "
|
|
810
|
+
"introduced": "1.19.0",
|
|
811
|
+
"description": "Pressed state of color.background.accent.purple.subtler."
|
|
848
812
|
}
|
|
849
813
|
},
|
|
850
|
-
"Dark increased-contrast/color.
|
|
851
|
-
"value": "#
|
|
814
|
+
"Dark increased-contrast/color.background.accent.purple.subtle": {
|
|
815
|
+
"value": "#803FA5",
|
|
852
816
|
"attributes": {
|
|
853
817
|
"group": "paint",
|
|
854
818
|
"state": "active",
|
|
855
|
-
"introduced": "0.
|
|
856
|
-
"description": "Use for
|
|
819
|
+
"introduced": "0.7.0",
|
|
820
|
+
"description": "Use for vibrant purple backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
857
821
|
}
|
|
858
822
|
},
|
|
859
|
-
"Dark increased-contrast/color.
|
|
860
|
-
"value": "#
|
|
823
|
+
"Dark increased-contrast/color.background.accent.purple.subtle.hovered": {
|
|
824
|
+
"value": "#673286",
|
|
861
825
|
"attributes": {
|
|
862
826
|
"group": "paint",
|
|
863
827
|
"state": "active",
|
|
864
|
-
"introduced": "
|
|
865
|
-
"description": "
|
|
828
|
+
"introduced": "1.19.0",
|
|
829
|
+
"description": "Hovered state of color.background.accent.purple.subtle."
|
|
866
830
|
}
|
|
867
831
|
},
|
|
868
|
-
"Dark increased-contrast/color.
|
|
869
|
-
"value": "#
|
|
832
|
+
"Dark increased-contrast/color.background.accent.purple.subtle.pressed": {
|
|
833
|
+
"value": "#48245D",
|
|
870
834
|
"attributes": {
|
|
871
835
|
"group": "paint",
|
|
872
836
|
"state": "active",
|
|
873
|
-
"introduced": "
|
|
874
|
-
"description": "
|
|
837
|
+
"introduced": "1.19.0",
|
|
838
|
+
"description": "Pressed state of color.background.accent.purple.subtle."
|
|
875
839
|
}
|
|
876
840
|
},
|
|
877
|
-
"Dark increased-contrast/color.
|
|
878
|
-
"value": "#
|
|
841
|
+
"Dark increased-contrast/color.background.accent.purple.bolder": {
|
|
842
|
+
"value": "#EED7FC",
|
|
879
843
|
"attributes": {
|
|
880
844
|
"group": "paint",
|
|
881
845
|
"state": "active",
|
|
882
|
-
"introduced": "
|
|
883
|
-
"description": "Use for
|
|
846
|
+
"introduced": "0.7.0",
|
|
847
|
+
"description": "Use for purple backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
884
848
|
}
|
|
885
849
|
},
|
|
886
|
-
"Dark increased-contrast/color.
|
|
887
|
-
"value": "#
|
|
850
|
+
"Dark increased-contrast/color.background.accent.purple.bolder.hovered": {
|
|
851
|
+
"value": "#F8EEFE",
|
|
888
852
|
"attributes": {
|
|
889
853
|
"group": "paint",
|
|
890
854
|
"state": "active",
|
|
891
|
-
"introduced": "
|
|
892
|
-
"description": "
|
|
855
|
+
"introduced": "1.19.0",
|
|
856
|
+
"description": "Hovered state of color.background.accent.purple.bolder."
|
|
893
857
|
}
|
|
894
858
|
},
|
|
895
|
-
"Dark increased-contrast/color.
|
|
896
|
-
"value": "#
|
|
859
|
+
"Dark increased-contrast/color.background.accent.purple.bolder.pressed": {
|
|
860
|
+
"value": "#E3BDFA",
|
|
897
861
|
"attributes": {
|
|
898
862
|
"group": "paint",
|
|
899
863
|
"state": "active",
|
|
900
|
-
"introduced": "
|
|
901
|
-
"description": "
|
|
864
|
+
"introduced": "1.19.0",
|
|
865
|
+
"description": "Pressed state of color.background.accent.purple.bolder."
|
|
902
866
|
}
|
|
903
867
|
},
|
|
904
|
-
"Dark increased-contrast/color.
|
|
905
|
-
"value": "#
|
|
868
|
+
"Dark increased-contrast/color.background.accent.magenta.subtlest": {
|
|
869
|
+
"value": "#3D2232",
|
|
906
870
|
"attributes": {
|
|
907
871
|
"group": "paint",
|
|
908
872
|
"state": "active",
|
|
909
|
-
"introduced": "0.
|
|
910
|
-
"description": "Use for
|
|
873
|
+
"introduced": "0.7.0",
|
|
874
|
+
"description": "Use for magenta backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
911
875
|
}
|
|
912
876
|
},
|
|
913
|
-
"Dark increased-contrast/color.
|
|
914
|
-
"value": "#
|
|
877
|
+
"Dark increased-contrast/color.background.accent.magenta.subtlest.hovered": {
|
|
878
|
+
"value": "#50253F",
|
|
915
879
|
"attributes": {
|
|
916
880
|
"group": "paint",
|
|
917
881
|
"state": "active",
|
|
918
|
-
"introduced": "
|
|
919
|
-
"description": "
|
|
882
|
+
"introduced": "1.19.0",
|
|
883
|
+
"description": "Hovered state of color.background.accent.magenta.subtlest."
|
|
920
884
|
}
|
|
921
885
|
},
|
|
922
|
-
"Dark increased-contrast/color.
|
|
923
|
-
"value": "#
|
|
886
|
+
"Dark increased-contrast/color.background.accent.magenta.subtlest.pressed": {
|
|
887
|
+
"value": "#77325B",
|
|
924
888
|
"attributes": {
|
|
925
889
|
"group": "paint",
|
|
926
890
|
"state": "active",
|
|
927
|
-
"introduced": "
|
|
928
|
-
"description": "
|
|
891
|
+
"introduced": "1.19.0",
|
|
892
|
+
"description": "Pressed state of color.background.accent.magenta.subtlest."
|
|
929
893
|
}
|
|
930
894
|
},
|
|
931
|
-
"Dark increased-contrast/color.background.accent.
|
|
932
|
-
"value": "#
|
|
895
|
+
"Dark increased-contrast/color.background.accent.magenta.subtler": {
|
|
896
|
+
"value": "#50253F",
|
|
933
897
|
"attributes": {
|
|
934
898
|
"group": "paint",
|
|
935
899
|
"state": "active",
|
|
936
|
-
"introduced": "
|
|
937
|
-
"description": "Use for
|
|
900
|
+
"introduced": "0.7.0",
|
|
901
|
+
"description": "Use for magenta backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
938
902
|
}
|
|
939
903
|
},
|
|
940
|
-
"Dark increased-contrast/color.background.accent.
|
|
941
|
-
"value": "#
|
|
904
|
+
"Dark increased-contrast/color.background.accent.magenta.subtler.hovered": {
|
|
905
|
+
"value": "#77325B",
|
|
942
906
|
"attributes": {
|
|
943
907
|
"group": "paint",
|
|
944
908
|
"state": "active",
|
|
945
909
|
"introduced": "1.19.0",
|
|
946
|
-
"description": "Hovered state of color.background.accent.
|
|
910
|
+
"description": "Hovered state of color.background.accent.magenta.subtler."
|
|
947
911
|
}
|
|
948
912
|
},
|
|
949
|
-
"Dark increased-contrast/color.background.accent.
|
|
950
|
-
"value": "#
|
|
913
|
+
"Dark increased-contrast/color.background.accent.magenta.subtler.pressed": {
|
|
914
|
+
"value": "#943D73",
|
|
951
915
|
"attributes": {
|
|
952
916
|
"group": "paint",
|
|
953
917
|
"state": "active",
|
|
954
918
|
"introduced": "1.19.0",
|
|
955
|
-
"description": "Pressed state of color.background.accent.
|
|
919
|
+
"description": "Pressed state of color.background.accent.magenta.subtler."
|
|
956
920
|
}
|
|
957
921
|
},
|
|
958
|
-
"Dark increased-contrast/color.background.accent.
|
|
959
|
-
"value": "#
|
|
922
|
+
"Dark increased-contrast/color.background.accent.magenta.subtle": {
|
|
923
|
+
"value": "#943D73",
|
|
960
924
|
"attributes": {
|
|
961
925
|
"group": "paint",
|
|
962
926
|
"state": "active",
|
|
963
|
-
"introduced": "
|
|
964
|
-
"description": "Use for
|
|
927
|
+
"introduced": "0.7.0",
|
|
928
|
+
"description": "Use for vibrant magenta backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
965
929
|
}
|
|
966
930
|
},
|
|
967
|
-
"Dark increased-contrast/color.background.accent.
|
|
968
|
-
"value": "#
|
|
931
|
+
"Dark increased-contrast/color.background.accent.magenta.subtle.hovered": {
|
|
932
|
+
"value": "#77325B",
|
|
969
933
|
"attributes": {
|
|
970
934
|
"group": "paint",
|
|
971
935
|
"state": "active",
|
|
972
936
|
"introduced": "1.19.0",
|
|
973
|
-
"description": "Hovered state of color.background.accent.
|
|
937
|
+
"description": "Hovered state of color.background.accent.magenta.subtle."
|
|
974
938
|
}
|
|
975
939
|
},
|
|
976
|
-
"Dark increased-contrast/color.background.accent.
|
|
977
|
-
"value": "#
|
|
940
|
+
"Dark increased-contrast/color.background.accent.magenta.subtle.pressed": {
|
|
941
|
+
"value": "#50253F",
|
|
978
942
|
"attributes": {
|
|
979
943
|
"group": "paint",
|
|
980
944
|
"state": "active",
|
|
981
945
|
"introduced": "1.19.0",
|
|
982
|
-
"description": "Pressed state of color.background.accent.
|
|
946
|
+
"description": "Pressed state of color.background.accent.magenta.subtle."
|
|
983
947
|
}
|
|
984
948
|
},
|
|
985
|
-
"Dark increased-contrast/color.background.accent.
|
|
986
|
-
"value": "#
|
|
949
|
+
"Dark increased-contrast/color.background.accent.magenta.bolder": {
|
|
950
|
+
"value": "#FDD0EC",
|
|
987
951
|
"attributes": {
|
|
988
952
|
"group": "paint",
|
|
989
953
|
"state": "active",
|
|
990
|
-
"introduced": "
|
|
991
|
-
"description": "Use for
|
|
954
|
+
"introduced": "0.7.0",
|
|
955
|
+
"description": "Use for magenta backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
992
956
|
}
|
|
993
957
|
},
|
|
994
|
-
"Dark increased-contrast/color.background.accent.
|
|
995
|
-
"value": "#
|
|
958
|
+
"Dark increased-contrast/color.background.accent.magenta.bolder.hovered": {
|
|
959
|
+
"value": "#FFECF8",
|
|
996
960
|
"attributes": {
|
|
997
961
|
"group": "paint",
|
|
998
962
|
"state": "active",
|
|
999
963
|
"introduced": "1.19.0",
|
|
1000
|
-
"description": "Hovered state of color.background.accent.
|
|
964
|
+
"description": "Hovered state of color.background.accent.magenta.bolder."
|
|
1001
965
|
}
|
|
1002
966
|
},
|
|
1003
|
-
"Dark increased-contrast/color.background.accent.
|
|
1004
|
-
"value": "#
|
|
967
|
+
"Dark increased-contrast/color.background.accent.magenta.bolder.pressed": {
|
|
968
|
+
"value": "#FCB6E1",
|
|
1005
969
|
"attributes": {
|
|
1006
970
|
"group": "paint",
|
|
1007
971
|
"state": "active",
|
|
1008
972
|
"introduced": "1.19.0",
|
|
1009
|
-
"description": "Pressed state of color.background.accent.
|
|
973
|
+
"description": "Pressed state of color.background.accent.magenta.bolder."
|
|
1010
974
|
}
|
|
1011
975
|
},
|
|
1012
|
-
"Dark increased-contrast/color.background.accent.
|
|
1013
|
-
"value": "#
|
|
976
|
+
"Dark increased-contrast/color.background.accent.gray.subtlest": {
|
|
977
|
+
"value": "#303134",
|
|
1014
978
|
"attributes": {
|
|
1015
979
|
"group": "paint",
|
|
1016
980
|
"state": "active",
|
|
1017
|
-
"introduced": "
|
|
1018
|
-
"description": "Use for
|
|
981
|
+
"introduced": "0.7.0",
|
|
982
|
+
"description": "Use for gray backgrounds when there is no meaning tied to the color. Reserved for when you only want a hint of color."
|
|
1019
983
|
}
|
|
1020
984
|
},
|
|
1021
|
-
"Dark increased-contrast/color.background.accent.
|
|
1022
|
-
"value": "#
|
|
985
|
+
"Dark increased-contrast/color.background.accent.gray.subtlest.hovered": {
|
|
986
|
+
"value": "#3D3F43",
|
|
1023
987
|
"attributes": {
|
|
1024
988
|
"group": "paint",
|
|
1025
989
|
"state": "active",
|
|
1026
990
|
"introduced": "1.19.0",
|
|
1027
|
-
"description": "Hovered state of color.background.accent.
|
|
991
|
+
"description": "Hovered state of color.background.accent.gray.subtlest."
|
|
1028
992
|
}
|
|
1029
993
|
},
|
|
1030
|
-
"Dark increased-contrast/color.background.accent.
|
|
1031
|
-
"value": "#
|
|
994
|
+
"Dark increased-contrast/color.background.accent.gray.subtlest.pressed": {
|
|
995
|
+
"value": "#4B4D51",
|
|
1032
996
|
"attributes": {
|
|
1033
997
|
"group": "paint",
|
|
1034
998
|
"state": "active",
|
|
1035
999
|
"introduced": "1.19.0",
|
|
1036
|
-
"description": "Pressed state of color.background.accent.
|
|
1000
|
+
"description": "Pressed state of color.background.accent.gray.subtlest."
|
|
1037
1001
|
}
|
|
1038
1002
|
},
|
|
1039
|
-
"Dark increased-contrast/color.background.accent.
|
|
1040
|
-
"value": "#
|
|
1003
|
+
"Dark increased-contrast/color.background.accent.gray.subtler": {
|
|
1004
|
+
"value": "#4B4D51",
|
|
1041
1005
|
"attributes": {
|
|
1042
1006
|
"group": "paint",
|
|
1043
1007
|
"state": "active",
|
|
1044
1008
|
"introduced": "0.7.0",
|
|
1045
|
-
"description": "Use for
|
|
1009
|
+
"description": "Use for gray backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
1046
1010
|
}
|
|
1047
1011
|
},
|
|
1048
|
-
"Dark increased-contrast/color.background.accent.
|
|
1049
|
-
"value": "#
|
|
1012
|
+
"Dark increased-contrast/color.background.accent.gray.subtler.hovered": {
|
|
1013
|
+
"value": "#63666B",
|
|
1050
1014
|
"attributes": {
|
|
1051
1015
|
"group": "paint",
|
|
1052
1016
|
"state": "active",
|
|
1053
1017
|
"introduced": "1.19.0",
|
|
1054
|
-
"description": "Hovered state of color.background.accent.
|
|
1018
|
+
"description": "Hovered state of color.background.accent.gray.subtler."
|
|
1055
1019
|
}
|
|
1056
1020
|
},
|
|
1057
|
-
"Dark increased-contrast/color.background.accent.
|
|
1058
|
-
"value": "#
|
|
1021
|
+
"Dark increased-contrast/color.background.accent.gray.subtler.pressed": {
|
|
1022
|
+
"value": "#7E8188",
|
|
1059
1023
|
"attributes": {
|
|
1060
1024
|
"group": "paint",
|
|
1061
1025
|
"state": "active",
|
|
1062
1026
|
"introduced": "1.19.0",
|
|
1063
|
-
"description": "Pressed state of color.background.accent.
|
|
1027
|
+
"description": "Pressed state of color.background.accent.gray.subtler."
|
|
1064
1028
|
}
|
|
1065
1029
|
},
|
|
1066
|
-
"Dark increased-contrast/color.background.accent.
|
|
1067
|
-
"value": "#
|
|
1030
|
+
"Dark increased-contrast/color.background.accent.gray.subtle": {
|
|
1031
|
+
"value": "#4B4D51",
|
|
1068
1032
|
"attributes": {
|
|
1069
1033
|
"group": "paint",
|
|
1070
1034
|
"state": "active",
|
|
1071
1035
|
"introduced": "0.7.0",
|
|
1072
|
-
"description": "Use for
|
|
1036
|
+
"description": "Use for vibrant gray backgrounds when there is no meaning tied to the color, such as colored tags."
|
|
1073
1037
|
}
|
|
1074
|
-
},
|
|
1075
|
-
"Dark increased-contrast/color.background.accent.
|
|
1076
|
-
"value": "#
|
|
1038
|
+
},
|
|
1039
|
+
"Dark increased-contrast/color.background.accent.gray.subtle.hovered": {
|
|
1040
|
+
"value": "#303134",
|
|
1077
1041
|
"attributes": {
|
|
1078
1042
|
"group": "paint",
|
|
1079
1043
|
"state": "active",
|
|
1080
1044
|
"introduced": "1.19.0",
|
|
1081
|
-
"description": "Hovered state of color.background.accent.
|
|
1045
|
+
"description": "Hovered state of color.background.accent.gray.subtle."
|
|
1082
1046
|
}
|
|
1083
1047
|
},
|
|
1084
|
-
"Dark increased-contrast/color.background.accent.
|
|
1085
|
-
"value": "#
|
|
1048
|
+
"Dark increased-contrast/color.background.accent.gray.subtle.pressed": {
|
|
1049
|
+
"value": "#242528",
|
|
1086
1050
|
"attributes": {
|
|
1087
1051
|
"group": "paint",
|
|
1088
1052
|
"state": "active",
|
|
1089
1053
|
"introduced": "1.19.0",
|
|
1090
|
-
"description": "Pressed state of color.background.accent.
|
|
1054
|
+
"description": "Pressed state of color.background.accent.gray.subtle."
|
|
1091
1055
|
}
|
|
1092
1056
|
},
|
|
1093
|
-
"Dark increased-contrast/color.background.accent.
|
|
1094
|
-
"value": "#
|
|
1057
|
+
"Dark increased-contrast/color.background.accent.gray.bolder": {
|
|
1058
|
+
"value": "#A9ABAF",
|
|
1095
1059
|
"attributes": {
|
|
1096
1060
|
"group": "paint",
|
|
1097
1061
|
"state": "active",
|
|
1098
1062
|
"introduced": "0.7.0",
|
|
1099
|
-
"description": "Use for
|
|
1063
|
+
"description": "Use for gray backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements."
|
|
1100
1064
|
}
|
|
1101
1065
|
},
|
|
1102
|
-
"Dark increased-contrast/color.background.accent.
|
|
1103
|
-
"value": "#
|
|
1066
|
+
"Dark increased-contrast/color.background.accent.gray.bolder.hovered": {
|
|
1067
|
+
"value": "#BFC1C4",
|
|
1104
1068
|
"attributes": {
|
|
1105
1069
|
"group": "paint",
|
|
1106
1070
|
"state": "active",
|
|
1107
1071
|
"introduced": "1.19.0",
|
|
1108
|
-
"description": "Hovered state of color.background.accent.
|
|
1072
|
+
"description": "Hovered state of color.background.accent.gray.bolder."
|
|
1109
1073
|
}
|
|
1110
1074
|
},
|
|
1111
|
-
"Dark increased-contrast/color.background.accent.
|
|
1112
|
-
"value": "#
|
|
1075
|
+
"Dark increased-contrast/color.background.accent.gray.bolder.pressed": {
|
|
1076
|
+
"value": "#CECFD2",
|
|
1113
1077
|
"attributes": {
|
|
1114
1078
|
"group": "paint",
|
|
1115
1079
|
"state": "active",
|
|
1116
1080
|
"introduced": "1.19.0",
|
|
1117
|
-
"description": "Pressed state of color.background.accent.
|
|
1081
|
+
"description": "Pressed state of color.background.accent.gray.subtlest."
|
|
1118
1082
|
}
|
|
1119
1083
|
},
|
|
1120
|
-
"Dark increased-contrast/color.background.
|
|
1121
|
-
"value": "#
|
|
1084
|
+
"Dark increased-contrast/color.background.disabled": {
|
|
1085
|
+
"value": "#E3E4F21F",
|
|
1122
1086
|
"attributes": {
|
|
1123
1087
|
"group": "paint",
|
|
1124
1088
|
"state": "active",
|
|
1125
|
-
"introduced": "0.
|
|
1126
|
-
"description": "Use for
|
|
1089
|
+
"introduced": "0.0.15",
|
|
1090
|
+
"description": "Use for backgrounds of elements in a disabled state."
|
|
1127
1091
|
}
|
|
1128
1092
|
},
|
|
1129
|
-
"Dark increased-contrast/color.background.
|
|
1130
|
-
"value": "#
|
|
1093
|
+
"Dark increased-contrast/color.background.input": {
|
|
1094
|
+
"value": "#242528",
|
|
1131
1095
|
"attributes": {
|
|
1132
1096
|
"group": "paint",
|
|
1133
1097
|
"state": "active",
|
|
1134
|
-
"introduced": "
|
|
1135
|
-
"description": "
|
|
1098
|
+
"introduced": "0.6.0",
|
|
1099
|
+
"description": "Use for background of form UI elements, such as text fields, checkboxes, and radio buttons."
|
|
1136
1100
|
}
|
|
1137
1101
|
},
|
|
1138
|
-
"Dark increased-contrast/color.background.
|
|
1139
|
-
"value": "#
|
|
1102
|
+
"Dark increased-contrast/color.background.input.hovered": {
|
|
1103
|
+
"value": "#2B2C2F",
|
|
1140
1104
|
"attributes": {
|
|
1141
1105
|
"group": "paint",
|
|
1142
1106
|
"state": "active",
|
|
1143
|
-
"introduced": "
|
|
1144
|
-
"description": "
|
|
1107
|
+
"introduced": "0.6.0",
|
|
1108
|
+
"description": "Hovered state for color.background.input"
|
|
1145
1109
|
}
|
|
1146
1110
|
},
|
|
1147
|
-
"Dark increased-contrast/color.background.
|
|
1148
|
-
"value": "#
|
|
1111
|
+
"Dark increased-contrast/color.background.input.pressed": {
|
|
1112
|
+
"value": "#242528",
|
|
1149
1113
|
"attributes": {
|
|
1150
1114
|
"group": "paint",
|
|
1151
1115
|
"state": "active",
|
|
1152
|
-
"introduced": "0.
|
|
1153
|
-
"description": "
|
|
1116
|
+
"introduced": "0.6.0",
|
|
1117
|
+
"description": "Pressed state for color.background.input"
|
|
1154
1118
|
}
|
|
1155
1119
|
},
|
|
1156
|
-
"Dark increased-contrast/color.background.
|
|
1157
|
-
"value": "#
|
|
1120
|
+
"Dark increased-contrast/color.background.inverse.subtle": {
|
|
1121
|
+
"value": "#FFFFFF29",
|
|
1158
1122
|
"attributes": {
|
|
1159
1123
|
"group": "paint",
|
|
1160
1124
|
"state": "active",
|
|
1161
|
-
"introduced": "
|
|
1162
|
-
"description": "
|
|
1125
|
+
"introduced": "0.8.3",
|
|
1126
|
+
"description": "Use for backgrounds of elements on a bold background, such as in the buttons on spotlight cards."
|
|
1163
1127
|
}
|
|
1164
1128
|
},
|
|
1165
|
-
"Dark increased-contrast/color.background.
|
|
1166
|
-
"value": "#
|
|
1129
|
+
"Dark increased-contrast/color.background.inverse.subtle.hovered": {
|
|
1130
|
+
"value": "#FFFFFF3D",
|
|
1167
1131
|
"attributes": {
|
|
1168
1132
|
"group": "paint",
|
|
1169
1133
|
"state": "active",
|
|
1170
|
-
"introduced": "
|
|
1171
|
-
"description": "
|
|
1134
|
+
"introduced": "0.8.3",
|
|
1135
|
+
"description": "Use for the hovered state of color.background.inverse.subtle"
|
|
1172
1136
|
}
|
|
1173
1137
|
},
|
|
1174
|
-
"Dark increased-contrast/color.background.
|
|
1175
|
-
"value": "#
|
|
1138
|
+
"Dark increased-contrast/color.background.inverse.subtle.pressed": {
|
|
1139
|
+
"value": "#FFFFFF52",
|
|
1176
1140
|
"attributes": {
|
|
1177
1141
|
"group": "paint",
|
|
1178
1142
|
"state": "active",
|
|
1179
|
-
"introduced": "0.
|
|
1180
|
-
"description": "Use for
|
|
1143
|
+
"introduced": "0.8.3",
|
|
1144
|
+
"description": "Use for the pressed state of color.background.inverse.subtle"
|
|
1181
1145
|
}
|
|
1182
1146
|
},
|
|
1183
|
-
"Dark increased-contrast/color.background.
|
|
1184
|
-
"value": "#
|
|
1147
|
+
"Dark increased-contrast/color.background.neutral": {
|
|
1148
|
+
"value": "#CECED912",
|
|
1185
1149
|
"attributes": {
|
|
1186
1150
|
"group": "paint",
|
|
1187
1151
|
"state": "active",
|
|
1188
|
-
"introduced": "
|
|
1189
|
-
"description": "
|
|
1152
|
+
"introduced": "0.6.0",
|
|
1153
|
+
"description": "The default background for neutral elements, such as default buttons."
|
|
1190
1154
|
}
|
|
1191
1155
|
},
|
|
1192
|
-
"Dark increased-contrast/color.background.
|
|
1193
|
-
"value": "#
|
|
1156
|
+
"Dark increased-contrast/color.background.neutral.hovered": {
|
|
1157
|
+
"value": "#E3E4F21F",
|
|
1194
1158
|
"attributes": {
|
|
1195
1159
|
"group": "paint",
|
|
1196
1160
|
"state": "active",
|
|
1197
|
-
"introduced": "
|
|
1198
|
-
"description": "
|
|
1161
|
+
"introduced": "0.6.0",
|
|
1162
|
+
"description": "Hovered state for color.background.neutral"
|
|
1199
1163
|
}
|
|
1200
1164
|
},
|
|
1201
|
-
"Dark increased-contrast/color.background.
|
|
1202
|
-
"value": "#
|
|
1165
|
+
"Dark increased-contrast/color.background.neutral.pressed": {
|
|
1166
|
+
"value": "#E5E9F640",
|
|
1203
1167
|
"attributes": {
|
|
1204
1168
|
"group": "paint",
|
|
1205
1169
|
"state": "active",
|
|
1206
|
-
"introduced": "0.
|
|
1207
|
-
"description": "
|
|
1170
|
+
"introduced": "0.6.0",
|
|
1171
|
+
"description": "Pressed state for color.background.neutral"
|
|
1208
1172
|
}
|
|
1209
1173
|
},
|
|
1210
|
-
"Dark increased-contrast/color.background.
|
|
1211
|
-
"value": "#
|
|
1174
|
+
"Dark increased-contrast/color.background.neutral.subtle": {
|
|
1175
|
+
"value": "#00000000",
|
|
1212
1176
|
"attributes": {
|
|
1213
1177
|
"group": "paint",
|
|
1214
1178
|
"state": "active",
|
|
1215
|
-
"introduced": "
|
|
1216
|
-
"description": "
|
|
1179
|
+
"introduced": "0.6.0",
|
|
1180
|
+
"description": "Use for the background of elements that appear to have no background in a resting state, such as subtle buttons and menu items."
|
|
1217
1181
|
}
|
|
1218
1182
|
},
|
|
1219
|
-
"Dark increased-contrast/color.background.
|
|
1220
|
-
"value": "#
|
|
1183
|
+
"Dark increased-contrast/color.background.neutral.subtle.hovered": {
|
|
1184
|
+
"value": "#CECED912",
|
|
1221
1185
|
"attributes": {
|
|
1222
1186
|
"group": "paint",
|
|
1223
1187
|
"state": "active",
|
|
1224
|
-
"introduced": "
|
|
1225
|
-
"description": "
|
|
1188
|
+
"introduced": "0.6.0",
|
|
1189
|
+
"description": "Hovered state for color.background.neutral.subtle"
|
|
1226
1190
|
}
|
|
1227
1191
|
},
|
|
1228
|
-
"Dark increased-contrast/color.background.
|
|
1229
|
-
"value": "#
|
|
1192
|
+
"Dark increased-contrast/color.background.neutral.subtle.pressed": {
|
|
1193
|
+
"value": "#E3E4F21F",
|
|
1230
1194
|
"attributes": {
|
|
1231
1195
|
"group": "paint",
|
|
1232
1196
|
"state": "active",
|
|
1233
|
-
"introduced": "0.
|
|
1234
|
-
"description": "
|
|
1197
|
+
"introduced": "0.6.0",
|
|
1198
|
+
"description": "Pressed state for color.background.neutral.subtle"
|
|
1235
1199
|
}
|
|
1236
1200
|
},
|
|
1237
|
-
"Dark increased-contrast/color.background.
|
|
1238
|
-
"value": "#
|
|
1201
|
+
"Dark increased-contrast/color.background.neutral.bold": {
|
|
1202
|
+
"value": "#CECFD2",
|
|
1239
1203
|
"attributes": {
|
|
1240
1204
|
"group": "paint",
|
|
1241
1205
|
"state": "active",
|
|
1242
|
-
"introduced": "
|
|
1243
|
-
"description": "
|
|
1206
|
+
"introduced": "0.6.0",
|
|
1207
|
+
"description": "A vibrant background option for neutral UI elements, such as announcement banners."
|
|
1244
1208
|
}
|
|
1245
1209
|
},
|
|
1246
|
-
"Dark increased-contrast/color.background.
|
|
1247
|
-
"value": "#
|
|
1210
|
+
"Dark increased-contrast/color.background.neutral.bold.hovered": {
|
|
1211
|
+
"value": "#BFC1C4",
|
|
1248
1212
|
"attributes": {
|
|
1249
1213
|
"group": "paint",
|
|
1250
1214
|
"state": "active",
|
|
1251
|
-
"introduced": "
|
|
1252
|
-
"description": "
|
|
1215
|
+
"introduced": "0.6.0",
|
|
1216
|
+
"description": "Hovered state of color.background.neutral.bold"
|
|
1253
1217
|
}
|
|
1254
1218
|
},
|
|
1255
|
-
"Dark increased-contrast/color.background.
|
|
1256
|
-
"value": "#
|
|
1219
|
+
"Dark increased-contrast/color.background.neutral.bold.pressed": {
|
|
1220
|
+
"value": "#A9ABAF",
|
|
1257
1221
|
"attributes": {
|
|
1258
1222
|
"group": "paint",
|
|
1259
1223
|
"state": "active",
|
|
1260
|
-
"introduced": "0.
|
|
1261
|
-
"description": "
|
|
1224
|
+
"introduced": "0.6.0",
|
|
1225
|
+
"description": "Pressed state of color.background.neutral.bold"
|
|
1262
1226
|
}
|
|
1263
1227
|
},
|
|
1264
|
-
"Dark increased-contrast/color.background.
|
|
1265
|
-
"value": "#
|
|
1228
|
+
"Dark increased-contrast/color.background.selected": {
|
|
1229
|
+
"value": "#1C2B42",
|
|
1266
1230
|
"attributes": {
|
|
1267
1231
|
"group": "paint",
|
|
1268
1232
|
"state": "active",
|
|
1269
|
-
"introduced": "
|
|
1270
|
-
"description": "
|
|
1233
|
+
"introduced": "0.6.2",
|
|
1234
|
+
"description": "Use for the background of elements in a selected state, such as in opened dropdown buttons."
|
|
1271
1235
|
}
|
|
1272
1236
|
},
|
|
1273
|
-
"Dark increased-contrast/color.background.
|
|
1274
|
-
"value": "#
|
|
1237
|
+
"Dark increased-contrast/color.background.selected.hovered": {
|
|
1238
|
+
"value": "#123263",
|
|
1275
1239
|
"attributes": {
|
|
1276
1240
|
"group": "paint",
|
|
1277
1241
|
"state": "active",
|
|
1278
|
-
"introduced": "
|
|
1279
|
-
"description": "
|
|
1242
|
+
"introduced": "0.6.2",
|
|
1243
|
+
"description": "Hovered state for color.background.selected"
|
|
1280
1244
|
}
|
|
1281
1245
|
},
|
|
1282
|
-
"Dark increased-contrast/color.background.
|
|
1283
|
-
"value": "#
|
|
1246
|
+
"Dark increased-contrast/color.background.selected.pressed": {
|
|
1247
|
+
"value": "#1558BC",
|
|
1284
1248
|
"attributes": {
|
|
1285
1249
|
"group": "paint",
|
|
1286
1250
|
"state": "active",
|
|
1287
|
-
"introduced": "0.
|
|
1288
|
-
"description": "
|
|
1251
|
+
"introduced": "0.6.2",
|
|
1252
|
+
"description": "Pressed state for color.background.selected"
|
|
1289
1253
|
}
|
|
1290
1254
|
},
|
|
1291
|
-
"Dark increased-contrast/color.background.
|
|
1292
|
-
"value": "#
|
|
1255
|
+
"Dark increased-contrast/color.background.selected.bold": {
|
|
1256
|
+
"value": "#CFE1FD",
|
|
1293
1257
|
"attributes": {
|
|
1294
1258
|
"group": "paint",
|
|
1295
1259
|
"state": "active",
|
|
1296
|
-
"introduced": "
|
|
1297
|
-
"description": "
|
|
1260
|
+
"introduced": "0.6.2",
|
|
1261
|
+
"description": "Use for the backgrounds of elements in a selected state, such as checkboxes and radio buttons."
|
|
1298
1262
|
}
|
|
1299
1263
|
},
|
|
1300
|
-
"Dark increased-contrast/color.background.
|
|
1301
|
-
"value": "#
|
|
1264
|
+
"Dark increased-contrast/color.background.selected.bold.hovered": {
|
|
1265
|
+
"value": "#E9F2FE",
|
|
1302
1266
|
"attributes": {
|
|
1303
1267
|
"group": "paint",
|
|
1304
1268
|
"state": "active",
|
|
1305
|
-
"introduced": "
|
|
1306
|
-
"description": "
|
|
1269
|
+
"introduced": "0.6.2",
|
|
1270
|
+
"description": "Hovered state of color.background.selected.bold"
|
|
1307
1271
|
}
|
|
1308
1272
|
},
|
|
1309
|
-
"Dark increased-contrast/color.background.
|
|
1310
|
-
"value": "#
|
|
1273
|
+
"Dark increased-contrast/color.background.selected.bold.pressed": {
|
|
1274
|
+
"value": "#E2E3E4",
|
|
1311
1275
|
"attributes": {
|
|
1312
1276
|
"group": "paint",
|
|
1313
1277
|
"state": "active",
|
|
1314
|
-
"introduced": "0.
|
|
1315
|
-
"description": "
|
|
1278
|
+
"introduced": "0.6.2",
|
|
1279
|
+
"description": "Pressed state of color.background.selected.bold"
|
|
1316
1280
|
}
|
|
1317
1281
|
},
|
|
1318
|
-
"Dark increased-contrast/color.background.
|
|
1319
|
-
"value": "#
|
|
1282
|
+
"Dark increased-contrast/color.background.brand.subtlest": {
|
|
1283
|
+
"value": "#1C2B42",
|
|
1320
1284
|
"attributes": {
|
|
1321
1285
|
"group": "paint",
|
|
1322
1286
|
"state": "active",
|
|
1323
|
-
"introduced": "1.
|
|
1324
|
-
"description": "
|
|
1287
|
+
"introduced": "1.13.0",
|
|
1288
|
+
"description": "Use for the background of elements used to reinforce our brand, but with less emphasis."
|
|
1325
1289
|
}
|
|
1326
1290
|
},
|
|
1327
|
-
"Dark increased-contrast/color.background.
|
|
1328
|
-
"value": "#
|
|
1291
|
+
"Dark increased-contrast/color.background.brand.subtlest.hovered": {
|
|
1292
|
+
"value": "#123263",
|
|
1329
1293
|
"attributes": {
|
|
1330
1294
|
"group": "paint",
|
|
1331
1295
|
"state": "active",
|
|
1332
|
-
"introduced": "1.
|
|
1333
|
-
"description": "
|
|
1296
|
+
"introduced": "1.13.0",
|
|
1297
|
+
"description": "Hovered state of color.background.brand.subtlest."
|
|
1334
1298
|
}
|
|
1335
1299
|
},
|
|
1336
|
-
"Dark increased-contrast/color.background.
|
|
1337
|
-
"value": "#
|
|
1300
|
+
"Dark increased-contrast/color.background.brand.subtlest.pressed": {
|
|
1301
|
+
"value": "#144794",
|
|
1338
1302
|
"attributes": {
|
|
1339
1303
|
"group": "paint",
|
|
1340
1304
|
"state": "active",
|
|
1341
|
-
"introduced": "
|
|
1342
|
-
"description": "
|
|
1305
|
+
"introduced": "1.13.0",
|
|
1306
|
+
"description": "Pressed state of color.background.brand.subtlest"
|
|
1343
1307
|
}
|
|
1344
1308
|
},
|
|
1345
|
-
"Dark increased-contrast/color.background.
|
|
1346
|
-
"value": "#
|
|
1309
|
+
"Dark increased-contrast/color.background.brand.bold": {
|
|
1310
|
+
"value": "#CFE1FD",
|
|
1347
1311
|
"attributes": {
|
|
1348
1312
|
"group": "paint",
|
|
1349
1313
|
"state": "active",
|
|
1350
|
-
"introduced": "
|
|
1351
|
-
"description": "
|
|
1314
|
+
"introduced": "0.6.0",
|
|
1315
|
+
"description": "Use for the background of elements used to reinforce our brand, but with more emphasis."
|
|
1352
1316
|
}
|
|
1353
1317
|
},
|
|
1354
|
-
"Dark increased-contrast/color.background.
|
|
1355
|
-
"value": "#
|
|
1318
|
+
"Dark increased-contrast/color.background.brand.bold.hovered": {
|
|
1319
|
+
"value": "#E9F2FE",
|
|
1356
1320
|
"attributes": {
|
|
1357
1321
|
"group": "paint",
|
|
1358
1322
|
"state": "active",
|
|
1359
|
-
"introduced": "
|
|
1360
|
-
"description": "
|
|
1323
|
+
"introduced": "0.6.0",
|
|
1324
|
+
"description": "Hovered state of color.background.brand.bold."
|
|
1361
1325
|
}
|
|
1362
1326
|
},
|
|
1363
|
-
"Dark increased-contrast/color.background.
|
|
1364
|
-
"value": "#
|
|
1327
|
+
"Dark increased-contrast/color.background.brand.bold.pressed": {
|
|
1328
|
+
"value": "#E2E3E4",
|
|
1329
|
+
"attributes": {
|
|
1330
|
+
"group": "paint",
|
|
1331
|
+
"state": "active",
|
|
1332
|
+
"introduced": "0.6.0",
|
|
1333
|
+
"description": "Pressed state of color.background.brand.bold."
|
|
1334
|
+
}
|
|
1335
|
+
},
|
|
1336
|
+
"Dark increased-contrast/color.background.brand.boldest": {
|
|
1337
|
+
"value": "#E9F2FE",
|
|
1365
1338
|
"attributes": {
|
|
1366
1339
|
"group": "paint",
|
|
1367
1340
|
"state": "active",
|
|
1368
|
-
"introduced": "
|
|
1369
|
-
"description": "Use for
|
|
1341
|
+
"introduced": "1.13.0",
|
|
1342
|
+
"description": "Use for the background of elements used to reinforce our brand, that need to stand out a lot."
|
|
1370
1343
|
}
|
|
1371
1344
|
},
|
|
1372
|
-
"Dark increased-contrast/color.background.
|
|
1373
|
-
"value": "#
|
|
1345
|
+
"Dark increased-contrast/color.background.brand.boldest.hovered": {
|
|
1346
|
+
"value": "#CFE1FD",
|
|
1374
1347
|
"attributes": {
|
|
1375
1348
|
"group": "paint",
|
|
1376
1349
|
"state": "active",
|
|
1377
|
-
"introduced": "1.
|
|
1378
|
-
"description": "Hovered state of color.background.
|
|
1350
|
+
"introduced": "1.13.0",
|
|
1351
|
+
"description": "Hovered state of color.background.brand.boldest."
|
|
1379
1352
|
}
|
|
1380
1353
|
},
|
|
1381
|
-
"Dark increased-contrast/color.background.
|
|
1382
|
-
"value": "#
|
|
1354
|
+
"Dark increased-contrast/color.background.brand.boldest.pressed": {
|
|
1355
|
+
"value": "#ADCBFB",
|
|
1383
1356
|
"attributes": {
|
|
1384
1357
|
"group": "paint",
|
|
1385
1358
|
"state": "active",
|
|
1386
|
-
"introduced": "1.
|
|
1387
|
-
"description": "Pressed state of color.background.
|
|
1359
|
+
"introduced": "1.13.0",
|
|
1360
|
+
"description": "Pressed state of color.background.brand.boldest."
|
|
1388
1361
|
}
|
|
1389
1362
|
},
|
|
1390
|
-
"Dark increased-contrast/color.background.
|
|
1391
|
-
"value": "#
|
|
1363
|
+
"Dark increased-contrast/color.background.danger": {
|
|
1364
|
+
"value": "#42221F",
|
|
1392
1365
|
"attributes": {
|
|
1393
1366
|
"group": "paint",
|
|
1394
1367
|
"state": "active",
|
|
1395
|
-
"introduced": "0.
|
|
1396
|
-
"description": "Use for
|
|
1368
|
+
"introduced": "0.6.0",
|
|
1369
|
+
"description": "Use for backgrounds communicating critical information, such in error section messages."
|
|
1397
1370
|
}
|
|
1398
1371
|
},
|
|
1399
|
-
"Dark increased-contrast/color.background.
|
|
1400
|
-
"value": "#
|
|
1372
|
+
"Dark increased-contrast/color.background.danger.hovered": {
|
|
1373
|
+
"value": "#5D1F1A",
|
|
1401
1374
|
"attributes": {
|
|
1402
1375
|
"group": "paint",
|
|
1403
1376
|
"state": "active",
|
|
1404
|
-
"introduced": "
|
|
1405
|
-
"description": "Hovered state
|
|
1377
|
+
"introduced": "0.6.0",
|
|
1378
|
+
"description": "Hovered state for color.background.danger"
|
|
1406
1379
|
}
|
|
1407
1380
|
},
|
|
1408
|
-
"Dark increased-contrast/color.background.
|
|
1409
|
-
"value": "#
|
|
1381
|
+
"Dark increased-contrast/color.background.danger.pressed": {
|
|
1382
|
+
"value": "#872821",
|
|
1410
1383
|
"attributes": {
|
|
1411
1384
|
"group": "paint",
|
|
1412
1385
|
"state": "active",
|
|
1413
|
-
"introduced": "
|
|
1414
|
-
"description": "Pressed state
|
|
1386
|
+
"introduced": "0.6.0",
|
|
1387
|
+
"description": "Pressed state for color.background.danger"
|
|
1415
1388
|
}
|
|
1416
1389
|
},
|
|
1417
|
-
"Dark increased-contrast/color.background.
|
|
1418
|
-
"value": "#
|
|
1390
|
+
"Dark increased-contrast/color.background.danger.subtler": {
|
|
1391
|
+
"value": "#5D1F1A",
|
|
1419
1392
|
"attributes": {
|
|
1420
1393
|
"group": "paint",
|
|
1421
1394
|
"state": "active",
|
|
1422
|
-
"introduced": "
|
|
1423
|
-
"description": "Use for
|
|
1395
|
+
"introduced": "8.1.0",
|
|
1396
|
+
"description": "Use for backgrounds of danger lozenges and badges to ensure accessibility and desired visual appearance."
|
|
1424
1397
|
}
|
|
1425
1398
|
},
|
|
1426
|
-
"Dark increased-contrast/color.background.
|
|
1427
|
-
"value": "#
|
|
1399
|
+
"Dark increased-contrast/color.background.danger.subtler.hovered": {
|
|
1400
|
+
"value": "#872821",
|
|
1428
1401
|
"attributes": {
|
|
1429
1402
|
"group": "paint",
|
|
1430
1403
|
"state": "active",
|
|
1431
|
-
"introduced": "1.
|
|
1432
|
-
"description": "Hovered state of color.background.
|
|
1404
|
+
"introduced": "8.1.0",
|
|
1405
|
+
"description": "Hovered state of color.background.danger.subtler"
|
|
1433
1406
|
}
|
|
1434
1407
|
},
|
|
1435
|
-
"Dark increased-contrast/color.background.
|
|
1436
|
-
"value": "#
|
|
1408
|
+
"Dark increased-contrast/color.background.danger.subtler.pressed": {
|
|
1409
|
+
"value": "#AE2E24",
|
|
1437
1410
|
"attributes": {
|
|
1438
1411
|
"group": "paint",
|
|
1439
1412
|
"state": "active",
|
|
1440
|
-
"introduced": "1.
|
|
1441
|
-
"description": "Pressed state of color.background.
|
|
1413
|
+
"introduced": "8.1.0",
|
|
1414
|
+
"description": "Pressed state of color.background.danger.subtler"
|
|
1442
1415
|
}
|
|
1443
1416
|
},
|
|
1444
|
-
"Dark increased-contrast/color.background.
|
|
1445
|
-
"value": "#
|
|
1417
|
+
"Dark increased-contrast/color.background.danger.subtle": {
|
|
1418
|
+
"value": "#AE2E24",
|
|
1446
1419
|
"attributes": {
|
|
1447
1420
|
"group": "paint",
|
|
1448
1421
|
"state": "active",
|
|
1449
|
-
"introduced": "
|
|
1450
|
-
"description": "
|
|
1422
|
+
"introduced": "13.2.0",
|
|
1423
|
+
"description": "Background colour for non-interactive elements communicating critical danger information (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.danger.bold or color.background.danger.subtler for interactive states."
|
|
1451
1424
|
}
|
|
1452
1425
|
},
|
|
1453
|
-
"Dark increased-contrast/color.background.
|
|
1454
|
-
"value": "#
|
|
1426
|
+
"Dark increased-contrast/color.background.danger.bold": {
|
|
1427
|
+
"value": "#FFD5D2",
|
|
1455
1428
|
"attributes": {
|
|
1456
1429
|
"group": "paint",
|
|
1457
1430
|
"state": "active",
|
|
1458
|
-
"introduced": "
|
|
1459
|
-
"description": "
|
|
1431
|
+
"introduced": "0.6.0",
|
|
1432
|
+
"description": "A vibrant background option for communicating critical information, such as in danger buttons and error banners."
|
|
1460
1433
|
}
|
|
1461
1434
|
},
|
|
1462
|
-
"Dark increased-contrast/color.background.
|
|
1463
|
-
"value": "#
|
|
1435
|
+
"Dark increased-contrast/color.background.danger.bold.hovered": {
|
|
1436
|
+
"value": "#FFECEB",
|
|
1464
1437
|
"attributes": {
|
|
1465
1438
|
"group": "paint",
|
|
1466
1439
|
"state": "active",
|
|
1467
|
-
"introduced": "
|
|
1468
|
-
"description": "
|
|
1440
|
+
"introduced": "0.6.0",
|
|
1441
|
+
"description": "Hovered state of color.background.danger.bold"
|
|
1469
1442
|
}
|
|
1470
1443
|
},
|
|
1471
|
-
"Dark increased-contrast/color.background.
|
|
1472
|
-
"value": "#
|
|
1444
|
+
"Dark increased-contrast/color.background.danger.bold.pressed": {
|
|
1445
|
+
"value": "#E2E3E4",
|
|
1473
1446
|
"attributes": {
|
|
1474
1447
|
"group": "paint",
|
|
1475
1448
|
"state": "active",
|
|
1476
|
-
"introduced": "0.
|
|
1477
|
-
"description": "
|
|
1449
|
+
"introduced": "0.6.0",
|
|
1450
|
+
"description": "Pressed state of color.background.danger.bold"
|
|
1478
1451
|
}
|
|
1479
1452
|
},
|
|
1480
|
-
"Dark increased-contrast/color.background.
|
|
1481
|
-
"value": "#
|
|
1453
|
+
"Dark increased-contrast/color.background.warning": {
|
|
1454
|
+
"value": "#3A2C1F",
|
|
1482
1455
|
"attributes": {
|
|
1483
1456
|
"group": "paint",
|
|
1484
1457
|
"state": "active",
|
|
1485
|
-
"introduced": "
|
|
1486
|
-
"description": "
|
|
1458
|
+
"introduced": "0.6.0",
|
|
1459
|
+
"description": "Use for backgrounds communicating caution, such as in warning section messages."
|
|
1487
1460
|
}
|
|
1488
1461
|
},
|
|
1489
|
-
"Dark increased-contrast/color.background.
|
|
1490
|
-
"value": "#
|
|
1462
|
+
"Dark increased-contrast/color.background.warning.hovered": {
|
|
1463
|
+
"value": "#693200",
|
|
1491
1464
|
"attributes": {
|
|
1492
1465
|
"group": "paint",
|
|
1493
1466
|
"state": "active",
|
|
1494
|
-
"introduced": "
|
|
1495
|
-
"description": "
|
|
1467
|
+
"introduced": "0.6.0",
|
|
1468
|
+
"description": "Hovered state for color.background.warning"
|
|
1496
1469
|
}
|
|
1497
1470
|
},
|
|
1498
|
-
"Dark increased-contrast/color.background.
|
|
1499
|
-
"value": "#
|
|
1471
|
+
"Dark increased-contrast/color.background.warning.pressed": {
|
|
1472
|
+
"value": "#7A3B00",
|
|
1500
1473
|
"attributes": {
|
|
1501
1474
|
"group": "paint",
|
|
1502
1475
|
"state": "active",
|
|
1503
|
-
"introduced": "0.
|
|
1504
|
-
"description": "
|
|
1476
|
+
"introduced": "0.6.0",
|
|
1477
|
+
"description": "Pressed state for color.background.warning"
|
|
1505
1478
|
}
|
|
1506
1479
|
},
|
|
1507
|
-
"Dark increased-contrast/color.background.
|
|
1508
|
-
"value": "#
|
|
1480
|
+
"Dark increased-contrast/color.background.warning.subtler": {
|
|
1481
|
+
"value": "#693200",
|
|
1509
1482
|
"attributes": {
|
|
1510
1483
|
"group": "paint",
|
|
1511
1484
|
"state": "active",
|
|
1512
|
-
"introduced": "1.
|
|
1513
|
-
"description": "
|
|
1485
|
+
"introduced": "8.1.0",
|
|
1486
|
+
"description": "Use for backgrounds of warning lozenges and badges to ensure accessibility and desired visual appearance."
|
|
1514
1487
|
}
|
|
1515
1488
|
},
|
|
1516
|
-
"Dark increased-contrast/color.background.
|
|
1517
|
-
"value": "#
|
|
1489
|
+
"Dark increased-contrast/color.background.warning.subtler.hovered": {
|
|
1490
|
+
"value": "#7A3B00",
|
|
1518
1491
|
"attributes": {
|
|
1519
1492
|
"group": "paint",
|
|
1520
1493
|
"state": "active",
|
|
1521
|
-
"introduced": "1.
|
|
1522
|
-
"description": "
|
|
1494
|
+
"introduced": "8.1.0",
|
|
1495
|
+
"description": "Hovered state of color.background.warning.subtler"
|
|
1523
1496
|
}
|
|
1524
1497
|
},
|
|
1525
|
-
"Dark increased-contrast/color.background.
|
|
1526
|
-
"value": "#
|
|
1498
|
+
"Dark increased-contrast/color.background.warning.subtler.pressed": {
|
|
1499
|
+
"value": "#9E4C00",
|
|
1527
1500
|
"attributes": {
|
|
1528
1501
|
"group": "paint",
|
|
1529
1502
|
"state": "active",
|
|
1530
|
-
"introduced": "
|
|
1531
|
-
"description": "
|
|
1503
|
+
"introduced": "8.1.0",
|
|
1504
|
+
"description": "Pressed state of color.background.warning.subtler"
|
|
1532
1505
|
}
|
|
1533
1506
|
},
|
|
1534
|
-
"Dark increased-contrast/color.background.
|
|
1535
|
-
"value": "#
|
|
1507
|
+
"Dark increased-contrast/color.background.warning.subtle": {
|
|
1508
|
+
"value": "#9E4C00",
|
|
1536
1509
|
"attributes": {
|
|
1537
1510
|
"group": "paint",
|
|
1538
1511
|
"state": "active",
|
|
1539
|
-
"introduced": "
|
|
1540
|
-
"description": "
|
|
1512
|
+
"introduced": "13.2.0",
|
|
1513
|
+
"description": "Background colour for non-interactive elements communicating caution (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.warning.bold or color.background.warning.subtler for interactive states."
|
|
1541
1514
|
}
|
|
1542
1515
|
},
|
|
1543
|
-
"Dark increased-contrast/color.background.
|
|
1544
|
-
"value": "#
|
|
1516
|
+
"Dark increased-contrast/color.background.warning.bold": {
|
|
1517
|
+
"value": "#F5E989",
|
|
1545
1518
|
"attributes": {
|
|
1546
1519
|
"group": "paint",
|
|
1547
1520
|
"state": "active",
|
|
1548
|
-
"introduced": "
|
|
1549
|
-
"description": "
|
|
1521
|
+
"introduced": "0.6.0",
|
|
1522
|
+
"description": "A vibrant background option for communicating caution, such as in warning buttons and warning banners."
|
|
1550
1523
|
}
|
|
1551
1524
|
},
|
|
1552
|
-
"Dark increased-contrast/color.background.
|
|
1553
|
-
"value": "#
|
|
1525
|
+
"Dark increased-contrast/color.background.warning.bold.hovered": {
|
|
1526
|
+
"value": "#FEF7C8",
|
|
1554
1527
|
"attributes": {
|
|
1555
1528
|
"group": "paint",
|
|
1556
1529
|
"state": "active",
|
|
1557
|
-
"introduced": "0.
|
|
1558
|
-
"description": "
|
|
1530
|
+
"introduced": "0.6.0",
|
|
1531
|
+
"description": "Hovered state of color.background.warning.bold"
|
|
1559
1532
|
}
|
|
1560
1533
|
},
|
|
1561
|
-
"Dark increased-contrast/color.background.
|
|
1562
|
-
"value": "#
|
|
1534
|
+
"Dark increased-contrast/color.background.warning.bold.pressed": {
|
|
1535
|
+
"value": "#E2E3E4",
|
|
1563
1536
|
"attributes": {
|
|
1564
1537
|
"group": "paint",
|
|
1565
1538
|
"state": "active",
|
|
1566
|
-
"introduced": "
|
|
1567
|
-
"description": "
|
|
1539
|
+
"introduced": "0.6.0",
|
|
1540
|
+
"description": "Pressed state of color.background.warning.bold"
|
|
1568
1541
|
}
|
|
1569
1542
|
},
|
|
1570
|
-
"Dark increased-contrast/color.background.
|
|
1571
|
-
"value": "#
|
|
1543
|
+
"Dark increased-contrast/color.background.success": {
|
|
1544
|
+
"value": "#28311B",
|
|
1572
1545
|
"attributes": {
|
|
1573
1546
|
"group": "paint",
|
|
1574
1547
|
"state": "active",
|
|
1575
|
-
"introduced": "
|
|
1576
|
-
"description": "
|
|
1548
|
+
"introduced": "0.6.0",
|
|
1549
|
+
"description": "Use for backgrounds communicating a favorable outcome, such as in success section messages."
|
|
1577
1550
|
}
|
|
1578
1551
|
},
|
|
1579
|
-
"Dark increased-contrast/color.background.
|
|
1580
|
-
"value": "#
|
|
1552
|
+
"Dark increased-contrast/color.background.success.hovered": {
|
|
1553
|
+
"value": "#37471F",
|
|
1581
1554
|
"attributes": {
|
|
1582
1555
|
"group": "paint",
|
|
1583
1556
|
"state": "active",
|
|
1584
|
-
"introduced": "0.
|
|
1585
|
-
"description": "
|
|
1557
|
+
"introduced": "0.6.0",
|
|
1558
|
+
"description": "Hovered state for color.background.success"
|
|
1586
1559
|
}
|
|
1587
1560
|
},
|
|
1588
|
-
"Dark increased-contrast/color.background.
|
|
1589
|
-
"value": "#
|
|
1561
|
+
"Dark increased-contrast/color.background.success.pressed": {
|
|
1562
|
+
"value": "#3F5224",
|
|
1590
1563
|
"attributes": {
|
|
1591
1564
|
"group": "paint",
|
|
1592
1565
|
"state": "active",
|
|
1593
|
-
"introduced": "
|
|
1594
|
-
"description": "
|
|
1566
|
+
"introduced": "0.6.0",
|
|
1567
|
+
"description": "Pressed state for color.background.success"
|
|
1595
1568
|
}
|
|
1596
1569
|
},
|
|
1597
|
-
"Dark increased-contrast/color.background.
|
|
1598
|
-
"value": "#
|
|
1570
|
+
"Dark increased-contrast/color.background.success.subtler": {
|
|
1571
|
+
"value": "#37471F",
|
|
1599
1572
|
"attributes": {
|
|
1600
1573
|
"group": "paint",
|
|
1601
1574
|
"state": "active",
|
|
1602
|
-
"introduced": "1.
|
|
1603
|
-
"description": "
|
|
1575
|
+
"introduced": "8.1.0",
|
|
1576
|
+
"description": "Use for backgrounds of success lozenges and badges to ensure accessibility and desired visual appearance."
|
|
1604
1577
|
}
|
|
1605
1578
|
},
|
|
1606
|
-
"Dark increased-contrast/color.background.
|
|
1607
|
-
"value": "#
|
|
1579
|
+
"Dark increased-contrast/color.background.success.subtler.hovered": {
|
|
1580
|
+
"value": "#3F5224",
|
|
1608
1581
|
"attributes": {
|
|
1609
1582
|
"group": "paint",
|
|
1610
1583
|
"state": "active",
|
|
1611
|
-
"introduced": "
|
|
1612
|
-
"description": "
|
|
1584
|
+
"introduced": "8.1.0",
|
|
1585
|
+
"description": "Hovered state of color.background.success.subtler"
|
|
1613
1586
|
}
|
|
1614
1587
|
},
|
|
1615
|
-
"Dark increased-contrast/color.background.
|
|
1616
|
-
"value": "#
|
|
1588
|
+
"Dark increased-contrast/color.background.success.subtler.pressed": {
|
|
1589
|
+
"value": "#4C6B1F",
|
|
1617
1590
|
"attributes": {
|
|
1618
1591
|
"group": "paint",
|
|
1619
1592
|
"state": "active",
|
|
1620
|
-
"introduced": "1.
|
|
1621
|
-
"description": "
|
|
1593
|
+
"introduced": "8.1.0",
|
|
1594
|
+
"description": "Pressed state of color.background.success.subtler"
|
|
1622
1595
|
}
|
|
1623
1596
|
},
|
|
1624
|
-
"Dark increased-contrast/color.background.
|
|
1625
|
-
"value": "#
|
|
1597
|
+
"Dark increased-contrast/color.background.success.subtle": {
|
|
1598
|
+
"value": "#4C6B1F",
|
|
1626
1599
|
"attributes": {
|
|
1627
1600
|
"group": "paint",
|
|
1628
1601
|
"state": "active",
|
|
1629
|
-
"introduced": "
|
|
1630
|
-
"description": "
|
|
1602
|
+
"introduced": "13.2.0",
|
|
1603
|
+
"description": "Background colour for non-interactive elements communicating success (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.success.bold or color.background.success.subtler for interactive states."
|
|
1631
1604
|
}
|
|
1632
1605
|
},
|
|
1633
|
-
"Dark increased-contrast/color.background.
|
|
1634
|
-
"value": "#
|
|
1606
|
+
"Dark increased-contrast/color.background.success.bold": {
|
|
1607
|
+
"value": "#BAF3DB",
|
|
1635
1608
|
"attributes": {
|
|
1636
1609
|
"group": "paint",
|
|
1637
1610
|
"state": "active",
|
|
1638
|
-
"introduced": "0.
|
|
1639
|
-
"description": "
|
|
1611
|
+
"introduced": "0.6.0",
|
|
1612
|
+
"description": "A vibrant background option for communicating a favorable outcome, such as in checked toggles."
|
|
1640
1613
|
}
|
|
1641
1614
|
},
|
|
1642
|
-
"Dark increased-contrast/color.background.
|
|
1643
|
-
"value": "#
|
|
1615
|
+
"Dark increased-contrast/color.background.success.bold.hovered": {
|
|
1616
|
+
"value": "#DCFFF1",
|
|
1644
1617
|
"attributes": {
|
|
1645
1618
|
"group": "paint",
|
|
1646
1619
|
"state": "active",
|
|
1647
|
-
"introduced": "
|
|
1648
|
-
"description": "Hovered state of color.background.
|
|
1620
|
+
"introduced": "0.6.0",
|
|
1621
|
+
"description": "Hovered state of color.background.success.bold"
|
|
1649
1622
|
}
|
|
1650
1623
|
},
|
|
1651
|
-
"Dark increased-contrast/color.background.
|
|
1652
|
-
"value": "#
|
|
1624
|
+
"Dark increased-contrast/color.background.success.bold.pressed": {
|
|
1625
|
+
"value": "#E2E3E4",
|
|
1653
1626
|
"attributes": {
|
|
1654
1627
|
"group": "paint",
|
|
1655
1628
|
"state": "active",
|
|
1656
|
-
"introduced": "
|
|
1657
|
-
"description": "Pressed state of color.background.
|
|
1629
|
+
"introduced": "0.6.0",
|
|
1630
|
+
"description": "Pressed state of color.background.success.bold"
|
|
1658
1631
|
}
|
|
1659
1632
|
},
|
|
1660
|
-
"Dark increased-contrast/color.background.
|
|
1661
|
-
"value": "#
|
|
1633
|
+
"Dark increased-contrast/color.background.discovery": {
|
|
1634
|
+
"value": "#35243F",
|
|
1662
1635
|
"attributes": {
|
|
1663
1636
|
"group": "paint",
|
|
1664
1637
|
"state": "active",
|
|
1665
|
-
"introduced": "0.
|
|
1666
|
-
"description": "Use for
|
|
1638
|
+
"introduced": "0.6.0",
|
|
1639
|
+
"description": "Use for backgrounds communicating change or something new, such as in discovery section messages."
|
|
1667
1640
|
}
|
|
1668
1641
|
},
|
|
1669
|
-
"Dark increased-contrast/color.background.
|
|
1670
|
-
"value": "#
|
|
1642
|
+
"Dark increased-contrast/color.background.discovery.hovered": {
|
|
1643
|
+
"value": "#48245D",
|
|
1671
1644
|
"attributes": {
|
|
1672
1645
|
"group": "paint",
|
|
1673
1646
|
"state": "active",
|
|
1674
|
-
"introduced": "
|
|
1675
|
-
"description": "
|
|
1647
|
+
"introduced": "0.6.0",
|
|
1648
|
+
"description": "Hover state for color.background.discovery"
|
|
1676
1649
|
}
|
|
1677
1650
|
},
|
|
1678
|
-
"Dark increased-contrast/color.background.
|
|
1679
|
-
"value": "#
|
|
1651
|
+
"Dark increased-contrast/color.background.discovery.pressed": {
|
|
1652
|
+
"value": "#673286",
|
|
1680
1653
|
"attributes": {
|
|
1681
1654
|
"group": "paint",
|
|
1682
1655
|
"state": "active",
|
|
1683
|
-
"introduced": "
|
|
1684
|
-
"description": "Pressed state
|
|
1656
|
+
"introduced": "0.6.0",
|
|
1657
|
+
"description": "Pressed state for color.background.discovery"
|
|
1685
1658
|
}
|
|
1686
1659
|
},
|
|
1687
|
-
"Dark increased-contrast/color.background.
|
|
1688
|
-
"value": "#
|
|
1660
|
+
"Dark increased-contrast/color.background.discovery.subtler": {
|
|
1661
|
+
"value": "#48245D",
|
|
1689
1662
|
"attributes": {
|
|
1690
1663
|
"group": "paint",
|
|
1691
1664
|
"state": "active",
|
|
1692
|
-
"introduced": "
|
|
1693
|
-
"description": "Use for
|
|
1665
|
+
"introduced": "8.1.0",
|
|
1666
|
+
"description": "Use for backgrounds of discovery lozenges and badges to ensure accessibility and desired visual appearance."
|
|
1694
1667
|
}
|
|
1695
1668
|
},
|
|
1696
|
-
"Dark increased-contrast/color.background.
|
|
1697
|
-
"value": "#
|
|
1669
|
+
"Dark increased-contrast/color.background.discovery.subtler.hovered": {
|
|
1670
|
+
"value": "#673286",
|
|
1698
1671
|
"attributes": {
|
|
1699
1672
|
"group": "paint",
|
|
1700
1673
|
"state": "active",
|
|
1701
|
-
"introduced": "1.
|
|
1702
|
-
"description": "Hovered state of color.background.
|
|
1674
|
+
"introduced": "8.1.0",
|
|
1675
|
+
"description": "Hovered state of color.background.discovery.subtler"
|
|
1703
1676
|
}
|
|
1704
1677
|
},
|
|
1705
|
-
"Dark increased-contrast/color.background.
|
|
1706
|
-
"value": "#
|
|
1678
|
+
"Dark increased-contrast/color.background.discovery.subtler.pressed": {
|
|
1679
|
+
"value": "#803FA5",
|
|
1707
1680
|
"attributes": {
|
|
1708
1681
|
"group": "paint",
|
|
1709
1682
|
"state": "active",
|
|
1710
|
-
"introduced": "1.
|
|
1711
|
-
"description": "Pressed state of color.background.
|
|
1683
|
+
"introduced": "8.1.0",
|
|
1684
|
+
"description": "Pressed state of color.background.discovery.subtler"
|
|
1712
1685
|
}
|
|
1713
1686
|
},
|
|
1714
|
-
"Dark increased-contrast/color.background.
|
|
1715
|
-
"value": "#
|
|
1687
|
+
"Dark increased-contrast/color.background.discovery.subtle": {
|
|
1688
|
+
"value": "#803FA5",
|
|
1716
1689
|
"attributes": {
|
|
1717
1690
|
"group": "paint",
|
|
1718
1691
|
"state": "active",
|
|
1719
|
-
"introduced": "
|
|
1720
|
-
"description": "
|
|
1692
|
+
"introduced": "13.2.0",
|
|
1693
|
+
"description": "Background colour for non-interactive elements communicating discovery (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.discovery.bold or color.background.discovery.subtler for interactive states."
|
|
1721
1694
|
}
|
|
1722
1695
|
},
|
|
1723
|
-
"Dark increased-contrast/color.background.
|
|
1724
|
-
"value": "#
|
|
1696
|
+
"Dark increased-contrast/color.background.discovery.bold": {
|
|
1697
|
+
"value": "#EED7FC",
|
|
1725
1698
|
"attributes": {
|
|
1726
1699
|
"group": "paint",
|
|
1727
1700
|
"state": "active",
|
|
1728
|
-
"introduced": "
|
|
1729
|
-
"description": "
|
|
1701
|
+
"introduced": "0.6.0",
|
|
1702
|
+
"description": "A vibrant background option communicating change or something new, such as in onboarding spotlights."
|
|
1730
1703
|
}
|
|
1731
1704
|
},
|
|
1732
|
-
"Dark increased-contrast/color.background.
|
|
1733
|
-
"value": "#
|
|
1705
|
+
"Dark increased-contrast/color.background.discovery.bold.hovered": {
|
|
1706
|
+
"value": "#F8EEFE",
|
|
1734
1707
|
"attributes": {
|
|
1735
1708
|
"group": "paint",
|
|
1736
1709
|
"state": "active",
|
|
1737
|
-
"introduced": "
|
|
1738
|
-
"description": "
|
|
1710
|
+
"introduced": "0.6.0",
|
|
1711
|
+
"description": "Hovered state of color.background.discovery.bold"
|
|
1739
1712
|
}
|
|
1740
1713
|
},
|
|
1741
|
-
"Dark increased-contrast/color.background.
|
|
1742
|
-
"value": "#
|
|
1714
|
+
"Dark increased-contrast/color.background.discovery.bold.pressed": {
|
|
1715
|
+
"value": "#E2E3E4",
|
|
1743
1716
|
"attributes": {
|
|
1744
1717
|
"group": "paint",
|
|
1745
1718
|
"state": "active",
|
|
1746
|
-
"introduced": "0.
|
|
1747
|
-
"description": "
|
|
1719
|
+
"introduced": "0.6.0",
|
|
1720
|
+
"description": "Pressed state of color.background.discovery.bold"
|
|
1748
1721
|
}
|
|
1749
1722
|
},
|
|
1750
|
-
"Dark increased-contrast/color.background.
|
|
1751
|
-
"value": "#
|
|
1723
|
+
"Dark increased-contrast/color.background.information": {
|
|
1724
|
+
"value": "#1C2B42",
|
|
1752
1725
|
"attributes": {
|
|
1753
1726
|
"group": "paint",
|
|
1754
1727
|
"state": "active",
|
|
1755
|
-
"introduced": "
|
|
1756
|
-
"description": "
|
|
1728
|
+
"introduced": "0.6.0",
|
|
1729
|
+
"description": "Use for backgrounds communicating information or something in-progress, such as in information section messages."
|
|
1757
1730
|
}
|
|
1758
1731
|
},
|
|
1759
|
-
"Dark increased-contrast/color.background.
|
|
1760
|
-
"value": "#
|
|
1732
|
+
"Dark increased-contrast/color.background.information.hovered": {
|
|
1733
|
+
"value": "#123263",
|
|
1761
1734
|
"attributes": {
|
|
1762
1735
|
"group": "paint",
|
|
1763
1736
|
"state": "active",
|
|
1764
|
-
"introduced": "
|
|
1765
|
-
"description": "
|
|
1737
|
+
"introduced": "0.6.0",
|
|
1738
|
+
"description": "Hovered state of color.background.information"
|
|
1766
1739
|
}
|
|
1767
1740
|
},
|
|
1768
|
-
"Dark increased-contrast/color.background.
|
|
1769
|
-
"value": "#
|
|
1741
|
+
"Dark increased-contrast/color.background.information.pressed": {
|
|
1742
|
+
"value": "#144794",
|
|
1770
1743
|
"attributes": {
|
|
1771
1744
|
"group": "paint",
|
|
1772
1745
|
"state": "active",
|
|
1773
|
-
"introduced": "0.
|
|
1774
|
-
"description": "
|
|
1746
|
+
"introduced": "0.6.0",
|
|
1747
|
+
"description": "Pressed state of color.background.information"
|
|
1775
1748
|
}
|
|
1776
1749
|
},
|
|
1777
|
-
"Dark increased-contrast/color.background.
|
|
1778
|
-
"value": "#
|
|
1750
|
+
"Dark increased-contrast/color.background.information.subtler": {
|
|
1751
|
+
"value": "#123263",
|
|
1779
1752
|
"attributes": {
|
|
1780
1753
|
"group": "paint",
|
|
1781
1754
|
"state": "active",
|
|
1782
|
-
"introduced": "1.
|
|
1783
|
-
"description": "
|
|
1755
|
+
"introduced": "8.1.0",
|
|
1756
|
+
"description": "Use for backgrounds of information lozenges and badges to ensure accessibility and desired visual appearance."
|
|
1784
1757
|
}
|
|
1785
1758
|
},
|
|
1786
|
-
"Dark increased-contrast/color.background.
|
|
1787
|
-
"value": "#
|
|
1759
|
+
"Dark increased-contrast/color.background.information.subtler.hovered": {
|
|
1760
|
+
"value": "#144794",
|
|
1788
1761
|
"attributes": {
|
|
1789
1762
|
"group": "paint",
|
|
1790
1763
|
"state": "active",
|
|
1791
|
-
"introduced": "1.
|
|
1792
|
-
"description": "
|
|
1764
|
+
"introduced": "8.1.0",
|
|
1765
|
+
"description": "Hovered state of color.background.information.subtler"
|
|
1793
1766
|
}
|
|
1794
1767
|
},
|
|
1795
|
-
"Dark increased-contrast/color.background.
|
|
1796
|
-
"value": "#
|
|
1768
|
+
"Dark increased-contrast/color.background.information.subtler.pressed": {
|
|
1769
|
+
"value": "#1558BC",
|
|
1797
1770
|
"attributes": {
|
|
1798
1771
|
"group": "paint",
|
|
1799
1772
|
"state": "active",
|
|
1800
|
-
"introduced": "
|
|
1801
|
-
"description": "
|
|
1773
|
+
"introduced": "8.1.0",
|
|
1774
|
+
"description": "Pressed state of color.background.information.subtler"
|
|
1802
1775
|
}
|
|
1803
1776
|
},
|
|
1804
|
-
"Dark increased-contrast/color.background.
|
|
1805
|
-
"value": "#
|
|
1777
|
+
"Dark increased-contrast/color.background.information.subtle": {
|
|
1778
|
+
"value": "#1558BC",
|
|
1806
1779
|
"attributes": {
|
|
1807
1780
|
"group": "paint",
|
|
1808
1781
|
"state": "active",
|
|
1809
|
-
"introduced": "
|
|
1810
|
-
"description": "
|
|
1782
|
+
"introduced": "13.2.0",
|
|
1783
|
+
"description": "Background colour for non-interactive elements communicating information (e.g. semantic badges, status pills, callout chips). Sits between subtler and bold in visual emphasis. Not for interactive surfaces — see color.background.information.bold or color.background.information.subtler for interactive states."
|
|
1811
1784
|
}
|
|
1812
1785
|
},
|
|
1813
|
-
"Dark increased-contrast/color.background.
|
|
1814
|
-
"value": "#
|
|
1786
|
+
"Dark increased-contrast/color.background.information.bold": {
|
|
1787
|
+
"value": "#CFE1FD",
|
|
1815
1788
|
"attributes": {
|
|
1816
1789
|
"group": "paint",
|
|
1817
1790
|
"state": "active",
|
|
1818
|
-
"introduced": "
|
|
1819
|
-
"description": "
|
|
1791
|
+
"introduced": "0.6.0",
|
|
1792
|
+
"description": "A vibrant background option for communicating information or something in-progress."
|
|
1820
1793
|
}
|
|
1821
1794
|
},
|
|
1822
|
-
"Dark increased-contrast/color.background.
|
|
1823
|
-
"value": "#
|
|
1795
|
+
"Dark increased-contrast/color.background.information.bold.hovered": {
|
|
1796
|
+
"value": "#E9F2FE",
|
|
1824
1797
|
"attributes": {
|
|
1825
1798
|
"group": "paint",
|
|
1826
1799
|
"state": "active",
|
|
1827
|
-
"introduced": "0.
|
|
1828
|
-
"description": "
|
|
1800
|
+
"introduced": "0.6.0",
|
|
1801
|
+
"description": "Hovered state of color.background.information.bold"
|
|
1829
1802
|
}
|
|
1830
1803
|
},
|
|
1831
|
-
"Dark increased-contrast/color.background.
|
|
1832
|
-
"value": "#
|
|
1804
|
+
"Dark increased-contrast/color.background.information.bold.pressed": {
|
|
1805
|
+
"value": "#E2E3E4",
|
|
1833
1806
|
"attributes": {
|
|
1834
1807
|
"group": "paint",
|
|
1835
1808
|
"state": "active",
|
|
1836
|
-
"introduced": "
|
|
1837
|
-
"description": "
|
|
1809
|
+
"introduced": "0.6.0",
|
|
1810
|
+
"description": "Pressed state of color.background.information.bold"
|
|
1838
1811
|
}
|
|
1839
1812
|
},
|
|
1840
|
-
"Dark increased-contrast/color.
|
|
1841
|
-
"value": "#
|
|
1813
|
+
"Dark increased-contrast/color.border": {
|
|
1814
|
+
"value": "#E9F0FB5C",
|
|
1842
1815
|
"attributes": {
|
|
1843
1816
|
"group": "paint",
|
|
1844
1817
|
"state": "active",
|
|
1845
|
-
"introduced": "
|
|
1846
|
-
"description": "
|
|
1818
|
+
"introduced": "0.6.0",
|
|
1819
|
+
"description": "Use to visually group or separate UI elements, such as flat cards or side panel dividers."
|
|
1847
1820
|
}
|
|
1848
1821
|
},
|
|
1849
|
-
"Dark increased-contrast/color.
|
|
1850
|
-
"value": "#
|
|
1822
|
+
"Dark increased-contrast/color.border.accent.lime": {
|
|
1823
|
+
"value": "#B3DF72",
|
|
1851
1824
|
"attributes": {
|
|
1852
1825
|
"group": "paint",
|
|
1853
1826
|
"state": "active",
|
|
1854
|
-
"introduced": "
|
|
1855
|
-
"description": "Use for
|
|
1827
|
+
"introduced": "1.6.0",
|
|
1828
|
+
"description": "Use for lime borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1856
1829
|
}
|
|
1857
1830
|
},
|
|
1858
|
-
"Dark increased-contrast/color.
|
|
1859
|
-
"value": "#
|
|
1831
|
+
"Dark increased-contrast/color.border.accent.lime.subtle": {
|
|
1832
|
+
"value": "#4C6B1F",
|
|
1860
1833
|
"attributes": {
|
|
1861
1834
|
"group": "paint",
|
|
1862
1835
|
"state": "active",
|
|
1863
|
-
"introduced": "
|
|
1864
|
-
"description": "
|
|
1836
|
+
"introduced": "13.2.0",
|
|
1837
|
+
"description": "Use for decorative lime borders that do not need to meet 3:1 contrast requirements."
|
|
1865
1838
|
}
|
|
1866
1839
|
},
|
|
1867
|
-
"Dark increased-contrast/color.
|
|
1868
|
-
"value": "#
|
|
1840
|
+
"Dark increased-contrast/color.border.accent.red": {
|
|
1841
|
+
"value": "#FD9891",
|
|
1869
1842
|
"attributes": {
|
|
1870
1843
|
"group": "paint",
|
|
1871
1844
|
"state": "active",
|
|
1872
|
-
"introduced": "
|
|
1873
|
-
"description": "
|
|
1845
|
+
"introduced": "0.6.0",
|
|
1846
|
+
"description": "Use for red borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1874
1847
|
}
|
|
1875
1848
|
},
|
|
1876
|
-
"Dark increased-contrast/color.
|
|
1877
|
-
"value": "#
|
|
1849
|
+
"Dark increased-contrast/color.border.accent.red.subtle": {
|
|
1850
|
+
"value": "#AE2E24",
|
|
1878
1851
|
"attributes": {
|
|
1879
1852
|
"group": "paint",
|
|
1880
1853
|
"state": "active",
|
|
1881
|
-
"introduced": "
|
|
1882
|
-
"description": "Use for
|
|
1854
|
+
"introduced": "13.2.0",
|
|
1855
|
+
"description": "Use for decorative red borders that do not need to meet 3:1 contrast requirements."
|
|
1883
1856
|
}
|
|
1884
1857
|
},
|
|
1885
|
-
"Dark increased-contrast/color.
|
|
1886
|
-
"value": "#
|
|
1858
|
+
"Dark increased-contrast/color.border.accent.orange": {
|
|
1859
|
+
"value": "#FBC828",
|
|
1887
1860
|
"attributes": {
|
|
1888
1861
|
"group": "paint",
|
|
1889
1862
|
"state": "active",
|
|
1890
|
-
"introduced": "
|
|
1891
|
-
"description": "
|
|
1863
|
+
"introduced": "0.6.0",
|
|
1864
|
+
"description": "Use for orange borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1892
1865
|
}
|
|
1893
1866
|
},
|
|
1894
|
-
"Dark increased-contrast/color.
|
|
1895
|
-
"value": "#
|
|
1867
|
+
"Dark increased-contrast/color.border.accent.orange.subtle": {
|
|
1868
|
+
"value": "#9E4C00",
|
|
1896
1869
|
"attributes": {
|
|
1897
1870
|
"group": "paint",
|
|
1898
1871
|
"state": "active",
|
|
1899
|
-
"introduced": "
|
|
1900
|
-
"description": "
|
|
1872
|
+
"introduced": "13.2.0",
|
|
1873
|
+
"description": "Use for decorative orange borders that do not need to meet 3:1 contrast requirements."
|
|
1901
1874
|
}
|
|
1902
1875
|
},
|
|
1903
|
-
"Dark increased-contrast/color.
|
|
1904
|
-
"value": "#
|
|
1876
|
+
"Dark increased-contrast/color.border.accent.yellow": {
|
|
1877
|
+
"value": "#EED12B",
|
|
1905
1878
|
"attributes": {
|
|
1906
1879
|
"group": "paint",
|
|
1907
1880
|
"state": "active",
|
|
1908
|
-
"introduced": "0.
|
|
1909
|
-
"description": "Use for
|
|
1881
|
+
"introduced": "0.6.0",
|
|
1882
|
+
"description": "Use for yellow borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1910
1883
|
}
|
|
1911
1884
|
},
|
|
1912
|
-
"Dark increased-contrast/color.
|
|
1913
|
-
"value": "#
|
|
1885
|
+
"Dark increased-contrast/color.border.accent.yellow.subtle": {
|
|
1886
|
+
"value": "#7F5F01",
|
|
1914
1887
|
"attributes": {
|
|
1915
1888
|
"group": "paint",
|
|
1916
1889
|
"state": "active",
|
|
1917
|
-
"introduced": "
|
|
1918
|
-
"description": "
|
|
1890
|
+
"introduced": "13.2.0",
|
|
1891
|
+
"description": "Use for decorative yellow borders that do not need to meet 3:1 contrast requirements."
|
|
1919
1892
|
}
|
|
1920
1893
|
},
|
|
1921
|
-
"Dark increased-contrast/color.
|
|
1922
|
-
"value": "#
|
|
1894
|
+
"Dark increased-contrast/color.border.accent.green": {
|
|
1895
|
+
"value": "#7EE2B8",
|
|
1923
1896
|
"attributes": {
|
|
1924
1897
|
"group": "paint",
|
|
1925
1898
|
"state": "active",
|
|
1926
|
-
"introduced": "
|
|
1927
|
-
"description": "
|
|
1899
|
+
"introduced": "0.6.0",
|
|
1900
|
+
"description": "Use for green borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1928
1901
|
}
|
|
1929
1902
|
},
|
|
1930
|
-
"Dark increased-contrast/color.
|
|
1931
|
-
"value": "#
|
|
1903
|
+
"Dark increased-contrast/color.border.accent.green.subtle": {
|
|
1904
|
+
"value": "#216E4E",
|
|
1932
1905
|
"attributes": {
|
|
1933
1906
|
"group": "paint",
|
|
1934
1907
|
"state": "active",
|
|
1935
|
-
"introduced": "
|
|
1936
|
-
"description": "Use for
|
|
1908
|
+
"introduced": "13.2.0",
|
|
1909
|
+
"description": "Use for decorative green borders that do not need to meet 3:1 contrast requirements."
|
|
1937
1910
|
}
|
|
1938
1911
|
},
|
|
1939
|
-
"Dark increased-contrast/color.
|
|
1940
|
-
"value": "#
|
|
1912
|
+
"Dark increased-contrast/color.border.accent.teal": {
|
|
1913
|
+
"value": "#9DD9EE",
|
|
1941
1914
|
"attributes": {
|
|
1942
1915
|
"group": "paint",
|
|
1943
1916
|
"state": "active",
|
|
1944
|
-
"introduced": "
|
|
1945
|
-
"description": "
|
|
1917
|
+
"introduced": "0.6.0",
|
|
1918
|
+
"description": "Use for teal borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1946
1919
|
}
|
|
1947
1920
|
},
|
|
1948
|
-
"Dark increased-contrast/color.
|
|
1949
|
-
"value": "#
|
|
1921
|
+
"Dark increased-contrast/color.border.accent.teal.subtle": {
|
|
1922
|
+
"value": "#206A83",
|
|
1950
1923
|
"attributes": {
|
|
1951
1924
|
"group": "paint",
|
|
1952
1925
|
"state": "active",
|
|
1953
|
-
"introduced": "
|
|
1954
|
-
"description": "
|
|
1926
|
+
"introduced": "13.2.0",
|
|
1927
|
+
"description": "Use for decorative teal borders that do not need to meet 3:1 contrast requirements."
|
|
1955
1928
|
}
|
|
1956
1929
|
},
|
|
1957
|
-
"Dark increased-contrast/color.
|
|
1958
|
-
"value": "#
|
|
1930
|
+
"Dark increased-contrast/color.border.accent.blue": {
|
|
1931
|
+
"value": "#8FB8F6",
|
|
1959
1932
|
"attributes": {
|
|
1960
1933
|
"group": "paint",
|
|
1961
1934
|
"state": "active",
|
|
1962
|
-
"introduced": "0.
|
|
1963
|
-
"description": "Use for
|
|
1935
|
+
"introduced": "0.6.0",
|
|
1936
|
+
"description": "Use for blue borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1964
1937
|
}
|
|
1965
1938
|
},
|
|
1966
|
-
"Dark increased-contrast/color.
|
|
1967
|
-
"value": "#
|
|
1939
|
+
"Dark increased-contrast/color.border.accent.blue.subtle": {
|
|
1940
|
+
"value": "#1558BC",
|
|
1968
1941
|
"attributes": {
|
|
1969
1942
|
"group": "paint",
|
|
1970
1943
|
"state": "active",
|
|
1971
|
-
"introduced": "
|
|
1972
|
-
"description": "
|
|
1944
|
+
"introduced": "13.2.0",
|
|
1945
|
+
"description": "Use for decorative blue borders that do not need to meet 3:1 contrast requirements."
|
|
1973
1946
|
}
|
|
1974
1947
|
},
|
|
1975
|
-
"Dark increased-contrast/color.
|
|
1976
|
-
"value": "#
|
|
1948
|
+
"Dark increased-contrast/color.border.accent.purple": {
|
|
1949
|
+
"value": "#D8A0F7",
|
|
1977
1950
|
"attributes": {
|
|
1978
1951
|
"group": "paint",
|
|
1979
1952
|
"state": "active",
|
|
1980
|
-
"introduced": "
|
|
1981
|
-
"description": "
|
|
1953
|
+
"introduced": "0.6.0",
|
|
1954
|
+
"description": "Use for purple borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
1982
1955
|
}
|
|
1983
1956
|
},
|
|
1984
|
-
"Dark increased-contrast/color.
|
|
1985
|
-
"value": "#
|
|
1957
|
+
"Dark increased-contrast/color.border.accent.purple.subtle": {
|
|
1958
|
+
"value": "#803FA5",
|
|
1986
1959
|
"attributes": {
|
|
1987
1960
|
"group": "paint",
|
|
1988
1961
|
"state": "active",
|
|
1989
|
-
"introduced": "
|
|
1990
|
-
"description": "Use for
|
|
1962
|
+
"introduced": "13.2.0",
|
|
1963
|
+
"description": "Use for decorative purple borders that do not need to meet 3:1 contrast requirements."
|
|
1991
1964
|
}
|
|
1992
1965
|
},
|
|
1993
|
-
"Dark increased-contrast/color.
|
|
1994
|
-
"value": "#
|
|
1966
|
+
"Dark increased-contrast/color.border.accent.magenta": {
|
|
1967
|
+
"value": "#F797D2",
|
|
1995
1968
|
"attributes": {
|
|
1996
1969
|
"group": "paint",
|
|
1997
1970
|
"state": "active",
|
|
1998
|
-
"introduced": "
|
|
1999
|
-
"description": "
|
|
1971
|
+
"introduced": "0.6.0",
|
|
1972
|
+
"description": "Use for magenta borders on non-bold backgrounds when there is no meaning tied to the color."
|
|
2000
1973
|
}
|
|
2001
1974
|
},
|
|
2002
|
-
"Dark increased-contrast/color.
|
|
2003
|
-
"value": "#
|
|
1975
|
+
"Dark increased-contrast/color.border.accent.magenta.subtle": {
|
|
1976
|
+
"value": "#943D73",
|
|
2004
1977
|
"attributes": {
|
|
2005
1978
|
"group": "paint",
|
|
2006
1979
|
"state": "active",
|
|
2007
|
-
"introduced": "
|
|
2008
|
-
"description": "
|
|
1980
|
+
"introduced": "13.2.0",
|
|
1981
|
+
"description": "Use for decorative magenta borders that do not need to meet 3:1 contrast requirements."
|
|
2009
1982
|
}
|
|
2010
1983
|
},
|
|
2011
|
-
"Dark increased-contrast/color.
|
|
2012
|
-
"value": "#
|
|
1984
|
+
"Dark increased-contrast/color.border.accent.gray": {
|
|
1985
|
+
"value": "#A9ABAF",
|
|
2013
1986
|
"attributes": {
|
|
2014
1987
|
"group": "paint",
|
|
2015
1988
|
"state": "active",
|
|
2016
|
-
"introduced": "0.
|
|
2017
|
-
"description": "Use for
|
|
1989
|
+
"introduced": "0.10.5",
|
|
1990
|
+
"description": "Use for borders on non-bold gray accent backgrounds."
|
|
2018
1991
|
}
|
|
2019
1992
|
},
|
|
2020
|
-
"Dark increased-contrast/color.
|
|
2021
|
-
"value": "#
|
|
1993
|
+
"Dark increased-contrast/color.border.accent.gray.subtle": {
|
|
1994
|
+
"value": "#4B4D51",
|
|
2022
1995
|
"attributes": {
|
|
2023
1996
|
"group": "paint",
|
|
2024
1997
|
"state": "active",
|
|
2025
|
-
"introduced": "
|
|
2026
|
-
"description": "Use for
|
|
1998
|
+
"introduced": "13.2.0",
|
|
1999
|
+
"description": "Use for decorative gray borders that do not need to meet 3:1 contrast requirements."
|
|
2027
2000
|
}
|
|
2028
2001
|
},
|
|
2029
|
-
"Dark increased-contrast/color.
|
|
2030
|
-
"value": "#
|
|
2002
|
+
"Dark increased-contrast/color.border.disabled": {
|
|
2003
|
+
"value": "#E3E4F21F",
|
|
2031
2004
|
"attributes": {
|
|
2032
2005
|
"group": "paint",
|
|
2033
2006
|
"state": "active",
|
|
2034
2007
|
"introduced": "0.6.0",
|
|
2035
|
-
"description": "
|
|
2008
|
+
"description": "Use for borders of elements in a disabled state."
|
|
2036
2009
|
}
|
|
2037
2010
|
},
|
|
2038
|
-
"Dark increased-contrast/color.
|
|
2039
|
-
"value": "#
|
|
2011
|
+
"Dark increased-contrast/color.border.focused": {
|
|
2012
|
+
"value": "#8FB8F6",
|
|
2040
2013
|
"attributes": {
|
|
2041
2014
|
"group": "paint",
|
|
2042
2015
|
"state": "active",
|
|
2043
2016
|
"introduced": "0.6.0",
|
|
2044
|
-
"description": "
|
|
2017
|
+
"description": "Use for focus rings of elements in a focus state."
|
|
2045
2018
|
}
|
|
2046
2019
|
},
|
|
2047
|
-
"Dark increased-contrast/color.
|
|
2048
|
-
"value": "#
|
|
2020
|
+
"Dark increased-contrast/color.border.input": {
|
|
2021
|
+
"value": "#A9ABAF",
|
|
2049
2022
|
"attributes": {
|
|
2050
2023
|
"group": "paint",
|
|
2051
2024
|
"state": "active",
|
|
2052
|
-
"introduced": "0.
|
|
2053
|
-
"description": "Use for
|
|
2025
|
+
"introduced": "0.6.0",
|
|
2026
|
+
"description": "Use for borders of form UI elements, such as text fields, checkboxes, and radio buttons."
|
|
2054
2027
|
}
|
|
2055
2028
|
},
|
|
2056
|
-
"Dark increased-contrast/color.
|
|
2057
|
-
"value": "#
|
|
2029
|
+
"Dark increased-contrast/color.border.inverse": {
|
|
2030
|
+
"value": "#18191A",
|
|
2058
2031
|
"attributes": {
|
|
2059
2032
|
"group": "paint",
|
|
2060
2033
|
"state": "active",
|
|
2061
|
-
"introduced": "0.
|
|
2062
|
-
"description": "Use for
|
|
2034
|
+
"introduced": "0.6.0",
|
|
2035
|
+
"description": "Use for borders on bold backgrounds."
|
|
2063
2036
|
}
|
|
2064
2037
|
},
|
|
2065
|
-
"Dark increased-contrast/color.
|
|
2066
|
-
"value": "#
|
|
2038
|
+
"Dark increased-contrast/color.border.selected": {
|
|
2039
|
+
"value": "#8FB8F6",
|
|
2067
2040
|
"attributes": {
|
|
2068
2041
|
"group": "paint",
|
|
2069
2042
|
"state": "active",
|
|
2070
|
-
"introduced": "0.
|
|
2071
|
-
"description": "Use for
|
|
2043
|
+
"introduced": "0.6.2",
|
|
2044
|
+
"description": "Use for borders or visual indicators of elements in a selected or opened state, such as in tabs or menu items."
|
|
2072
2045
|
}
|
|
2073
2046
|
},
|
|
2074
|
-
"Dark increased-contrast/color.
|
|
2075
|
-
"value": "#
|
|
2047
|
+
"Dark increased-contrast/color.border.brand": {
|
|
2048
|
+
"value": "#8FB8F6",
|
|
2076
2049
|
"attributes": {
|
|
2077
2050
|
"group": "paint",
|
|
2078
2051
|
"state": "active",
|
|
2079
2052
|
"introduced": "0.6.0",
|
|
2080
|
-
"description": "
|
|
2053
|
+
"description": "Use for borders or visual indicators of elements that reinforce our brand, such as logos or primary buttons."
|
|
2081
2054
|
}
|
|
2082
2055
|
},
|
|
2083
|
-
"Dark increased-contrast/color.
|
|
2084
|
-
"value": "#
|
|
2056
|
+
"Dark increased-contrast/color.border.danger": {
|
|
2057
|
+
"value": "#F87168",
|
|
2085
2058
|
"attributes": {
|
|
2086
2059
|
"group": "paint",
|
|
2087
2060
|
"state": "active",
|
|
2088
2061
|
"introduced": "0.6.0",
|
|
2089
|
-
"description": "
|
|
2062
|
+
"description": "Use for borders communicating critical information, such as the borders on invalid text fields."
|
|
2090
2063
|
}
|
|
2091
2064
|
},
|
|
2092
|
-
"Dark increased-contrast/color.
|
|
2093
|
-
"value": "#
|
|
2065
|
+
"Dark increased-contrast/color.border.danger.subtle": {
|
|
2066
|
+
"value": "#AE2E24",
|
|
2094
2067
|
"attributes": {
|
|
2095
2068
|
"group": "paint",
|
|
2096
2069
|
"state": "active",
|
|
2097
|
-
"introduced": "
|
|
2098
|
-
"description": "
|
|
2070
|
+
"introduced": "13.2.0",
|
|
2071
|
+
"description": "Use for decorative danger borders that do not need to meet 3:1 contrast requirements."
|
|
2099
2072
|
}
|
|
2100
2073
|
},
|
|
2101
|
-
"Dark increased-contrast/color.
|
|
2102
|
-
"value": "#
|
|
2074
|
+
"Dark increased-contrast/color.border.warning": {
|
|
2075
|
+
"value": "#FBC828",
|
|
2103
2076
|
"attributes": {
|
|
2104
2077
|
"group": "paint",
|
|
2105
2078
|
"state": "active",
|
|
2106
2079
|
"introduced": "0.6.0",
|
|
2107
|
-
"description": "Use for
|
|
2080
|
+
"description": "Use for borders communicating caution."
|
|
2108
2081
|
}
|
|
2109
2082
|
},
|
|
2110
|
-
"Dark increased-contrast/color.
|
|
2111
|
-
"value": "#
|
|
2083
|
+
"Dark increased-contrast/color.border.warning.subtle": {
|
|
2084
|
+
"value": "#9E4C00",
|
|
2112
2085
|
"attributes": {
|
|
2113
2086
|
"group": "paint",
|
|
2114
2087
|
"state": "active",
|
|
2115
|
-
"introduced": "
|
|
2116
|
-
"description": "
|
|
2088
|
+
"introduced": "13.2.0",
|
|
2089
|
+
"description": "Use for decorative warning borders that do not need to meet 3:1 contrast requirements."
|
|
2117
2090
|
}
|
|
2118
2091
|
},
|
|
2119
|
-
"Dark increased-contrast/color.
|
|
2120
|
-
"value": "#
|
|
2092
|
+
"Dark increased-contrast/color.border.success": {
|
|
2093
|
+
"value": "#7EE2B8",
|
|
2121
2094
|
"attributes": {
|
|
2122
2095
|
"group": "paint",
|
|
2123
2096
|
"state": "active",
|
|
2124
2097
|
"introduced": "0.6.0",
|
|
2125
|
-
"description": "
|
|
2098
|
+
"description": "Use for borders communicating a favorable outcome, such as the borders on validated text fields."
|
|
2126
2099
|
}
|
|
2127
2100
|
},
|
|
2128
|
-
"Dark increased-contrast/color.
|
|
2129
|
-
"value": "#
|
|
2101
|
+
"Dark increased-contrast/color.border.success.subtle": {
|
|
2102
|
+
"value": "#4C6B1F",
|
|
2130
2103
|
"attributes": {
|
|
2131
2104
|
"group": "paint",
|
|
2132
2105
|
"state": "active",
|
|
2133
|
-
"introduced": "
|
|
2134
|
-
"description": "
|
|
2106
|
+
"introduced": "13.2.0",
|
|
2107
|
+
"description": "Use for decorative success borders that do not need to meet 3:1 contrast requirements."
|
|
2135
2108
|
}
|
|
2136
2109
|
},
|
|
2137
|
-
"Dark increased-contrast/color.
|
|
2138
|
-
"value": "#
|
|
2110
|
+
"Dark increased-contrast/color.border.discovery": {
|
|
2111
|
+
"value": "#C97CF4",
|
|
2139
2112
|
"attributes": {
|
|
2140
2113
|
"group": "paint",
|
|
2141
2114
|
"state": "active",
|
|
2142
2115
|
"introduced": "0.6.0",
|
|
2143
|
-
"description": "
|
|
2116
|
+
"description": "Use for borders communicating change or something new, such as the borders in onboarding spotlights."
|
|
2144
2117
|
}
|
|
2145
2118
|
},
|
|
2146
|
-
"Dark increased-contrast/color.
|
|
2147
|
-
"value": "#
|
|
2119
|
+
"Dark increased-contrast/color.border.discovery.subtle": {
|
|
2120
|
+
"value": "#803FA5",
|
|
2148
2121
|
"attributes": {
|
|
2149
2122
|
"group": "paint",
|
|
2150
2123
|
"state": "active",
|
|
2151
|
-
"introduced": "
|
|
2152
|
-
"description": "
|
|
2124
|
+
"introduced": "13.2.0",
|
|
2125
|
+
"description": "Use for decorative discovery borders that do not need to meet 3:1 contrast requirements."
|
|
2153
2126
|
}
|
|
2154
2127
|
},
|
|
2155
|
-
"Dark increased-contrast/color.
|
|
2156
|
-
"value": "#
|
|
2128
|
+
"Dark increased-contrast/color.border.information": {
|
|
2129
|
+
"value": "#8FB8F6",
|
|
2157
2130
|
"attributes": {
|
|
2158
2131
|
"group": "paint",
|
|
2159
2132
|
"state": "active",
|
|
2160
|
-
"introduced": "0.6.
|
|
2161
|
-
"description": "Use for
|
|
2133
|
+
"introduced": "0.6.0",
|
|
2134
|
+
"description": "Use for borders communicating information or something in-progress."
|
|
2162
2135
|
}
|
|
2163
2136
|
},
|
|
2164
|
-
"Dark increased-contrast/color.
|
|
2165
|
-
"value": "#
|
|
2137
|
+
"Dark increased-contrast/color.border.information.subtle": {
|
|
2138
|
+
"value": "#1558BC",
|
|
2166
2139
|
"attributes": {
|
|
2167
2140
|
"group": "paint",
|
|
2168
2141
|
"state": "active",
|
|
2169
|
-
"introduced": "
|
|
2170
|
-
"description": "
|
|
2142
|
+
"introduced": "13.2.0",
|
|
2143
|
+
"description": "Use for decorative information borders that do not need to meet 3:1 contrast requirements."
|
|
2171
2144
|
}
|
|
2172
2145
|
},
|
|
2173
|
-
"Dark increased-contrast/color.
|
|
2174
|
-
"value": "#
|
|
2146
|
+
"Dark increased-contrast/color.border.bold": {
|
|
2147
|
+
"value": "#A9ABAF",
|
|
2175
2148
|
"attributes": {
|
|
2176
2149
|
"group": "paint",
|
|
2177
2150
|
"state": "active",
|
|
2178
|
-
"introduced": "0.
|
|
2179
|
-
"description": "
|
|
2151
|
+
"introduced": "0.10.8",
|
|
2152
|
+
"description": "A neutral border option that passes min 3:1 contrast ratios."
|
|
2180
2153
|
}
|
|
2181
2154
|
},
|
|
2182
|
-
"Dark increased-contrast/color.
|
|
2183
|
-
"value": "#
|
|
2155
|
+
"Dark increased-contrast/color.text": {
|
|
2156
|
+
"value": "#E2E3E4",
|
|
2184
2157
|
"attributes": {
|
|
2185
2158
|
"group": "paint",
|
|
2186
2159
|
"state": "active",
|
|
2187
|
-
"introduced": "0.6.
|
|
2188
|
-
"description": "Use for
|
|
2160
|
+
"introduced": "0.6.0",
|
|
2161
|
+
"description": "Use for primary text, such as body copy, sentence case headers, and buttons."
|
|
2189
2162
|
}
|
|
2190
2163
|
},
|
|
2191
|
-
"Dark increased-contrast/color.
|
|
2192
|
-
"value": "#
|
|
2164
|
+
"Dark increased-contrast/color.text.accent.lime": {
|
|
2165
|
+
"value": "#D3F1A7",
|
|
2193
2166
|
"attributes": {
|
|
2194
2167
|
"group": "paint",
|
|
2195
2168
|
"state": "active",
|
|
2196
|
-
"introduced": "
|
|
2197
|
-
"description": "
|
|
2169
|
+
"introduced": "1.8.0",
|
|
2170
|
+
"description": "Use for lime text on subtlest and subtler lime accent backgrounds when there is no meaning tied to the color."
|
|
2198
2171
|
}
|
|
2199
2172
|
},
|
|
2200
|
-
"Dark increased-contrast/color.
|
|
2201
|
-
"value": "#
|
|
2173
|
+
"Dark increased-contrast/color.text.accent.lime.bolder": {
|
|
2174
|
+
"value": "#EFFFD6",
|
|
2202
2175
|
"attributes": {
|
|
2203
2176
|
"group": "paint",
|
|
2204
2177
|
"state": "active",
|
|
2205
|
-
"introduced": "
|
|
2206
|
-
"description": "
|
|
2178
|
+
"introduced": "1.8.0",
|
|
2179
|
+
"description": "Use for lime text on subtle lime accent backgrounds when there is no meaning tied to the color."
|
|
2207
2180
|
}
|
|
2208
2181
|
},
|
|
2209
|
-
"Dark increased-contrast/color.
|
|
2210
|
-
"value": "#
|
|
2182
|
+
"Dark increased-contrast/color.text.accent.red": {
|
|
2183
|
+
"value": "#FFD5D2",
|
|
2211
2184
|
"attributes": {
|
|
2212
2185
|
"group": "paint",
|
|
2213
2186
|
"state": "active",
|
|
2214
|
-
"introduced": "
|
|
2215
|
-
"description": "Use for
|
|
2187
|
+
"introduced": "0.6.0",
|
|
2188
|
+
"description": "Use for red text on subtlest and subtler red accent backgrounds when there is no meaning tied to the color."
|
|
2216
2189
|
}
|
|
2217
2190
|
},
|
|
2218
|
-
"Dark increased-contrast/color.
|
|
2219
|
-
"value": "#
|
|
2191
|
+
"Dark increased-contrast/color.text.accent.red.bolder": {
|
|
2192
|
+
"value": "#FFECEB",
|
|
2220
2193
|
"attributes": {
|
|
2221
2194
|
"group": "paint",
|
|
2222
2195
|
"state": "active",
|
|
2223
|
-
"introduced": "
|
|
2224
|
-
"description": "
|
|
2196
|
+
"introduced": "0.7.0",
|
|
2197
|
+
"description": "Use for red text on subtle red accent backgrounds when there is no meaning tied to the color."
|
|
2225
2198
|
}
|
|
2226
2199
|
},
|
|
2227
|
-
"Dark increased-contrast/color.
|
|
2228
|
-
"value": "#
|
|
2200
|
+
"Dark increased-contrast/color.text.accent.orange": {
|
|
2201
|
+
"value": "#FCE4A6",
|
|
2229
2202
|
"attributes": {
|
|
2230
2203
|
"group": "paint",
|
|
2231
2204
|
"state": "active",
|
|
2232
|
-
"introduced": "
|
|
2233
|
-
"description": "
|
|
2205
|
+
"introduced": "0.6.0",
|
|
2206
|
+
"description": "Use for orange text on subtlest and subtler orange accent backgrounds when there is no meaning tied to the color."
|
|
2234
2207
|
}
|
|
2235
2208
|
},
|
|
2236
|
-
"Dark increased-contrast/color.
|
|
2237
|
-
"value": "#
|
|
2209
|
+
"Dark increased-contrast/color.text.accent.orange.bolder": {
|
|
2210
|
+
"value": "#FFF5DB",
|
|
2238
2211
|
"attributes": {
|
|
2239
2212
|
"group": "paint",
|
|
2240
2213
|
"state": "active",
|
|
2241
|
-
"introduced": "0.
|
|
2242
|
-
"description": "Use for
|
|
2214
|
+
"introduced": "0.7.0",
|
|
2215
|
+
"description": "Use for orange text on subtle orange accent backgrounds when there is no meaning tied to the color."
|
|
2243
2216
|
}
|
|
2244
2217
|
},
|
|
2245
|
-
"Dark increased-contrast/color.
|
|
2246
|
-
"value": "#
|
|
2218
|
+
"Dark increased-contrast/color.text.accent.yellow": {
|
|
2219
|
+
"value": "#F5E989",
|
|
2247
2220
|
"attributes": {
|
|
2248
2221
|
"group": "paint",
|
|
2249
2222
|
"state": "active",
|
|
2250
2223
|
"introduced": "0.6.0",
|
|
2251
|
-
"description": "
|
|
2224
|
+
"description": "Use for yellow text on subtlest and subtler yellow accent backgrounds when there is no meaning tied to the color."
|
|
2252
2225
|
}
|
|
2253
2226
|
},
|
|
2254
|
-
"Dark increased-contrast/color.
|
|
2255
|
-
"value": "#
|
|
2227
|
+
"Dark increased-contrast/color.text.accent.yellow.bolder": {
|
|
2228
|
+
"value": "#FEF7C8",
|
|
2256
2229
|
"attributes": {
|
|
2257
2230
|
"group": "paint",
|
|
2258
2231
|
"state": "active",
|
|
2259
|
-
"introduced": "0.
|
|
2260
|
-
"description": "
|
|
2232
|
+
"introduced": "0.7.0",
|
|
2233
|
+
"description": "Use for yellow text on subtle yellow accent backgrounds when there is no meaning tied to the color."
|
|
2261
2234
|
}
|
|
2262
2235
|
},
|
|
2263
|
-
"Dark increased-contrast/color.
|
|
2264
|
-
"value": "#
|
|
2236
|
+
"Dark increased-contrast/color.text.accent.green": {
|
|
2237
|
+
"value": "#BAF3DB",
|
|
2265
2238
|
"attributes": {
|
|
2266
2239
|
"group": "paint",
|
|
2267
2240
|
"state": "active",
|
|
2268
|
-
"introduced": "
|
|
2269
|
-
"description": "Use for
|
|
2241
|
+
"introduced": "0.6.0",
|
|
2242
|
+
"description": "Use for green text on subtlest and subtler green accent backgrounds when there is no meaning tied to the color."
|
|
2270
2243
|
}
|
|
2271
2244
|
},
|
|
2272
|
-
"Dark increased-contrast/color.
|
|
2273
|
-
"value": "#
|
|
2245
|
+
"Dark increased-contrast/color.text.accent.green.bolder": {
|
|
2246
|
+
"value": "#DCFFF1",
|
|
2274
2247
|
"attributes": {
|
|
2275
2248
|
"group": "paint",
|
|
2276
2249
|
"state": "active",
|
|
2277
|
-
"introduced": "
|
|
2278
|
-
"description": "
|
|
2250
|
+
"introduced": "0.7.0",
|
|
2251
|
+
"description": "Use for green text on subtle green accent backgrounds when there is no meaning tied to the color."
|
|
2279
2252
|
}
|
|
2280
2253
|
},
|
|
2281
|
-
"Dark increased-contrast/color.
|
|
2282
|
-
"value": "#
|
|
2254
|
+
"Dark increased-contrast/color.text.accent.teal": {
|
|
2255
|
+
"value": "#C6EDFB",
|
|
2283
2256
|
"attributes": {
|
|
2284
2257
|
"group": "paint",
|
|
2285
2258
|
"state": "active",
|
|
2286
|
-
"introduced": "
|
|
2287
|
-
"description": "
|
|
2259
|
+
"introduced": "0.6.0",
|
|
2260
|
+
"description": "Use for teal text on subtlest and subtler teal accent backgrounds when there is no meaning tied to the color."
|
|
2288
2261
|
}
|
|
2289
2262
|
},
|
|
2290
|
-
"Dark increased-contrast/color.
|
|
2291
|
-
"value": "#
|
|
2263
|
+
"Dark increased-contrast/color.text.accent.teal.bolder": {
|
|
2264
|
+
"value": "#E7F9FF",
|
|
2292
2265
|
"attributes": {
|
|
2293
2266
|
"group": "paint",
|
|
2294
2267
|
"state": "active",
|
|
2295
|
-
"introduced": "0.
|
|
2296
|
-
"description": "Use for backgrounds
|
|
2268
|
+
"introduced": "0.7.0",
|
|
2269
|
+
"description": "Use for teal text on subtle teal accent backgrounds when there is no meaning tied to the color."
|
|
2297
2270
|
}
|
|
2298
2271
|
},
|
|
2299
|
-
"Dark increased-contrast/color.
|
|
2300
|
-
"value": "#
|
|
2272
|
+
"Dark increased-contrast/color.text.accent.blue": {
|
|
2273
|
+
"value": "#CFE1FD",
|
|
2301
2274
|
"attributes": {
|
|
2302
2275
|
"group": "paint",
|
|
2303
2276
|
"state": "active",
|
|
2304
2277
|
"introduced": "0.6.0",
|
|
2305
|
-
"description": "
|
|
2278
|
+
"description": "Use for blue text on subtlest and subtler blue accent backgrounds when there is no meaning tied to the color."
|
|
2306
2279
|
}
|
|
2307
2280
|
},
|
|
2308
|
-
"Dark increased-contrast/color.
|
|
2309
|
-
"value": "#
|
|
2281
|
+
"Dark increased-contrast/color.text.accent.blue.bolder": {
|
|
2282
|
+
"value": "#E9F2FE",
|
|
2310
2283
|
"attributes": {
|
|
2311
2284
|
"group": "paint",
|
|
2312
2285
|
"state": "active",
|
|
2313
|
-
"introduced": "0.
|
|
2314
|
-
"description": "
|
|
2286
|
+
"introduced": "0.7.0",
|
|
2287
|
+
"description": "Use for blue text on subtle blue accent backgrounds when there is no meaning tied to the color."
|
|
2315
2288
|
}
|
|
2316
2289
|
},
|
|
2317
|
-
"Dark increased-contrast/color.
|
|
2318
|
-
"value": "#
|
|
2290
|
+
"Dark increased-contrast/color.text.accent.purple": {
|
|
2291
|
+
"value": "#EED7FC",
|
|
2319
2292
|
"attributes": {
|
|
2320
2293
|
"group": "paint",
|
|
2321
2294
|
"state": "active",
|
|
2322
|
-
"introduced": "
|
|
2323
|
-
"description": "Use for
|
|
2295
|
+
"introduced": "0.6.0",
|
|
2296
|
+
"description": "Use for purple text on subtlest and subtler purple accent backgrounds when there is no meaning tied to the color."
|
|
2324
2297
|
}
|
|
2325
2298
|
},
|
|
2326
|
-
"Dark increased-contrast/color.
|
|
2327
|
-
"value": "#
|
|
2299
|
+
"Dark increased-contrast/color.text.accent.purple.bolder": {
|
|
2300
|
+
"value": "#F8EEFE",
|
|
2328
2301
|
"attributes": {
|
|
2329
2302
|
"group": "paint",
|
|
2330
2303
|
"state": "active",
|
|
2331
|
-
"introduced": "
|
|
2332
|
-
"description": "
|
|
2304
|
+
"introduced": "0.7.0",
|
|
2305
|
+
"description": "Use for purple text on subtle purple accent backgrounds when there is no meaning tied to the color."
|
|
2333
2306
|
}
|
|
2334
2307
|
},
|
|
2335
|
-
"Dark increased-contrast/color.
|
|
2336
|
-
"value": "#
|
|
2308
|
+
"Dark increased-contrast/color.text.accent.magenta": {
|
|
2309
|
+
"value": "#FDD0EC",
|
|
2337
2310
|
"attributes": {
|
|
2338
2311
|
"group": "paint",
|
|
2339
2312
|
"state": "active",
|
|
2340
|
-
"introduced": "
|
|
2341
|
-
"description": "
|
|
2313
|
+
"introduced": "0.6.0",
|
|
2314
|
+
"description": "Use for magenta text on subtlest and subtler magenta accent backgrounds when there is no meaning tied to the color."
|
|
2342
2315
|
}
|
|
2343
2316
|
},
|
|
2344
|
-
"Dark increased-contrast/color.
|
|
2345
|
-
"value": "#
|
|
2317
|
+
"Dark increased-contrast/color.text.accent.magenta.bolder": {
|
|
2318
|
+
"value": "#FFECF8",
|
|
2346
2319
|
"attributes": {
|
|
2347
2320
|
"group": "paint",
|
|
2348
2321
|
"state": "active",
|
|
2349
|
-
"introduced": "
|
|
2350
|
-
"description": "
|
|
2322
|
+
"introduced": "0.7.0",
|
|
2323
|
+
"description": "Use for magenta text on subtle magenta accent backgrounds when there is no meaning tied to the color."
|
|
2351
2324
|
}
|
|
2352
2325
|
},
|
|
2353
|
-
"Dark increased-contrast/color.
|
|
2354
|
-
"value": "#
|
|
2326
|
+
"Dark increased-contrast/color.text.accent.gray": {
|
|
2327
|
+
"value": "#BFC1C4",
|
|
2355
2328
|
"attributes": {
|
|
2356
2329
|
"group": "paint",
|
|
2357
2330
|
"state": "active",
|
|
2358
|
-
"introduced": "0.
|
|
2359
|
-
"description": "
|
|
2331
|
+
"introduced": "0.10.5",
|
|
2332
|
+
"description": "Use for text on non-bold gray accent backgrounds, such as colored tags."
|
|
2360
2333
|
}
|
|
2361
2334
|
},
|
|
2362
|
-
"Dark increased-contrast/color.
|
|
2363
|
-
"value": "#
|
|
2335
|
+
"Dark increased-contrast/color.text.accent.gray.bolder": {
|
|
2336
|
+
"value": "#E2E3E4",
|
|
2364
2337
|
"attributes": {
|
|
2365
2338
|
"group": "paint",
|
|
2366
2339
|
"state": "active",
|
|
2367
|
-
"introduced": "0.
|
|
2368
|
-
"description": "
|
|
2340
|
+
"introduced": "0.10.5",
|
|
2341
|
+
"description": "Use for text and icons on gray subtle accent backgrounds."
|
|
2369
2342
|
}
|
|
2370
2343
|
},
|
|
2371
|
-
"Dark increased-contrast/color.
|
|
2372
|
-
"value": "#
|
|
2344
|
+
"Dark increased-contrast/color.text.disabled": {
|
|
2345
|
+
"value": "#E5E9F640",
|
|
2373
2346
|
"attributes": {
|
|
2374
2347
|
"group": "paint",
|
|
2375
2348
|
"state": "active",
|
|
2376
|
-
"introduced": "0.
|
|
2377
|
-
"description": "
|
|
2349
|
+
"introduced": "0.0.15",
|
|
2350
|
+
"description": "Use for text in a disabled state."
|
|
2378
2351
|
}
|
|
2379
2352
|
},
|
|
2380
|
-
"Dark increased-contrast/color.
|
|
2381
|
-
"value": "#
|
|
2353
|
+
"Dark increased-contrast/color.text.inverse": {
|
|
2354
|
+
"value": "#1F1F21",
|
|
2382
2355
|
"attributes": {
|
|
2383
2356
|
"group": "paint",
|
|
2384
2357
|
"state": "active",
|
|
2385
2358
|
"introduced": "0.6.0",
|
|
2386
|
-
"description": "Use for
|
|
2359
|
+
"description": "Use for text on bold backgrounds."
|
|
2387
2360
|
}
|
|
2388
2361
|
},
|
|
2389
|
-
"Dark increased-contrast/color.
|
|
2390
|
-
"value": "#
|
|
2362
|
+
"Dark increased-contrast/color.text.selected": {
|
|
2363
|
+
"value": "#CFE1FD",
|
|
2391
2364
|
"attributes": {
|
|
2392
2365
|
"group": "paint",
|
|
2393
2366
|
"state": "active",
|
|
2394
2367
|
"introduced": "0.6.0",
|
|
2395
|
-
"description": "
|
|
2368
|
+
"description": "Use for text in selected or opened states, such as tabs and dropdown buttons."
|
|
2396
2369
|
}
|
|
2397
2370
|
},
|
|
2398
|
-
"Dark increased-contrast/color.
|
|
2399
|
-
"value": "#
|
|
2371
|
+
"Dark increased-contrast/color.text.brand": {
|
|
2372
|
+
"value": "#CFE1FD",
|
|
2400
2373
|
"attributes": {
|
|
2401
2374
|
"group": "paint",
|
|
2402
2375
|
"state": "active",
|
|
2403
2376
|
"introduced": "0.6.0",
|
|
2404
|
-
"description": "
|
|
2377
|
+
"description": "Use for text that reinforces our brand."
|
|
2405
2378
|
}
|
|
2406
2379
|
},
|
|
2407
|
-
"Dark increased-contrast/color.
|
|
2408
|
-
"value": "#
|
|
2380
|
+
"Dark increased-contrast/color.text.danger": {
|
|
2381
|
+
"value": "#FFD5D2",
|
|
2409
2382
|
"attributes": {
|
|
2410
2383
|
"group": "paint",
|
|
2411
2384
|
"state": "active",
|
|
2412
|
-
"introduced": "
|
|
2413
|
-
"description": "Use for
|
|
2385
|
+
"introduced": "0.0.15",
|
|
2386
|
+
"description": "Use for critical text, such as input field error messaging."
|
|
2414
2387
|
}
|
|
2415
2388
|
},
|
|
2416
|
-
"Dark increased-contrast/color.
|
|
2417
|
-
"value": "#
|
|
2389
|
+
"Dark increased-contrast/color.text.danger.bolder": {
|
|
2390
|
+
"value": "#FFECEB",
|
|
2418
2391
|
"attributes": {
|
|
2419
2392
|
"group": "paint",
|
|
2420
2393
|
"state": "active",
|
|
2421
2394
|
"introduced": "8.1.0",
|
|
2422
|
-
"description": "
|
|
2395
|
+
"description": "Use for text on top of danger semantic labels to ensure accessibility and desired visual appearance."
|
|
2423
2396
|
}
|
|
2424
2397
|
},
|
|
2425
|
-
"Dark increased-contrast/color.
|
|
2426
|
-
"value": "#
|
|
2398
|
+
"Dark increased-contrast/color.text.warning": {
|
|
2399
|
+
"value": "#FCE4A6",
|
|
2427
2400
|
"attributes": {
|
|
2428
2401
|
"group": "paint",
|
|
2429
2402
|
"state": "active",
|
|
2430
|
-
"introduced": "
|
|
2431
|
-
"description": "
|
|
2403
|
+
"introduced": "0.0.15",
|
|
2404
|
+
"description": "Use for text to emphasize caution, such as in moved lozenges."
|
|
2432
2405
|
}
|
|
2433
2406
|
},
|
|
2434
|
-
"Dark increased-contrast/color.
|
|
2435
|
-
"value": "#
|
|
2407
|
+
"Dark increased-contrast/color.text.warning.inverse": {
|
|
2408
|
+
"value": "#18191A",
|
|
2436
2409
|
"attributes": {
|
|
2437
2410
|
"group": "paint",
|
|
2438
2411
|
"state": "active",
|
|
2439
|
-
"introduced": "
|
|
2440
|
-
"description": "
|
|
2412
|
+
"introduced": "0.6.0",
|
|
2413
|
+
"description": "Use for text when on bold warning backgrounds."
|
|
2441
2414
|
}
|
|
2442
2415
|
},
|
|
2443
|
-
"Dark increased-contrast/color.
|
|
2444
|
-
"value": "#
|
|
2416
|
+
"Dark increased-contrast/color.text.warning.bolder": {
|
|
2417
|
+
"value": "#FFF5DB",
|
|
2445
2418
|
"attributes": {
|
|
2446
2419
|
"group": "paint",
|
|
2447
2420
|
"state": "active",
|
|
2448
|
-
"introduced": "
|
|
2449
|
-
"description": "
|
|
2421
|
+
"introduced": "8.1.0",
|
|
2422
|
+
"description": "Use for text on top of warning semantic labels to ensure accessibility and desired visual appearance."
|
|
2450
2423
|
}
|
|
2451
2424
|
},
|
|
2452
|
-
"Dark increased-contrast/color.
|
|
2453
|
-
"value": "#
|
|
2425
|
+
"Dark increased-contrast/color.text.success": {
|
|
2426
|
+
"value": "#BAF3DB",
|
|
2454
2427
|
"attributes": {
|
|
2455
2428
|
"group": "paint",
|
|
2456
2429
|
"state": "active",
|
|
2457
|
-
"introduced": "0.
|
|
2458
|
-
"description": "
|
|
2430
|
+
"introduced": "0.0.15",
|
|
2431
|
+
"description": "Use for text to communicate a favorable outcome, such as input field success messaging."
|
|
2459
2432
|
}
|
|
2460
2433
|
},
|
|
2461
|
-
"Dark increased-contrast/color.
|
|
2462
|
-
"value": "#
|
|
2434
|
+
"Dark increased-contrast/color.text.success.bolder": {
|
|
2435
|
+
"value": "#DCFFF1",
|
|
2463
2436
|
"attributes": {
|
|
2464
2437
|
"group": "paint",
|
|
2465
2438
|
"state": "active",
|
|
2466
|
-
"introduced": "
|
|
2467
|
-
"description": "
|
|
2439
|
+
"introduced": "8.1.0",
|
|
2440
|
+
"description": "Use for text on top of success semantic labels to ensure accessibility and desired visual appearance."
|
|
2468
2441
|
}
|
|
2469
2442
|
},
|
|
2470
|
-
"Dark increased-contrast/color.
|
|
2471
|
-
"value": "#
|
|
2443
|
+
"Dark increased-contrast/color.text.discovery": {
|
|
2444
|
+
"value": "#EED7FC",
|
|
2472
2445
|
"attributes": {
|
|
2473
2446
|
"group": "paint",
|
|
2474
2447
|
"state": "active",
|
|
2475
|
-
"introduced": "0.
|
|
2476
|
-
"description": "Use for
|
|
2448
|
+
"introduced": "0.0.15",
|
|
2449
|
+
"description": "Use for text to emphasize change or something new, such as in new lozenges."
|
|
2477
2450
|
}
|
|
2478
2451
|
},
|
|
2479
|
-
"Dark increased-contrast/color.
|
|
2480
|
-
"value": "#
|
|
2452
|
+
"Dark increased-contrast/color.text.discovery.bolder": {
|
|
2453
|
+
"value": "#F8EEFE",
|
|
2481
2454
|
"attributes": {
|
|
2482
2455
|
"group": "paint",
|
|
2483
2456
|
"state": "active",
|
|
2484
|
-
"introduced": "
|
|
2485
|
-
"description": "
|
|
2457
|
+
"introduced": "8.1.0",
|
|
2458
|
+
"description": "Use for text on top of discovery semantic labels to ensure accessibility and desired visual appearance."
|
|
2486
2459
|
}
|
|
2487
2460
|
},
|
|
2488
|
-
"Dark increased-contrast/color.
|
|
2489
|
-
"value": "#
|
|
2461
|
+
"Dark increased-contrast/color.text.information": {
|
|
2462
|
+
"value": "#CFE1FD",
|
|
2490
2463
|
"attributes": {
|
|
2491
2464
|
"group": "paint",
|
|
2492
2465
|
"state": "active",
|
|
2493
2466
|
"introduced": "0.6.0",
|
|
2494
|
-
"description": "
|
|
2467
|
+
"description": "Use for informative text or to communicate something is in progress, such as in-progress lozenges."
|
|
2495
2468
|
}
|
|
2496
2469
|
},
|
|
2497
|
-
"Dark increased-contrast/color.
|
|
2498
|
-
"value": "#
|
|
2470
|
+
"Dark increased-contrast/color.text.information.bolder": {
|
|
2471
|
+
"value": "#E9F2FE",
|
|
2499
2472
|
"attributes": {
|
|
2500
2473
|
"group": "paint",
|
|
2501
2474
|
"state": "active",
|
|
2502
2475
|
"introduced": "8.1.0",
|
|
2503
|
-
"description": "Use for
|
|
2476
|
+
"description": "Use for text on top of information semantic labels to ensure accessibility and desired visual appearance."
|
|
2504
2477
|
}
|
|
2505
2478
|
},
|
|
2506
|
-
"Dark increased-contrast/color.
|
|
2507
|
-
"value": "#
|
|
2479
|
+
"Dark increased-contrast/color.text.subtlest": {
|
|
2480
|
+
"value": "#BFC1C4",
|
|
2508
2481
|
"attributes": {
|
|
2509
2482
|
"group": "paint",
|
|
2510
2483
|
"state": "active",
|
|
2511
|
-
"introduced": "
|
|
2512
|
-
"description": "
|
|
2484
|
+
"introduced": "0.6.0",
|
|
2485
|
+
"description": "Use for tertiary text, such as meta-data, breadcrumbs, input field placeholder and helper text."
|
|
2513
2486
|
}
|
|
2514
2487
|
},
|
|
2515
|
-
"Dark increased-contrast/color.
|
|
2516
|
-
"value": "#
|
|
2488
|
+
"Dark increased-contrast/color.text.subtle": {
|
|
2489
|
+
"value": "#CECFD2",
|
|
2517
2490
|
"attributes": {
|
|
2518
2491
|
"group": "paint",
|
|
2519
2492
|
"state": "active",
|
|
2520
|
-
"introduced": "
|
|
2521
|
-
"description": "
|
|
2493
|
+
"introduced": "0.6.0",
|
|
2494
|
+
"description": "Use for secondary text, such as navigation, subtle button links, input field labels, and all caps subheadings."
|
|
2522
2495
|
}
|
|
2523
2496
|
},
|
|
2524
|
-
"Dark increased-contrast/color.
|
|
2525
|
-
"value": "#
|
|
2497
|
+
"Dark increased-contrast/color.icon": {
|
|
2498
|
+
"value": "#CECFD2",
|
|
2526
2499
|
"attributes": {
|
|
2527
2500
|
"group": "paint",
|
|
2528
2501
|
"state": "active",
|
|
2529
|
-
"introduced": "
|
|
2530
|
-
"description": "
|
|
2502
|
+
"introduced": "0.6.0",
|
|
2503
|
+
"description": "Use for icon-only buttons, or icons paired with color.text"
|
|
2531
2504
|
}
|
|
2532
2505
|
},
|
|
2533
|
-
"Dark increased-contrast/color.
|
|
2534
|
-
"value": "#
|
|
2506
|
+
"Dark increased-contrast/color.icon.accent.lime": {
|
|
2507
|
+
"value": "#B3DF72",
|
|
2535
2508
|
"attributes": {
|
|
2536
2509
|
"group": "paint",
|
|
2537
2510
|
"state": "active",
|
|
2538
|
-
"introduced": "
|
|
2539
|
-
"description": "
|
|
2511
|
+
"introduced": "1.6.0",
|
|
2512
|
+
"description": "Use for lime icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2540
2513
|
}
|
|
2541
2514
|
},
|
|
2542
|
-
"Dark increased-contrast/color.
|
|
2543
|
-
"value": "#
|
|
2515
|
+
"Dark increased-contrast/color.icon.accent.red": {
|
|
2516
|
+
"value": "#FD9891",
|
|
2544
2517
|
"attributes": {
|
|
2545
2518
|
"group": "paint",
|
|
2546
2519
|
"state": "active",
|
|
2547
2520
|
"introduced": "0.6.0",
|
|
2548
|
-
"description": "
|
|
2521
|
+
"description": "Use for red icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2549
2522
|
}
|
|
2550
2523
|
},
|
|
2551
|
-
"Dark increased-contrast/color.
|
|
2552
|
-
"value": "#
|
|
2524
|
+
"Dark increased-contrast/color.icon.accent.orange": {
|
|
2525
|
+
"value": "#FBC828",
|
|
2553
2526
|
"attributes": {
|
|
2554
2527
|
"group": "paint",
|
|
2555
2528
|
"state": "active",
|
|
2556
2529
|
"introduced": "0.6.0",
|
|
2557
|
-
"description": "
|
|
2530
|
+
"description": "Use for orange icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2558
2531
|
}
|
|
2559
2532
|
},
|
|
2560
|
-
"Dark increased-contrast/color.
|
|
2561
|
-
"value": "#
|
|
2533
|
+
"Dark increased-contrast/color.icon.accent.yellow": {
|
|
2534
|
+
"value": "#EED12B",
|
|
2562
2535
|
"attributes": {
|
|
2563
2536
|
"group": "paint",
|
|
2564
2537
|
"state": "active",
|
|
2565
2538
|
"introduced": "0.6.0",
|
|
2566
|
-
"description": "Use for backgrounds
|
|
2539
|
+
"description": "Use for yellow icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2567
2540
|
}
|
|
2568
2541
|
},
|
|
2569
|
-
"Dark increased-contrast/color.
|
|
2570
|
-
"value": "#
|
|
2542
|
+
"Dark increased-contrast/color.icon.accent.green": {
|
|
2543
|
+
"value": "#7EE2B8",
|
|
2571
2544
|
"attributes": {
|
|
2572
2545
|
"group": "paint",
|
|
2573
2546
|
"state": "active",
|
|
2574
2547
|
"introduced": "0.6.0",
|
|
2575
|
-
"description": "
|
|
2548
|
+
"description": "Use for green icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2576
2549
|
}
|
|
2577
2550
|
},
|
|
2578
|
-
"Dark increased-contrast/color.
|
|
2579
|
-
"value": "#
|
|
2551
|
+
"Dark increased-contrast/color.icon.accent.teal": {
|
|
2552
|
+
"value": "#9DD9EE",
|
|
2580
2553
|
"attributes": {
|
|
2581
2554
|
"group": "paint",
|
|
2582
2555
|
"state": "active",
|
|
2583
2556
|
"introduced": "0.6.0",
|
|
2584
|
-
"description": "
|
|
2557
|
+
"description": "Use for teal icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2585
2558
|
}
|
|
2586
2559
|
},
|
|
2587
|
-
"Dark increased-contrast/color.
|
|
2588
|
-
"value": "#
|
|
2560
|
+
"Dark increased-contrast/color.icon.accent.blue": {
|
|
2561
|
+
"value": "#8FB8F6",
|
|
2589
2562
|
"attributes": {
|
|
2590
2563
|
"group": "paint",
|
|
2591
2564
|
"state": "active",
|
|
2592
|
-
"introduced": "
|
|
2593
|
-
"description": "Use for backgrounds
|
|
2565
|
+
"introduced": "0.6.0",
|
|
2566
|
+
"description": "Use for blue icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2594
2567
|
}
|
|
2595
2568
|
},
|
|
2596
|
-
"Dark increased-contrast/color.
|
|
2597
|
-
"value": "#
|
|
2569
|
+
"Dark increased-contrast/color.icon.accent.purple": {
|
|
2570
|
+
"value": "#D8A0F7",
|
|
2598
2571
|
"attributes": {
|
|
2599
2572
|
"group": "paint",
|
|
2600
2573
|
"state": "active",
|
|
2601
|
-
"introduced": "
|
|
2602
|
-
"description": "
|
|
2574
|
+
"introduced": "0.6.0",
|
|
2575
|
+
"description": "Use for purple icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2603
2576
|
}
|
|
2604
2577
|
},
|
|
2605
|
-
"Dark increased-contrast/color.
|
|
2606
|
-
"value": "#
|
|
2578
|
+
"Dark increased-contrast/color.icon.accent.magenta": {
|
|
2579
|
+
"value": "#F797D2",
|
|
2607
2580
|
"attributes": {
|
|
2608
2581
|
"group": "paint",
|
|
2609
2582
|
"state": "active",
|
|
2610
|
-
"introduced": "
|
|
2611
|
-
"description": "
|
|
2583
|
+
"introduced": "0.6.0",
|
|
2584
|
+
"description": "Use for magenta icons on non-bold backgrounds when there is no meaning tied to the color, such as file type icons."
|
|
2612
2585
|
}
|
|
2613
2586
|
},
|
|
2614
|
-
"Dark increased-contrast/color.
|
|
2615
|
-
"value": "#
|
|
2587
|
+
"Dark increased-contrast/color.icon.accent.gray": {
|
|
2588
|
+
"value": "#A9ABAF",
|
|
2616
2589
|
"attributes": {
|
|
2617
2590
|
"group": "paint",
|
|
2618
2591
|
"state": "active",
|
|
2619
|
-
"introduced": "
|
|
2620
|
-
"description": "
|
|
2592
|
+
"introduced": "0.10.5",
|
|
2593
|
+
"description": "Use for icons on non-bold gray accent backgrounds, such as file type icons."
|
|
2621
2594
|
}
|
|
2622
2595
|
},
|
|
2623
|
-
"Dark increased-contrast/color.
|
|
2624
|
-
"value": "#
|
|
2596
|
+
"Dark increased-contrast/color.icon.disabled": {
|
|
2597
|
+
"value": "#E5E9F640",
|
|
2625
2598
|
"attributes": {
|
|
2626
2599
|
"group": "paint",
|
|
2627
2600
|
"state": "active",
|
|
2628
2601
|
"introduced": "0.6.0",
|
|
2629
|
-
"description": "
|
|
2602
|
+
"description": "Use for icons in a disabled state."
|
|
2630
2603
|
}
|
|
2631
2604
|
},
|
|
2632
|
-
"Dark increased-contrast/color.
|
|
2633
|
-
"value": "#
|
|
2605
|
+
"Dark increased-contrast/color.icon.inverse": {
|
|
2606
|
+
"value": "#1F1F21",
|
|
2634
2607
|
"attributes": {
|
|
2635
2608
|
"group": "paint",
|
|
2636
2609
|
"state": "active",
|
|
2637
2610
|
"introduced": "0.6.0",
|
|
2638
|
-
"description": "
|
|
2611
|
+
"description": "Use for icons on bold backgrounds."
|
|
2639
2612
|
}
|
|
2640
2613
|
},
|
|
2641
|
-
"Dark increased-contrast/color.
|
|
2642
|
-
"value": "#
|
|
2614
|
+
"Dark increased-contrast/color.icon.selected": {
|
|
2615
|
+
"value": "#8FB8F6",
|
|
2643
2616
|
"attributes": {
|
|
2644
2617
|
"group": "paint",
|
|
2645
2618
|
"state": "active",
|
|
2646
|
-
"introduced": "0.6.
|
|
2647
|
-
"description": "
|
|
2619
|
+
"introduced": "0.6.2",
|
|
2620
|
+
"description": "Use for icons in selected or opened states, such as those used in dropdown buttons."
|
|
2648
2621
|
}
|
|
2649
2622
|
},
|
|
2650
|
-
"Dark increased-contrast/color.
|
|
2651
|
-
"value": "#
|
|
2623
|
+
"Dark increased-contrast/color.icon.brand": {
|
|
2624
|
+
"value": "#8FB8F6",
|
|
2652
2625
|
"attributes": {
|
|
2653
2626
|
"group": "paint",
|
|
2654
2627
|
"state": "active",
|
|
2655
2628
|
"introduced": "0.6.0",
|
|
2656
|
-
"description": "Use for
|
|
2629
|
+
"description": "Use for icons that reinforce our brand."
|
|
2657
2630
|
}
|
|
2658
2631
|
},
|
|
2659
|
-
"Dark increased-contrast/color.
|
|
2660
|
-
"value": "#
|
|
2632
|
+
"Dark increased-contrast/color.icon.danger": {
|
|
2633
|
+
"value": "#F87168",
|
|
2661
2634
|
"attributes": {
|
|
2662
2635
|
"group": "paint",
|
|
2663
2636
|
"state": "active",
|
|
2664
2637
|
"introduced": "0.6.0",
|
|
2665
|
-
"description": "
|
|
2638
|
+
"description": "Use for icons communicating critical information, such as those used in error handing."
|
|
2666
2639
|
}
|
|
2667
2640
|
},
|
|
2668
|
-
"Dark increased-contrast/color.
|
|
2669
|
-
"value": "#
|
|
2641
|
+
"Dark increased-contrast/color.icon.warning": {
|
|
2642
|
+
"value": "#FBC828",
|
|
2670
2643
|
"attributes": {
|
|
2671
2644
|
"group": "paint",
|
|
2672
2645
|
"state": "active",
|
|
2673
2646
|
"introduced": "0.6.0",
|
|
2674
|
-
"description": "
|
|
2647
|
+
"description": "Use for icons communicating caution, such as those used in warning section messages."
|
|
2675
2648
|
}
|
|
2676
2649
|
},
|
|
2677
|
-
"Dark increased-contrast/color.
|
|
2678
|
-
"value": "#
|
|
2650
|
+
"Dark increased-contrast/color.icon.warning.inverse": {
|
|
2651
|
+
"value": "#18191A",
|
|
2679
2652
|
"attributes": {
|
|
2680
2653
|
"group": "paint",
|
|
2681
2654
|
"state": "active",
|
|
2682
|
-
"introduced": "
|
|
2683
|
-
"description": "Use for
|
|
2655
|
+
"introduced": "0.6.0",
|
|
2656
|
+
"description": "Use for icons when on bold warning backgrounds."
|
|
2684
2657
|
}
|
|
2685
2658
|
},
|
|
2686
|
-
"Dark increased-contrast/color.
|
|
2687
|
-
"value": "#
|
|
2659
|
+
"Dark increased-contrast/color.icon.success": {
|
|
2660
|
+
"value": "#7EE2B8",
|
|
2688
2661
|
"attributes": {
|
|
2689
2662
|
"group": "paint",
|
|
2690
2663
|
"state": "active",
|
|
2691
|
-
"introduced": "
|
|
2692
|
-
"description": "
|
|
2664
|
+
"introduced": "0.6.0",
|
|
2665
|
+
"description": "Use for icons communicating a favorable outcome, such as those used in success section messaged."
|
|
2693
2666
|
}
|
|
2694
2667
|
},
|
|
2695
|
-
"Dark increased-contrast/color.
|
|
2696
|
-
"value": "#
|
|
2668
|
+
"Dark increased-contrast/color.icon.discovery": {
|
|
2669
|
+
"value": "#C97CF4",
|
|
2697
2670
|
"attributes": {
|
|
2698
2671
|
"group": "paint",
|
|
2699
2672
|
"state": "active",
|
|
2700
|
-
"introduced": "
|
|
2701
|
-
"description": "
|
|
2673
|
+
"introduced": "0.6.0",
|
|
2674
|
+
"description": "Use for icons communicating change or something new, such as discovery section messages."
|
|
2702
2675
|
}
|
|
2703
2676
|
},
|
|
2704
|
-
"Dark increased-contrast/color.
|
|
2705
|
-
"value": "#
|
|
2677
|
+
"Dark increased-contrast/color.icon.information": {
|
|
2678
|
+
"value": "#8FB8F6",
|
|
2706
2679
|
"attributes": {
|
|
2707
2680
|
"group": "paint",
|
|
2708
2681
|
"state": "active",
|
|
2709
|
-
"introduced": "
|
|
2710
|
-
"description": "
|
|
2682
|
+
"introduced": "0.6.0",
|
|
2683
|
+
"description": "Use for icons communicating information or something in-progress, such as information section messages."
|
|
2711
2684
|
}
|
|
2712
2685
|
},
|
|
2713
|
-
"Dark increased-contrast/color.
|
|
2714
|
-
"value": "#
|
|
2686
|
+
"Dark increased-contrast/color.icon.subtlest": {
|
|
2687
|
+
"value": "#BFC1C4",
|
|
2715
2688
|
"attributes": {
|
|
2716
2689
|
"group": "paint",
|
|
2717
2690
|
"state": "active",
|
|
2718
|
-
"introduced": "
|
|
2719
|
-
"description": "
|
|
2691
|
+
"introduced": "1.54.0",
|
|
2692
|
+
"description": "Use for icons paired with color.text.subtlest"
|
|
2720
2693
|
}
|
|
2721
2694
|
},
|
|
2722
|
-
"Dark increased-contrast/color.
|
|
2723
|
-
"value": "#
|
|
2695
|
+
"Dark increased-contrast/color.icon.subtle": {
|
|
2696
|
+
"value": "#BFC1C4",
|
|
2724
2697
|
"attributes": {
|
|
2725
2698
|
"group": "paint",
|
|
2726
2699
|
"state": "active",
|
|
2727
2700
|
"introduced": "0.6.0",
|
|
2728
|
-
"description": "
|
|
2701
|
+
"description": "Use for icons paired with color.text.subtle"
|
|
2729
2702
|
}
|
|
2730
2703
|
},
|
|
2731
|
-
"Dark increased-contrast/color.
|
|
2732
|
-
"value": "#
|
|
2704
|
+
"Dark increased-contrast/color.link": {
|
|
2705
|
+
"value": "#CFE1FD",
|
|
2733
2706
|
"attributes": {
|
|
2734
2707
|
"group": "paint",
|
|
2735
2708
|
"state": "active",
|
|
2736
2709
|
"introduced": "0.6.0",
|
|
2737
|
-
"description": "
|
|
2710
|
+
"description": "Use for links in a default or hovered state. Add an underline for hovered states."
|
|
2738
2711
|
}
|
|
2739
2712
|
},
|
|
2740
|
-
"Dark increased-contrast/color.
|
|
2741
|
-
"value": "#
|
|
2713
|
+
"Dark increased-contrast/color.link.pressed": {
|
|
2714
|
+
"value": "#CFE1FD",
|
|
2742
2715
|
"attributes": {
|
|
2743
2716
|
"group": "paint",
|
|
2744
2717
|
"state": "active",
|
|
2745
|
-
"introduced": "0.0
|
|
2746
|
-
"description": "Use for
|
|
2718
|
+
"introduced": "0.6.0",
|
|
2719
|
+
"description": "Use for links in a pressed state."
|
|
2747
2720
|
}
|
|
2748
2721
|
},
|
|
2749
|
-
"Dark increased-contrast/color.
|
|
2750
|
-
"value": "#
|
|
2722
|
+
"Dark increased-contrast/color.link.visited": {
|
|
2723
|
+
"value": "#D8A0F7",
|
|
2751
2724
|
"attributes": {
|
|
2752
2725
|
"group": "paint",
|
|
2753
2726
|
"state": "active",
|
|
2754
|
-
"introduced": "
|
|
2755
|
-
"description": "Use
|
|
2727
|
+
"introduced": "1.23.0",
|
|
2728
|
+
"description": "Use for visited links."
|
|
2756
2729
|
}
|
|
2757
2730
|
},
|
|
2758
|
-
"Dark increased-contrast/color.
|
|
2759
|
-
"value": "#
|
|
2731
|
+
"Dark increased-contrast/color.link.visited.pressed": {
|
|
2732
|
+
"value": "#EED7FC",
|
|
2760
2733
|
"attributes": {
|
|
2761
2734
|
"group": "paint",
|
|
2762
2735
|
"state": "active",
|
|
2763
|
-
"introduced": "
|
|
2764
|
-
"description": "Use
|
|
2736
|
+
"introduced": "1.43.0",
|
|
2737
|
+
"description": "Use for visited links in a pressed state."
|
|
2765
2738
|
}
|
|
2766
2739
|
},
|
|
2767
2740
|
"Dark increased-contrast/color.interaction.hovered": {
|
|
@@ -2800,6 +2773,33 @@
|
|
|
2800
2773
|
"description": "Use for the pulse or shimmer effect in skeleton loading states"
|
|
2801
2774
|
}
|
|
2802
2775
|
},
|
|
2776
|
+
"Dark increased-contrast/color.blanket": {
|
|
2777
|
+
"value": "#10121499",
|
|
2778
|
+
"attributes": {
|
|
2779
|
+
"group": "paint",
|
|
2780
|
+
"state": "active",
|
|
2781
|
+
"introduced": "0.0.15",
|
|
2782
|
+
"description": "Use for the screen overlay that appears with modal dialogs"
|
|
2783
|
+
}
|
|
2784
|
+
},
|
|
2785
|
+
"Dark increased-contrast/color.blanket.selected": {
|
|
2786
|
+
"value": "#1D7AFC14",
|
|
2787
|
+
"attributes": {
|
|
2788
|
+
"group": "paint",
|
|
2789
|
+
"state": "active",
|
|
2790
|
+
"introduced": "0.6.0",
|
|
2791
|
+
"description": "Use as an overlay to communicate selected states when a simple background color change isn't possible, such as in Editor block elements"
|
|
2792
|
+
}
|
|
2793
|
+
},
|
|
2794
|
+
"Dark increased-contrast/color.blanket.danger": {
|
|
2795
|
+
"value": "#E3493514",
|
|
2796
|
+
"attributes": {
|
|
2797
|
+
"group": "paint",
|
|
2798
|
+
"state": "active",
|
|
2799
|
+
"introduced": "0.6.0",
|
|
2800
|
+
"description": "Use as an overlay to communicate danger states when a simple background color change isn't possible, such as deletion of Editor block elements"
|
|
2801
|
+
}
|
|
2802
|
+
},
|
|
2803
2803
|
"Dark increased-contrast/color.chart.categorical.1": {
|
|
2804
2804
|
"value": "#9DD9EE",
|
|
2805
2805
|
"attributes": {
|
|
@@ -3700,6 +3700,105 @@
|
|
|
3700
3700
|
"description": "Hovered state of color.chart.information.bold."
|
|
3701
3701
|
}
|
|
3702
3702
|
},
|
|
3703
|
+
"Dark increased-contrast/color.rovo.background.brand.bold": {
|
|
3704
|
+
"value": "#FFFFFF",
|
|
3705
|
+
"attributes": {
|
|
3706
|
+
"group": "paint",
|
|
3707
|
+
"state": "active",
|
|
3708
|
+
"introduced": "8.2.0",
|
|
3709
|
+
"description": "Background color for Rovo brand emphasis."
|
|
3710
|
+
}
|
|
3711
|
+
},
|
|
3712
|
+
"Dark increased-contrast/color.rovo.background.brand.bold.hovered": {
|
|
3713
|
+
"value": "#E2E3E4",
|
|
3714
|
+
"attributes": {
|
|
3715
|
+
"group": "paint",
|
|
3716
|
+
"state": "active",
|
|
3717
|
+
"introduced": "8.2.0",
|
|
3718
|
+
"description": "Hovered state of color.rovo.background.brand.bold."
|
|
3719
|
+
}
|
|
3720
|
+
},
|
|
3721
|
+
"Dark increased-contrast/color.rovo.background.brand.bold.pressed": {
|
|
3722
|
+
"value": "#CECFD2",
|
|
3723
|
+
"attributes": {
|
|
3724
|
+
"group": "paint",
|
|
3725
|
+
"state": "active",
|
|
3726
|
+
"introduced": "8.2.0",
|
|
3727
|
+
"description": "Pressed state of color.rovo.background.brand.bold."
|
|
3728
|
+
}
|
|
3729
|
+
},
|
|
3730
|
+
"Dark increased-contrast/color.rovo.border.lime": {
|
|
3731
|
+
"value": "#82B536",
|
|
3732
|
+
"attributes": {
|
|
3733
|
+
"group": "paint",
|
|
3734
|
+
"state": "active",
|
|
3735
|
+
"introduced": "13.1.1",
|
|
3736
|
+
"description": "Use for Rovo lime borders."
|
|
3737
|
+
}
|
|
3738
|
+
},
|
|
3739
|
+
"Dark increased-contrast/color.rovo.border.saffron": {
|
|
3740
|
+
"value": "#FCA700",
|
|
3741
|
+
"attributes": {
|
|
3742
|
+
"group": "paint",
|
|
3743
|
+
"state": "active",
|
|
3744
|
+
"introduced": "13.1.1",
|
|
3745
|
+
"description": "Use for Rovo saffron borders."
|
|
3746
|
+
}
|
|
3747
|
+
},
|
|
3748
|
+
"Dark increased-contrast/color.rovo.border.blue": {
|
|
3749
|
+
"value": "#357DE8",
|
|
3750
|
+
"attributes": {
|
|
3751
|
+
"group": "paint",
|
|
3752
|
+
"state": "active",
|
|
3753
|
+
"introduced": "13.1.1",
|
|
3754
|
+
"description": "Use for Rovo blue borders."
|
|
3755
|
+
}
|
|
3756
|
+
},
|
|
3757
|
+
"Dark increased-contrast/color.rovo.border.purple": {
|
|
3758
|
+
"value": "#BF63F3",
|
|
3759
|
+
"attributes": {
|
|
3760
|
+
"group": "paint",
|
|
3761
|
+
"state": "active",
|
|
3762
|
+
"introduced": "13.1.1",
|
|
3763
|
+
"description": "Use for Rovo purple borders."
|
|
3764
|
+
}
|
|
3765
|
+
},
|
|
3766
|
+
"Dark increased-contrast/color.rovo.icon.lime": {
|
|
3767
|
+
"value": "#82B536",
|
|
3768
|
+
"attributes": {
|
|
3769
|
+
"group": "paint",
|
|
3770
|
+
"state": "active",
|
|
3771
|
+
"introduced": "13.1.1",
|
|
3772
|
+
"description": "Use for Rovo lime icons."
|
|
3773
|
+
}
|
|
3774
|
+
},
|
|
3775
|
+
"Dark increased-contrast/color.rovo.icon.saffron": {
|
|
3776
|
+
"value": "#FCA700",
|
|
3777
|
+
"attributes": {
|
|
3778
|
+
"group": "paint",
|
|
3779
|
+
"state": "active",
|
|
3780
|
+
"introduced": "13.1.1",
|
|
3781
|
+
"description": "Use for Rovo saffron icons."
|
|
3782
|
+
}
|
|
3783
|
+
},
|
|
3784
|
+
"Dark increased-contrast/color.rovo.icon.blue": {
|
|
3785
|
+
"value": "#357DE8",
|
|
3786
|
+
"attributes": {
|
|
3787
|
+
"group": "paint",
|
|
3788
|
+
"state": "active",
|
|
3789
|
+
"introduced": "13.1.1",
|
|
3790
|
+
"description": "Use for Rovo blue icons."
|
|
3791
|
+
}
|
|
3792
|
+
},
|
|
3793
|
+
"Dark increased-contrast/color.rovo.icon.purple": {
|
|
3794
|
+
"value": "#BF63F3",
|
|
3795
|
+
"attributes": {
|
|
3796
|
+
"group": "paint",
|
|
3797
|
+
"state": "active",
|
|
3798
|
+
"introduced": "13.1.1",
|
|
3799
|
+
"description": "Use for Rovo purple icons."
|
|
3800
|
+
}
|
|
3801
|
+
},
|
|
3703
3802
|
"Dark increased-contrast/elevation.surface": {
|
|
3704
3803
|
"value": "#1F1F21",
|
|
3705
3804
|
"attributes": {
|