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