@atlaskit/tokens 13.2.0 → 13.3.1

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