@patternfly/design-tokens 1.14.9 → 1.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/build/css/tokens-dark.scss +14 -15
  2. package/build/css/tokens-default.scss +10 -11
  3. package/build/css/tokens-glass-dark.scss +16 -3
  4. package/build/css/tokens-glass.scss +9 -3
  5. package/build/css/tokens-palette.scss +1 -1
  6. package/build/css/tokens-redhat-dark.scss +4 -3
  7. package/build/css/tokens-redhat-glass-dark.scss +18 -4
  8. package/build/css/tokens-redhat-glass.scss +9 -3
  9. package/build/css/tokens-redhat-highcontrast-dark.scss +10 -3
  10. package/build/css/tokens-redhat-highcontrast.scss +2 -2
  11. package/build/css/tokens-redhat.scss +1 -1
  12. package/package.json +1 -1
  13. package/patternfly-docs/content/token-layers-glass-dark.json +497 -1097
  14. package/patternfly-docs/content/token-layers-glass.json +332 -904
  15. package/patternfly-docs/content/token-layers-highcontrast-dark.json +410 -385
  16. package/patternfly-docs/content/token-layers-highcontrast.json +540 -519
  17. package/patternfly-docs/content/token-layers-redhat-dark.json +2555 -2592
  18. package/patternfly-docs/content/token-layers-redhat-glass-dark.json +1112 -1768
  19. package/patternfly-docs/content/token-layers-redhat-glass.json +327 -899
  20. package/patternfly-docs/content/token-layers-redhat-highcontrast-dark.json +443 -422
  21. package/patternfly-docs/content/token-layers-redhat-highcontrast.json +626 -609
  22. package/patternfly-docs/content/token-layers-redhat.json +692 -671
  23. package/plugins/export-patternfly-tokens/dist/ui.html +32 -24
  24. package/plugins/export-patternfly-tokens/src/ui.tsx +8 -0
  25. package/tokens/default/dark/base.dark.json +5 -5
  26. package/tokens/default/dark/charts.dark.json +18 -18
  27. package/tokens/default/dark/semantic.dark.json +34 -39
  28. package/tokens/default/glass/base.dimension.json +16 -16
  29. package/tokens/default/glass/base.json +2 -2
  30. package/tokens/default/glass/semantic.glass.json +33 -38
  31. package/tokens/default/glass-dark/base.dark.json +5 -5
  32. package/tokens/default/glass-dark/semantic.glass.dark.json +45 -50
  33. package/tokens/default/highcontrast/base.dimension.json +16 -16
  34. package/tokens/default/highcontrast/base.json +2 -2
  35. package/tokens/default/highcontrast/semantic.dimension.highcontrast.json +5 -5
  36. package/tokens/default/highcontrast/semantic.highcontrast.json +27 -32
  37. package/tokens/default/highcontrast-dark/base.dark.json +5 -5
  38. package/tokens/default/highcontrast-dark/semantic.highcontrast.dark.json +27 -32
  39. package/tokens/default/light/base.dimension.json +16 -16
  40. package/tokens/default/light/base.json +2 -2
  41. package/tokens/default/light/charts.json +18 -18
  42. package/tokens/default/light/semantic.dimension.json +5 -5
  43. package/tokens/default/light/semantic.json +27 -32
  44. package/tokens/default/light/semantic.motion.json +8 -8
  45. package/tokens/redhat/dark/redhat.color.dark.json +71 -24
  46. package/tokens/redhat/glass/redhat.color.glass.json +25 -25
  47. package/tokens/redhat/glass-dark/redhat.color.glass.dark.json +67 -25
  48. package/tokens/redhat/highcontrast/redhat.color.highcontrast.json +25 -25
  49. package/tokens/redhat/highcontrast/redhat.dimension.highcontrast.json +6 -6
  50. package/tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json +25 -25
  51. package/tokens/redhat/light/redhat.color.json +25 -25
  52. package/tokens/redhat/light/redhat.dimension.json +6 -6
package/patternfly-docs/content/token-layers-redhat-highcontrast-dark.json CHANGED
@@ -1,132 +1,128 @@
1
1
  {
2
2
  "semantic": {
3
3
  "colors": {
4
- "pf-t--global--background--filter--glass--blur--primary": {
5
- "default": {
6
- "type": "number",
7
- "value": "blur(0px)",
8
- "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
9
- "isSource": true,
10
- "original": {
11
- "type": "number",
12
- "value": 0
13
- },
14
- "name": "pf-t--global--background--filter--glass--blur--primary",
15
- "attributes": {
16
- "category": "global",
17
- "type": "background",
18
- "item": "filter",
19
- "subitem": "glass",
20
- "state": "blur"
21
- },
22
- "path": [
23
- "global",
24
- "background",
25
- "filter",
26
- "glass",
27
- "blur",
28
- "primary"
29
- ]
30
- }
31
- },
32
- "pf-t--global--background--filter--glass--blur--floating": {
4
+ "pf-t--global--background--color--primary--default": {
33
5
  "default": {
34
- "type": "number",
35
- "value": "blur(0px)",
6
+ "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
7
+ "type": "color",
8
+ "value": "#000000",
36
9
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
37
10
  "isSource": true,
38
11
  "original": {
39
- "type": "number",
40
- "value": 0
12
+ "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
13
+ "type": "color",
14
+ "value": "{color.black}"
41
15
  },
42
- "name": "pf-t--global--background--filter--glass--blur--floating",
16
+ "name": "pf-t--global--background--color--primary--default",
43
17
  "attributes": {
44
18
  "category": "global",
45
19
  "type": "background",
46
- "item": "filter",
47
- "subitem": "glass",
48
- "state": "blur"
20
+ "item": "color",
21
+ "subitem": "primary",
22
+ "state": "default"
49
23
  },
50
24
  "path": [
51
25
  "global",
52
26
  "background",
53
- "filter",
54
- "glass",
55
- "blur",
56
- "floating"
27
+ "color",
28
+ "primary",
29
+ "default"
30
+ ],
31
+ "references": [
32
+ {
33
+ "type": "color",
34
+ "value": "#000000",
35
+ "filePath": "tokens/default/highcontrast-dark/palette.color.json",
36
+ "isSource": true,
37
+ "original": {
38
+ "type": "color",
39
+ "value": "#000000"
40
+ },
41
+ "name": "pf-t--color--black",
42
+ "attributes": {
43
+ "category": "color",
44
+ "type": "black"
45
+ },
46
+ "path": [
47
+ "color",
48
+ "black"
49
+ ]
50
+ }
57
51
  ]
58
52
  }
59
53
  },
60
- "pf-t--global--background--color--glass--primary": {
54
+ "pf-t--global--background--color--primary--hover": {
61
55
  "default": {
56
+ "description": "Use as the hover state for primary backgrounds",
62
57
  "type": "color",
63
- "value": "#000000",
58
+ "value": "#292929",
64
59
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
65
60
  "isSource": true,
66
61
  "original": {
62
+ "description": "Use as the hover state for primary backgrounds",
67
63
  "type": "color",
68
- "value": "{global.background.color.primary.default}"
64
+ "value": "{global.dark.background.color.200}"
69
65
  },
70
- "name": "pf-t--global--background--color--glass--primary",
66
+ "name": "pf-t--global--background--color--primary--hover",
71
67
  "attributes": {
72
68
  "category": "global",
73
69
  "type": "background",
74
70
  "item": "color",
75
- "subitem": "glass",
76
- "state": "primary"
71
+ "subitem": "primary",
72
+ "state": "hover"
77
73
  },
78
74
  "path": [
79
75
  "global",
80
76
  "background",
81
77
  "color",
82
- "glass",
83
- "primary"
78
+ "primary",
79
+ "hover"
84
80
  ],
85
81
  "references": [
86
82
  {
87
- "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
88
83
  "type": "color",
89
- "value": "#000000",
90
- "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
84
+ "value": "#292929",
85
+ "filePath": "tokens/default/highcontrast-dark/base.dark.json",
91
86
  "isSource": true,
92
87
  "original": {
93
- "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
94
88
  "type": "color",
95
- "value": "{color.black}"
89
+ "value": "{color.gray.80}"
96
90
  },
97
- "name": "pf-t--global--background--color--primary--default",
91
+ "name": "pf-t--global--dark--background--color--200",
98
92
  "attributes": {
99
93
  "category": "global",
100
- "type": "background",
101
- "item": "color",
102
- "subitem": "primary",
103
- "state": "default"
94
+ "type": "dark",
95
+ "item": "background",
96
+ "subitem": "color",
97
+ "state": "200"
104
98
  },
105
99
  "path": [
106
100
  "global",
101
+ "dark",
107
102
  "background",
108
103
  "color",
109
- "primary",
110
- "default"
104
+ "200"
111
105
  ],
112
106
  "references": [
113
107
  {
114
108
  "type": "color",
115
- "value": "#000000",
109
+ "value": "#292929",
116
110
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
117
111
  "isSource": true,
118
112
  "original": {
119
113
  "type": "color",
120
- "value": "#000000"
114
+ "value": "#292929"
121
115
  },
122
- "name": "pf-t--color--black",
116
+ "name": "pf-t--color--gray--80",
123
117
  "attributes": {
124
118
  "category": "color",
125
- "type": "black"
119
+ "type": "gray",
120
+ "item": "80"
126
121
  },
127
122
  "path": [
128
123
  "color",
129
- "black"
124
+ "gray",
125
+ "80"
130
126
  ]
131
127
  }
132
128
  ]
@@ -134,105 +130,78 @@
134
130
  ]
135
131
  }
136
132
  },
137
- "pf-t--global--background--color--glass--floating": {
133
+ "pf-t--global--background--color--primary--clicked": {
138
134
  "default": {
135
+ "description": "Use as the clicked state for primary backgrounds",
139
136
  "type": "color",
140
137
  "value": "#292929",
141
138
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
142
139
  "isSource": true,
143
140
  "original": {
141
+ "description": "Use as the clicked state for primary backgrounds",
144
142
  "type": "color",
145
- "value": "{global.background.color.floating.default}"
143
+ "value": "{global.dark.background.color.200}"
146
144
  },
147
- "name": "pf-t--global--background--color--glass--floating",
145
+ "name": "pf-t--global--background--color--primary--clicked",
148
146
  "attributes": {
149
147
  "category": "global",
150
148
  "type": "background",
151
149
  "item": "color",
152
- "subitem": "glass",
153
- "state": "floating"
150
+ "subitem": "primary",
151
+ "state": "clicked"
154
152
  },
155
153
  "path": [
156
154
  "global",
157
155
  "background",
158
156
  "color",
159
- "glass",
160
- "floating"
157
+ "primary",
158
+ "clicked"
161
159
  ],
162
160
  "references": [
163
161
  {
164
- "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
165
162
  "type": "color",
166
163
  "value": "#292929",
167
- "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
164
+ "filePath": "tokens/default/highcontrast-dark/base.dark.json",
168
165
  "isSource": true,
169
166
  "original": {
170
- "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
171
167
  "type": "color",
172
- "value": "{global.dark.background.color.200}"
168
+ "value": "{color.gray.80}"
173
169
  },
174
- "name": "pf-t--global--background--color--floating--default",
170
+ "name": "pf-t--global--dark--background--color--200",
175
171
  "attributes": {
176
172
  "category": "global",
177
- "type": "background",
178
- "item": "color",
179
- "subitem": "floating",
180
- "state": "default"
173
+ "type": "dark",
174
+ "item": "background",
175
+ "subitem": "color",
176
+ "state": "200"
181
177
  },
182
178
  "path": [
183
179
  "global",
180
+ "dark",
184
181
  "background",
185
182
  "color",
186
- "floating",
187
- "default"
183
+ "200"
188
184
  ],
189
185
  "references": [
190
186
  {
191
187
  "type": "color",
192
188
  "value": "#292929",
193
- "filePath": "tokens/default/highcontrast-dark/base.dark.json",
189
+ "filePath": "tokens/default/highcontrast-dark/palette.color.json",
194
190
  "isSource": true,
195
191
  "original": {
196
192
  "type": "color",
197
- "value": "{color.gray.80}"
193
+ "value": "#292929"
198
194
  },
199
- "name": "pf-t--global--dark--background--color--200",
195
+ "name": "pf-t--color--gray--80",
200
196
  "attributes": {
201
- "category": "global",
202
- "type": "dark",
203
- "item": "background",
204
- "subitem": "color",
205
- "state": "200"
197
+ "category": "color",
198
+ "type": "gray",
199
+ "item": "80"
206
200
  },
207
201
  "path": [
208
- "global",
209
- "dark",
210
- "background",
211
202
  "color",
212
- "200"
213
- ],
214
- "references": [
215
- {
216
- "type": "color",
217
- "value": "#292929",
218
- "filePath": "tokens/default/highcontrast-dark/palette.color.json",
219
- "isSource": true,
220
- "original": {
221
- "type": "color",
222
- "value": "#292929"
223
- },
224
- "name": "pf-t--color--gray--80",
225
- "attributes": {
226
- "category": "color",
227
- "type": "gray",
228
- "item": "80"
229
- },
230
- "path": [
231
- "color",
232
- "gray",
233
- "80"
234
- ]
235
- }
203
+ "gray",
204
+ "80"
236
205
  ]
237
206
  }
238
207
  ]
@@ -240,81 +209,110 @@
240
209
  ]
241
210
  }
242
211
  },
243
- "pf-t--global--background--color--primary--default": {
212
+ "pf-t--global--background--color--secondary--default": {
244
213
  "default": {
245
- "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
214
+ "description": "Use as the secondary background color for UI content Use as the primary background color for UI content such as cards, page sections, and other content areas. Secondary background color is also used for our UI shell backgrounds (nav, masthead, etc).",
246
215
  "type": "color",
247
- "value": "#000000",
216
+ "value": "#151515",
248
217
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
249
218
  "isSource": true,
250
219
  "original": {
251
- "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
220
+ "description": "Use as the secondary background color for UI content Use as the primary background color for UI content such as cards, page sections, and other content areas. Secondary background color is also used for our UI shell backgrounds (nav, masthead, etc).",
252
221
  "type": "color",
253
- "value": "{color.black}"
222
+ "value": "{global.dark.background.color.100}"
254
223
  },
255
- "name": "pf-t--global--background--color--primary--default",
224
+ "name": "pf-t--global--background--color--secondary--default",
256
225
  "attributes": {
257
226
  "category": "global",
258
227
  "type": "background",
259
228
  "item": "color",
260
- "subitem": "primary",
229
+ "subitem": "secondary",
261
230
  "state": "default"
262
231
  },
263
232
  "path": [
264
233
  "global",
265
234
  "background",
266
235
  "color",
267
- "primary",
236
+ "secondary",
268
237
  "default"
269
238
  ],
270
239
  "references": [
271
240
  {
272
241
  "type": "color",
273
- "value": "#000000",
274
- "filePath": "tokens/default/highcontrast-dark/palette.color.json",
242
+ "value": "#151515",
243
+ "filePath": "tokens/default/highcontrast-dark/base.dark.json",
275
244
  "isSource": true,
276
245
  "original": {
277
246
  "type": "color",
278
- "value": "#000000"
247
+ "value": "{color.gray.95}"
279
248
  },
280
- "name": "pf-t--color--black",
249
+ "name": "pf-t--global--dark--background--color--100",
281
250
  "attributes": {
282
- "category": "color",
283
- "type": "black"
251
+ "category": "global",
252
+ "type": "dark",
253
+ "item": "background",
254
+ "subitem": "color",
255
+ "state": "100"
284
256
  },
285
257
  "path": [
258
+ "global",
259
+ "dark",
260
+ "background",
286
261
  "color",
287
- "black"
262
+ "100"
263
+ ],
264
+ "references": [
265
+ {
266
+ "type": "color",
267
+ "value": "#151515",
268
+ "filePath": "tokens/default/highcontrast-dark/palette.color.json",
269
+ "isSource": true,
270
+ "original": {
271
+ "type": "color",
272
+ "value": "#151515"
273
+ },
274
+ "name": "pf-t--color--gray--95",
275
+ "attributes": {
276
+ "category": "color",
277
+ "type": "gray",
278
+ "item": "95"
279
+ },
280
+ "path": [
281
+ "color",
282
+ "gray",
283
+ "95"
284
+ ]
285
+ }
288
286
  ]
289
287
  }
290
288
  ]
291
289
  }
292
290
  },
293
- "pf-t--global--background--color--primary--hover": {
291
+ "pf-t--global--background--color--secondary--hover": {
294
292
  "default": {
295
- "description": "Use as the hover state for primary backgrounds",
293
+ "description": "Use as the hover state for secondary backgrounds",
296
294
  "type": "color",
297
295
  "value": "#292929",
298
296
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
299
297
  "isSource": true,
300
298
  "original": {
301
- "description": "Use as the hover state for primary backgrounds",
299
+ "description": "Use as the hover state for secondary backgrounds",
302
300
  "type": "color",
303
301
  "value": "{global.dark.background.color.200}"
304
302
  },
305
- "name": "pf-t--global--background--color--primary--hover",
303
+ "name": "pf-t--global--background--color--secondary--hover",
306
304
  "attributes": {
307
305
  "category": "global",
308
306
  "type": "background",
309
307
  "item": "color",
310
- "subitem": "primary",
308
+ "subitem": "secondary",
311
309
  "state": "hover"
312
310
  },
313
311
  "path": [
314
312
  "global",
315
313
  "background",
316
314
  "color",
317
- "primary",
315
+ "secondary",
318
316
  "hover"
319
317
  ],
320
318
  "references": [
@@ -369,31 +367,31 @@
369
367
  ]
370
368
  }
371
369
  },
372
- "pf-t--global--background--color--primary--clicked": {
370
+ "pf-t--global--background--color--secondary--clicked": {
373
371
  "default": {
374
- "description": "Use as the clicked state for primary backgrounds",
372
+ "description": "Use as the clicked state for secondary backgrounds",
375
373
  "type": "color",
376
374
  "value": "#292929",
377
375
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
378
376
  "isSource": true,
379
377
  "original": {
380
- "description": "Use as the clicked state for primary backgrounds",
378
+ "description": "Use as the clicked state for secondary backgrounds",
381
379
  "type": "color",
382
380
  "value": "{global.dark.background.color.200}"
383
381
  },
384
- "name": "pf-t--global--background--color--primary--clicked",
382
+ "name": "pf-t--global--background--color--secondary--clicked",
385
383
  "attributes": {
386
384
  "category": "global",
387
385
  "type": "background",
388
386
  "item": "color",
389
- "subitem": "primary",
387
+ "subitem": "secondary",
390
388
  "state": "clicked"
391
389
  },
392
390
  "path": [
393
391
  "global",
394
392
  "background",
395
393
  "color",
396
- "primary",
394
+ "secondary",
397
395
  "clicked"
398
396
  ],
399
397
  "references": [
@@ -448,78 +446,132 @@
448
446
  ]
449
447
  }
450
448
  },
451
- "pf-t--global--background--color--secondary--default": {
449
+ "pf-t--global--background--color--tertiary--default": {
452
450
  "default": {
453
- "description": "Use as the secondary background color for UI content Use as the primary background color for UI content such as cards, page sections, and other content areas. Secondary background color is also used for our UI shell backgrounds (nav, masthead, etc).",
451
+ "description": "Use as the tertiary background color. This is primarily used for containers that can be placed on secondary backgrounds.",
454
452
  "type": "color",
455
- "value": "#151515",
453
+ "value": "rgba(199, 199, 199, 0.1500)",
456
454
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
457
455
  "isSource": true,
458
456
  "original": {
459
- "description": "Use as the secondary background color for UI content Use as the primary background color for UI content such as cards, page sections, and other content areas. Secondary background color is also used for our UI shell backgrounds (nav, masthead, etc).",
457
+ "description": "Use as the tertiary background color. This is primarily used for containers that can be placed on secondary backgrounds.",
460
458
  "type": "color",
461
- "value": "{global.dark.background.color.100}"
459
+ "value": "{global.dark.background.color.600}"
462
460
  },
463
- "name": "pf-t--global--background--color--secondary--default",
461
+ "name": "pf-t--global--background--color--tertiary--default",
464
462
  "attributes": {
465
463
  "category": "global",
466
464
  "type": "background",
467
465
  "item": "color",
468
- "subitem": "secondary",
466
+ "subitem": "tertiary",
469
467
  "state": "default"
470
468
  },
471
469
  "path": [
472
470
  "global",
473
471
  "background",
474
472
  "color",
475
- "secondary",
473
+ "tertiary",
476
474
  "default"
477
475
  ],
478
476
  "references": [
479
477
  {
480
478
  "type": "color",
481
- "value": "#151515",
479
+ "value": "rgba(199, 199, 199, 0.1500)",
482
480
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
483
481
  "isSource": true,
484
482
  "original": {
485
483
  "type": "color",
486
- "value": "{color.gray.95}"
484
+ "value": "rgba(199, 199, 199, 0.1500)"
487
485
  },
488
- "name": "pf-t--global--dark--background--color--100",
486
+ "name": "pf-t--global--dark--background--color--600",
489
487
  "attributes": {
490
488
  "category": "global",
491
489
  "type": "dark",
492
490
  "item": "background",
493
491
  "subitem": "color",
494
- "state": "100"
492
+ "state": "600"
495
493
  },
496
494
  "path": [
497
495
  "global",
498
496
  "dark",
499
497
  "background",
500
498
  "color",
501
- "100"
499
+ "600"
500
+ ]
501
+ }
502
+ ]
503
+ }
504
+ },
505
+ "pf-t--global--background--color--glass--primary": {
506
+ "default": {
507
+ "type": "color",
508
+ "value": "#000000",
509
+ "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
510
+ "isSource": true,
511
+ "original": {
512
+ "type": "color",
513
+ "value": "{global.background.color.primary.default}"
514
+ },
515
+ "name": "pf-t--global--background--color--glass--primary",
516
+ "attributes": {
517
+ "category": "global",
518
+ "type": "background",
519
+ "item": "color",
520
+ "subitem": "glass",
521
+ "state": "primary"
522
+ },
523
+ "path": [
524
+ "global",
525
+ "background",
526
+ "color",
527
+ "glass",
528
+ "primary"
529
+ ],
530
+ "references": [
531
+ {
532
+ "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
533
+ "type": "color",
534
+ "value": "#000000",
535
+ "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
536
+ "isSource": true,
537
+ "original": {
538
+ "description": "Use as the primary background color for UI content such as cards, page sections, and other content areas.",
539
+ "type": "color",
540
+ "value": "{color.black}"
541
+ },
542
+ "name": "pf-t--global--background--color--primary--default",
543
+ "attributes": {
544
+ "category": "global",
545
+ "type": "background",
546
+ "item": "color",
547
+ "subitem": "primary",
548
+ "state": "default"
549
+ },
550
+ "path": [
551
+ "global",
552
+ "background",
553
+ "color",
554
+ "primary",
555
+ "default"
502
556
  ],
503
557
  "references": [
504
558
  {
505
559
  "type": "color",
506
- "value": "#151515",
560
+ "value": "#000000",
507
561
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
508
562
  "isSource": true,
509
563
  "original": {
510
564
  "type": "color",
511
- "value": "#151515"
565
+ "value": "#000000"
512
566
  },
513
- "name": "pf-t--color--gray--95",
567
+ "name": "pf-t--color--black",
514
568
  "attributes": {
515
569
  "category": "color",
516
- "type": "gray",
517
- "item": "95"
570
+ "type": "black"
518
571
  },
519
572
  "path": [
520
573
  "color",
521
- "gray",
522
- "95"
574
+ "black"
523
575
  ]
524
576
  }
525
577
  ]
@@ -527,78 +579,105 @@
527
579
  ]
528
580
  }
529
581
  },
530
- "pf-t--global--background--color--secondary--hover": {
582
+ "pf-t--global--background--color--glass--floating": {
531
583
  "default": {
532
- "description": "Use as the hover state for secondary backgrounds",
533
584
  "type": "color",
534
585
  "value": "#292929",
535
586
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
536
587
  "isSource": true,
537
588
  "original": {
538
- "description": "Use as the hover state for secondary backgrounds",
539
589
  "type": "color",
540
- "value": "{global.dark.background.color.200}"
590
+ "value": "{global.background.color.floating.default}"
541
591
  },
542
- "name": "pf-t--global--background--color--secondary--hover",
592
+ "name": "pf-t--global--background--color--glass--floating",
543
593
  "attributes": {
544
594
  "category": "global",
545
595
  "type": "background",
546
596
  "item": "color",
547
- "subitem": "secondary",
548
- "state": "hover"
597
+ "subitem": "glass",
598
+ "state": "floating"
549
599
  },
550
600
  "path": [
551
601
  "global",
552
602
  "background",
553
603
  "color",
554
- "secondary",
555
- "hover"
604
+ "glass",
605
+ "floating"
556
606
  ],
557
607
  "references": [
558
608
  {
609
+ "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
559
610
  "type": "color",
560
611
  "value": "#292929",
561
- "filePath": "tokens/default/highcontrast-dark/base.dark.json",
612
+ "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
562
613
  "isSource": true,
563
614
  "original": {
615
+ "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
564
616
  "type": "color",
565
- "value": "{color.gray.80}"
617
+ "value": "{global.dark.background.color.200}"
566
618
  },
567
- "name": "pf-t--global--dark--background--color--200",
619
+ "name": "pf-t--global--background--color--floating--default",
568
620
  "attributes": {
569
621
  "category": "global",
570
- "type": "dark",
571
- "item": "background",
572
- "subitem": "color",
573
- "state": "200"
622
+ "type": "background",
623
+ "item": "color",
624
+ "subitem": "floating",
625
+ "state": "default"
574
626
  },
575
627
  "path": [
576
628
  "global",
577
- "dark",
578
629
  "background",
579
630
  "color",
580
- "200"
631
+ "floating",
632
+ "default"
581
633
  ],
582
634
  "references": [
583
635
  {
584
636
  "type": "color",
585
637
  "value": "#292929",
586
- "filePath": "tokens/default/highcontrast-dark/palette.color.json",
638
+ "filePath": "tokens/default/highcontrast-dark/base.dark.json",
587
639
  "isSource": true,
588
640
  "original": {
589
641
  "type": "color",
590
- "value": "#292929"
642
+ "value": "{color.gray.80}"
591
643
  },
592
- "name": "pf-t--color--gray--80",
644
+ "name": "pf-t--global--dark--background--color--200",
593
645
  "attributes": {
594
- "category": "color",
595
- "type": "gray",
596
- "item": "80"
646
+ "category": "global",
647
+ "type": "dark",
648
+ "item": "background",
649
+ "subitem": "color",
650
+ "state": "200"
597
651
  },
598
652
  "path": [
653
+ "global",
654
+ "dark",
655
+ "background",
599
656
  "color",
600
- "gray",
601
- "80"
657
+ "200"
658
+ ],
659
+ "references": [
660
+ {
661
+ "type": "color",
662
+ "value": "#292929",
663
+ "filePath": "tokens/default/highcontrast-dark/palette.color.json",
664
+ "isSource": true,
665
+ "original": {
666
+ "type": "color",
667
+ "value": "#292929"
668
+ },
669
+ "name": "pf-t--color--gray--80",
670
+ "attributes": {
671
+ "category": "color",
672
+ "type": "gray",
673
+ "item": "80"
674
+ },
675
+ "path": [
676
+ "color",
677
+ "gray",
678
+ "80"
679
+ ]
680
+ }
602
681
  ]
603
682
  }
604
683
  ]
@@ -606,32 +685,32 @@
606
685
  ]
607
686
  }
608
687
  },
609
- "pf-t--global--background--color--secondary--clicked": {
688
+ "pf-t--global--background--color--floating--default": {
610
689
  "default": {
611
- "description": "Use as the clicked state for secondary backgrounds",
690
+ "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
612
691
  "type": "color",
613
692
  "value": "#292929",
614
693
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
615
694
  "isSource": true,
616
695
  "original": {
617
- "description": "Use as the clicked state for secondary backgrounds",
696
+ "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
618
697
  "type": "color",
619
698
  "value": "{global.dark.background.color.200}"
620
699
  },
621
- "name": "pf-t--global--background--color--secondary--clicked",
700
+ "name": "pf-t--global--background--color--floating--default",
622
701
  "attributes": {
623
702
  "category": "global",
624
703
  "type": "background",
625
704
  "item": "color",
626
- "subitem": "secondary",
627
- "state": "clicked"
705
+ "subitem": "floating",
706
+ "state": "default"
628
707
  },
629
708
  "path": [
630
709
  "global",
631
710
  "background",
632
711
  "color",
633
- "secondary",
634
- "clicked"
712
+ "floating",
713
+ "default"
635
714
  ],
636
715
  "references": [
637
716
  {
@@ -685,134 +764,78 @@
685
764
  ]
686
765
  }
687
766
  },
688
- "pf-t--global--background--color--tertiary--default": {
689
- "default": {
690
- "description": "Use as the tertiary background color. This is primarily used for containers that can be placed on secondary backgrounds.",
691
- "type": "color",
692
- "value": "rgba(199, 199, 199, 0.1500)",
693
- "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
694
- "isSource": true,
695
- "original": {
696
- "description": "Use as the tertiary background color. This is primarily used for containers that can be placed on secondary backgrounds.",
697
- "type": "color",
698
- "value": "{global.dark.background.color.600}"
699
- },
700
- "name": "pf-t--global--background--color--tertiary--default",
701
- "attributes": {
702
- "category": "global",
703
- "type": "background",
704
- "item": "color",
705
- "subitem": "tertiary",
706
- "state": "default"
707
- },
708
- "path": [
709
- "global",
710
- "background",
711
- "color",
712
- "tertiary",
713
- "default"
714
- ],
715
- "references": [
716
- {
717
- "type": "color",
718
- "value": "rgba(199, 199, 199, 0.1500)",
719
- "filePath": "tokens/default/highcontrast-dark/base.dark.json",
720
- "isSource": true,
721
- "original": {
722
- "type": "color",
723
- "value": "rgba(199, 199, 199, 0.1500)"
724
- },
725
- "name": "pf-t--global--dark--background--color--600",
726
- "attributes": {
727
- "category": "global",
728
- "type": "dark",
729
- "item": "background",
730
- "subitem": "color",
731
- "state": "600"
732
- },
733
- "path": [
734
- "global",
735
- "dark",
736
- "background",
737
- "color",
738
- "600"
739
- ]
740
- }
741
- ]
742
- }
743
- },
744
- "pf-t--global--background--color--floating--default": {
767
+ "pf-t--global--background--color--floating--hover": {
745
768
  "default": {
746
- "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
769
+ "description": "Use as the hover state for floating backgrounds",
747
770
  "type": "color",
748
- "value": "#292929",
771
+ "value": "#383838",
749
772
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
750
773
  "isSource": true,
751
774
  "original": {
752
- "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
775
+ "description": "Use as the hover state for floating backgrounds",
753
776
  "type": "color",
754
- "value": "{global.dark.background.color.200}"
777
+ "value": "{global.dark.background.color.300}"
755
778
  },
756
- "name": "pf-t--global--background--color--floating--default",
779
+ "name": "pf-t--global--background--color--floating--hover",
757
780
  "attributes": {
758
781
  "category": "global",
759
782
  "type": "background",
760
783
  "item": "color",
761
784
  "subitem": "floating",
762
- "state": "default"
785
+ "state": "hover"
763
786
  },
764
787
  "path": [
765
788
  "global",
766
789
  "background",
767
790
  "color",
768
791
  "floating",
769
- "default"
792
+ "hover"
770
793
  ],
771
794
  "references": [
772
795
  {
773
796
  "type": "color",
774
- "value": "#292929",
797
+ "value": "#383838",
775
798
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
776
799
  "isSource": true,
777
800
  "original": {
778
801
  "type": "color",
779
- "value": "{color.gray.80}"
802
+ "value": "{color.gray.70}"
780
803
  },
781
- "name": "pf-t--global--dark--background--color--200",
804
+ "name": "pf-t--global--dark--background--color--300",
782
805
  "attributes": {
783
806
  "category": "global",
784
807
  "type": "dark",
785
808
  "item": "background",
786
809
  "subitem": "color",
787
- "state": "200"
810
+ "state": "300"
788
811
  },
789
812
  "path": [
790
813
  "global",
791
814
  "dark",
792
815
  "background",
793
816
  "color",
794
- "200"
817
+ "300"
795
818
  ],
796
819
  "references": [
797
820
  {
798
821
  "type": "color",
799
- "value": "#292929",
822
+ "value": "#383838",
800
823
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
801
824
  "isSource": true,
802
825
  "original": {
803
826
  "type": "color",
804
- "value": "#292929"
827
+ "value": "#383838"
805
828
  },
806
- "name": "pf-t--color--gray--80",
829
+ "name": "pf-t--color--gray--70",
807
830
  "attributes": {
808
831
  "category": "color",
809
832
  "type": "gray",
810
- "item": "80"
833
+ "item": "70"
811
834
  },
812
835
  "path": [
813
836
  "color",
814
837
  "gray",
815
- "80"
838
+ "70"
816
839
  ]
817
840
  }
818
841
  ]
@@ -820,32 +843,32 @@
820
843
  ]
821
844
  }
822
845
  },
823
- "pf-t--global--background--color--floating--hover": {
846
+ "pf-t--global--background--color--floating--clicked": {
824
847
  "default": {
825
- "description": "Use as the hover state for floating backgrounds",
848
+ "description": "Use as the clicked state for floating backgrounds",
826
849
  "type": "color",
827
850
  "value": "#383838",
828
851
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
829
852
  "isSource": true,
830
853
  "original": {
831
- "description": "Use as the hover state for floating backgrounds",
854
+ "description": "Use as the clicked state for floating backgrounds",
832
855
  "type": "color",
833
856
  "value": "{global.dark.background.color.300}"
834
857
  },
835
- "name": "pf-t--global--background--color--floating--hover",
858
+ "name": "pf-t--global--background--color--floating--clicked",
836
859
  "attributes": {
837
860
  "category": "global",
838
861
  "type": "background",
839
862
  "item": "color",
840
863
  "subitem": "floating",
841
- "state": "hover"
864
+ "state": "clicked"
842
865
  },
843
866
  "path": [
844
867
  "global",
845
868
  "background",
846
869
  "color",
847
870
  "floating",
848
- "hover"
871
+ "clicked"
849
872
  ],
850
873
  "references": [
851
874
  {
@@ -899,78 +922,78 @@
899
922
  ]
900
923
  }
901
924
  },
902
- "pf-t--global--background--color--floating--clicked": {
925
+ "pf-t--global--background--color--sticky--default": {
903
926
  "default": {
904
- "description": "Use as the clicked state for floating backgrounds",
927
+ "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
905
928
  "type": "color",
906
- "value": "#383838",
929
+ "value": "#292929",
907
930
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
908
931
  "isSource": true,
909
932
  "original": {
910
- "description": "Use as the clicked state for floating backgrounds",
933
+ "description": "Use as the background color for components that appear over other content, such as toast alerts, menus, modals, overlay drawers, etc.",
911
934
  "type": "color",
912
- "value": "{global.dark.background.color.300}"
935
+ "value": "{global.dark.background.color.200}"
913
936
  },
914
- "name": "pf-t--global--background--color--floating--clicked",
937
+ "name": "pf-t--global--background--color--sticky--default",
915
938
  "attributes": {
916
939
  "category": "global",
917
940
  "type": "background",
918
941
  "item": "color",
919
- "subitem": "floating",
920
- "state": "clicked"
942
+ "subitem": "sticky",
943
+ "state": "default"
921
944
  },
922
945
  "path": [
923
946
  "global",
924
947
  "background",
925
948
  "color",
926
- "floating",
927
- "clicked"
949
+ "sticky",
950
+ "default"
928
951
  ],
929
952
  "references": [
930
953
  {
931
954
  "type": "color",
932
- "value": "#383838",
955
+ "value": "#292929",
933
956
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
934
957
  "isSource": true,
935
958
  "original": {
936
959
  "type": "color",
937
- "value": "{color.gray.70}"
960
+ "value": "{color.gray.80}"
938
961
  },
939
- "name": "pf-t--global--dark--background--color--300",
962
+ "name": "pf-t--global--dark--background--color--200",
940
963
  "attributes": {
941
964
  "category": "global",
942
965
  "type": "dark",
943
966
  "item": "background",
944
967
  "subitem": "color",
945
- "state": "300"
968
+ "state": "200"
946
969
  },
947
970
  "path": [
948
971
  "global",
949
972
  "dark",
950
973
  "background",
951
974
  "color",
952
- "300"
975
+ "200"
953
976
  ],
954
977
  "references": [
955
978
  {
956
979
  "type": "color",
957
- "value": "#383838",
980
+ "value": "#292929",
958
981
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
959
982
  "isSource": true,
960
983
  "original": {
961
984
  "type": "color",
962
- "value": "#383838"
985
+ "value": "#292929"
963
986
  },
964
- "name": "pf-t--color--gray--70",
987
+ "name": "pf-t--color--gray--80",
965
988
  "attributes": {
966
989
  "category": "color",
967
990
  "type": "gray",
968
- "item": "70"
991
+ "item": "80"
969
992
  },
970
993
  "path": [
971
994
  "color",
972
995
  "gray",
973
- "70"
996
+ "80"
974
997
  ]
975
998
  }
976
999
  ]
@@ -2082,56 +2105,58 @@
2082
2105
  ]
2083
2106
  }
2084
2107
  },
2085
- "pf-t--global--background--opacity--glass--primary": {
2108
+ "pf-t--global--background--filter--glass--blur--primary": {
2086
2109
  "default": {
2087
2110
  "type": "number",
2088
- "value": "100%",
2111
+ "value": "blur(0px)",
2089
2112
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
2090
2113
  "isSource": true,
2091
2114
  "original": {
2092
2115
  "type": "number",
2093
- "value": 100
2116
+ "value": 0
2094
2117
  },
2095
- "name": "pf-t--global--background--opacity--glass--primary",
2118
+ "name": "pf-t--global--background--filter--glass--blur--primary",
2096
2119
  "attributes": {
2097
2120
  "category": "global",
2098
2121
  "type": "background",
2099
- "item": "opacity",
2122
+ "item": "filter",
2100
2123
  "subitem": "glass",
2101
- "state": "primary"
2124
+ "state": "blur"
2102
2125
  },
2103
2126
  "path": [
2104
2127
  "global",
2105
2128
  "background",
2106
- "opacity",
2129
+ "filter",
2107
2130
  "glass",
2131
+ "blur",
2108
2132
  "primary"
2109
2133
  ]
2110
2134
  }
2111
2135
  },
2112
- "pf-t--global--background--opacity--glass--floating": {
2136
+ "pf-t--global--background--filter--glass--blur--floating": {
2113
2137
  "default": {
2114
2138
  "type": "number",
2115
- "value": "100%",
2139
+ "value": "blur(0px)",
2116
2140
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
2117
2141
  "isSource": true,
2118
2142
  "original": {
2119
2143
  "type": "number",
2120
- "value": 100
2144
+ "value": 0
2121
2145
  },
2122
- "name": "pf-t--global--background--opacity--glass--floating",
2146
+ "name": "pf-t--global--background--filter--glass--blur--floating",
2123
2147
  "attributes": {
2124
2148
  "category": "global",
2125
2149
  "type": "background",
2126
- "item": "opacity",
2150
+ "item": "filter",
2127
2151
  "subitem": "glass",
2128
- "state": "floating"
2152
+ "state": "blur"
2129
2153
  },
2130
2154
  "path": [
2131
2155
  "global",
2132
2156
  "background",
2133
- "opacity",
2157
+ "filter",
2134
2158
  "glass",
2159
+ "blur",
2135
2160
  "floating"
2136
2161
  ]
2137
2162
  }
@@ -7303,7 +7328,7 @@
7303
7328
  "default": {
7304
7329
  "description": "Use as the color for icons that convey your brand and/or are paired with branded text color.",
7305
7330
  "type": "color",
7306
- "value": "#f9a8a8",
7331
+ "value": "#ffffff",
7307
7332
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
7308
7333
  "isSource": true,
7309
7334
  "original": {
@@ -7331,13 +7356,13 @@
7331
7356
  {
7332
7357
  "description": "Use this color for elements that you want to reinforce your brand",
7333
7358
  "type": "color",
7334
- "value": "#f9a8a8",
7359
+ "value": "#ffffff",
7335
7360
  "filePath": "tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json",
7336
7361
  "isSource": true,
7337
7362
  "original": {
7338
7363
  "description": "Use this color for elements that you want to reinforce your brand",
7339
7364
  "type": "color",
7340
- "value": "{global.dark.color.brand.accent.300}"
7365
+ "value": "{global.dark.color.brand.accent.400}"
7341
7366
  },
7342
7367
  "name": "pf-t--global--color--brand--accent--default",
7343
7368
  "attributes": {
@@ -7357,14 +7382,14 @@
7357
7382
  "references": [
7358
7383
  {
7359
7384
  "type": "color",
7360
- "value": "#f9a8a8",
7385
+ "value": "#ffffff",
7361
7386
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
7362
7387
  "isSource": true,
7363
7388
  "original": {
7364
7389
  "type": "color",
7365
- "value": "{color.red.30}"
7390
+ "value": "{color.white}"
7366
7391
  },
7367
- "name": "pf-t--global--dark--color--brand--accent--300",
7392
+ "name": "pf-t--global--dark--color--brand--accent--400",
7368
7393
  "attributes": {
7369
7394
  "category": "global",
7370
7395
  "type": "dark",
@@ -7378,28 +7403,26 @@
7378
7403
  "color",
7379
7404
  "brand",
7380
7405
  "accent",
7381
- "300"
7406
+ "400"
7382
7407
  ],
7383
7408
  "references": [
7384
7409
  {
7385
7410
  "type": "color",
7386
- "value": "#f9a8a8",
7411
+ "value": "#ffffff",
7387
7412
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
7388
7413
  "isSource": true,
7389
7414
  "original": {
7390
7415
  "type": "color",
7391
- "value": "#f9a8a8"
7416
+ "value": "#ffffff"
7392
7417
  },
7393
- "name": "pf-t--color--red--30",
7418
+ "name": "pf-t--color--white",
7394
7419
  "attributes": {
7395
7420
  "category": "color",
7396
- "type": "red",
7397
- "item": "30"
7421
+ "type": "white"
7398
7422
  },
7399
7423
  "path": [
7400
7424
  "color",
7401
- "red",
7402
- "30"
7425
+ "white"
7403
7426
  ]
7404
7427
  }
7405
7428
  ]
@@ -7413,7 +7436,7 @@
7413
7436
  "default": {
7414
7437
  "description": "Use as the hover state color for icons that convey your brand and/or are paired with branded text color.",
7415
7438
  "type": "color",
7416
- "value": "#fbc5c5",
7439
+ "value": "#e0e0e0",
7417
7440
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
7418
7441
  "isSource": true,
7419
7442
  "original": {
@@ -7441,7 +7464,7 @@
7441
7464
  {
7442
7465
  "description": "Use as the hover state for elements that have a branded background color",
7443
7466
  "type": "color",
7444
- "value": "#fbc5c5",
7467
+ "value": "#e0e0e0",
7445
7468
  "filePath": "tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json",
7446
7469
  "isSource": true,
7447
7470
  "original": {
@@ -7467,12 +7490,12 @@
7467
7490
  "references": [
7468
7491
  {
7469
7492
  "type": "color",
7470
- "value": "#fbc5c5",
7493
+ "value": "#e0e0e0",
7471
7494
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
7472
7495
  "isSource": true,
7473
7496
  "original": {
7474
7497
  "type": "color",
7475
- "value": "{color.red.20}"
7498
+ "value": "{color.gray.20}"
7476
7499
  },
7477
7500
  "name": "pf-t--global--dark--color--brand--accent--350",
7478
7501
  "attributes": {
@@ -7493,22 +7516,22 @@
7493
7516
  "references": [
7494
7517
  {
7495
7518
  "type": "color",
7496
- "value": "#fbc5c5",
7519
+ "value": "#e0e0e0",
7497
7520
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
7498
7521
  "isSource": true,
7499
7522
  "original": {
7500
7523
  "type": "color",
7501
- "value": "#fbc5c5"
7524
+ "value": "#e0e0e0"
7502
7525
  },
7503
- "name": "pf-t--color--red--20",
7526
+ "name": "pf-t--color--gray--20",
7504
7527
  "attributes": {
7505
7528
  "category": "color",
7506
- "type": "red",
7529
+ "type": "gray",
7507
7530
  "item": "20"
7508
7531
  },
7509
7532
  "path": [
7510
7533
  "color",
7511
- "red",
7534
+ "gray",
7512
7535
  "20"
7513
7536
  ]
7514
7537
  }
@@ -7523,7 +7546,7 @@
7523
7546
  "default": {
7524
7547
  "description": "Use as the clicked state for icons that convey your brand and/or are paired with branded text color.",
7525
7548
  "type": "color",
7526
- "value": "#fbc5c5",
7549
+ "value": "#e0e0e0",
7527
7550
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
7528
7551
  "isSource": true,
7529
7552
  "original": {
@@ -7551,7 +7574,7 @@
7551
7574
  {
7552
7575
  "description": "Use as the clicked state for elements that have a brand background color",
7553
7576
  "type": "color",
7554
- "value": "#fbc5c5",
7577
+ "value": "#e0e0e0",
7555
7578
  "filePath": "tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json",
7556
7579
  "isSource": true,
7557
7580
  "original": {
@@ -7577,12 +7600,12 @@
7577
7600
  "references": [
7578
7601
  {
7579
7602
  "type": "color",
7580
- "value": "#fbc5c5",
7603
+ "value": "#e0e0e0",
7581
7604
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
7582
7605
  "isSource": true,
7583
7606
  "original": {
7584
7607
  "type": "color",
7585
- "value": "{color.red.20}"
7608
+ "value": "{color.gray.20}"
7586
7609
  },
7587
7610
  "name": "pf-t--global--dark--color--brand--accent--350",
7588
7611
  "attributes": {
@@ -7603,22 +7626,22 @@
7603
7626
  "references": [
7604
7627
  {
7605
7628
  "type": "color",
7606
- "value": "#fbc5c5",
7629
+ "value": "#e0e0e0",
7607
7630
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
7608
7631
  "isSource": true,
7609
7632
  "original": {
7610
7633
  "type": "color",
7611
- "value": "#fbc5c5"
7634
+ "value": "#e0e0e0"
7612
7635
  },
7613
- "name": "pf-t--color--red--20",
7636
+ "name": "pf-t--color--gray--20",
7614
7637
  "attributes": {
7615
7638
  "category": "color",
7616
- "type": "red",
7639
+ "type": "gray",
7617
7640
  "item": "20"
7618
7641
  },
7619
7642
  "path": [
7620
7643
  "color",
7621
- "red",
7644
+ "gray",
7622
7645
  "20"
7623
7646
  ]
7624
7647
  }
@@ -16650,7 +16673,7 @@
16650
16673
  "pf-t--global--border--color--control--read-only": {
16651
16674
  "default": {
16652
16675
  "type": "color",
16653
- "value": "#383838",
16676
+ "value": "#4d4d4d",
16654
16677
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
16655
16678
  "isSource": true,
16656
16679
  "original": {
@@ -16675,12 +16698,12 @@
16675
16698
  "references": [
16676
16699
  {
16677
16700
  "type": "color",
16678
- "value": "#383838",
16701
+ "value": "#4d4d4d",
16679
16702
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
16680
16703
  "isSource": true,
16681
16704
  "original": {
16682
16705
  "type": "color",
16683
- "value": "{color.gray.70}"
16706
+ "value": "{color.gray.60}"
16684
16707
  },
16685
16708
  "name": "pf-t--global--dark--border--color--50",
16686
16709
  "attributes": {
@@ -16700,23 +16723,23 @@
16700
16723
  "references": [
16701
16724
  {
16702
16725
  "type": "color",
16703
- "value": "#383838",
16726
+ "value": "#4d4d4d",
16704
16727
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
16705
16728
  "isSource": true,
16706
16729
  "original": {
16707
16730
  "type": "color",
16708
- "value": "#383838"
16731
+ "value": "#4d4d4d"
16709
16732
  },
16710
- "name": "pf-t--color--gray--70",
16733
+ "name": "pf-t--color--gray--60",
16711
16734
  "attributes": {
16712
16735
  "category": "color",
16713
16736
  "type": "gray",
16714
- "item": "70"
16737
+ "item": "60"
16715
16738
  },
16716
16739
  "path": [
16717
16740
  "color",
16718
16741
  "gray",
16719
- "70"
16742
+ "60"
16720
16743
  ]
16721
16744
  }
16722
16745
  ]
@@ -30688,7 +30711,7 @@
30688
30711
  "default": {
30689
30712
  "description": "Use as the color of small box-shadows.",
30690
30713
  "type": "color",
30691
- "value": "rgba(0, 0, 0, 0.7000)",
30714
+ "value": "rgba(0, 0, 0, 0.6000)",
30692
30715
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
30693
30716
  "isSource": true,
30694
30717
  "original": {
@@ -30714,12 +30737,12 @@
30714
30737
  "references": [
30715
30738
  {
30716
30739
  "type": "color",
30717
- "value": "rgba(0, 0, 0, 0.7000)",
30740
+ "value": "rgba(0, 0, 0, 0.6000)",
30718
30741
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
30719
30742
  "isSource": true,
30720
30743
  "original": {
30721
30744
  "type": "color",
30722
- "value": "rgba(0, 0, 0, 0.7000)"
30745
+ "value": "rgba(0, 0, 0, 0.6000)"
30723
30746
  },
30724
30747
  "name": "pf-t--global--dark--box-shadow--color--200",
30725
30748
  "attributes": {
@@ -30800,7 +30823,7 @@
30800
30823
  "default": {
30801
30824
  "description": "Use as the color of medium box-shadows.",
30802
30825
  "type": "color",
30803
- "value": "rgba(0, 0, 0, 0.7000)",
30826
+ "value": "rgba(0, 0, 0, 0.6000)",
30804
30827
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
30805
30828
  "isSource": true,
30806
30829
  "original": {
@@ -30826,12 +30849,12 @@
30826
30849
  "references": [
30827
30850
  {
30828
30851
  "type": "color",
30829
- "value": "rgba(0, 0, 0, 0.7000)",
30852
+ "value": "rgba(0, 0, 0, 0.6000)",
30830
30853
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
30831
30854
  "isSource": true,
30832
30855
  "original": {
30833
30856
  "type": "color",
30834
- "value": "rgba(0, 0, 0, 0.7000)"
30857
+ "value": "rgba(0, 0, 0, 0.6000)"
30835
30858
  },
30836
30859
  "name": "pf-t--global--dark--box-shadow--color--200",
30837
30860
  "attributes": {
@@ -30912,7 +30935,7 @@
30912
30935
  "default": {
30913
30936
  "description": "Use as the color of large box-shadows.",
30914
30937
  "type": "color",
30915
- "value": "rgba(0, 0, 0, 0.7000)",
30938
+ "value": "rgba(0, 0, 0, 0.6000)",
30916
30939
  "filePath": "tokens/default/highcontrast-dark/semantic.highcontrast.dark.json",
30917
30940
  "isSource": true,
30918
30941
  "original": {
@@ -30938,12 +30961,12 @@
30938
30961
  "references": [
30939
30962
  {
30940
30963
  "type": "color",
30941
- "value": "rgba(0, 0, 0, 0.7000)",
30964
+ "value": "rgba(0, 0, 0, 0.6000)",
30942
30965
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
30943
30966
  "isSource": true,
30944
30967
  "original": {
30945
30968
  "type": "color",
30946
- "value": "rgba(0, 0, 0, 0.7000)"
30969
+ "value": "rgba(0, 0, 0, 0.6000)"
30947
30970
  },
30948
30971
  "name": "pf-t--global--dark--box-shadow--color--200",
30949
30972
  "attributes": {
@@ -31888,12 +31911,12 @@
31888
31911
  "pf-t--global--dark--color--brand--accent--200": {
31889
31912
  "default": {
31890
31913
  "type": "color",
31891
- "value": "#f56e6e",
31914
+ "value": "#a60000",
31892
31915
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
31893
31916
  "isSource": true,
31894
31917
  "original": {
31895
31918
  "type": "color",
31896
- "value": "{color.red.40}"
31919
+ "value": "{color.red.60}"
31897
31920
  },
31898
31921
  "name": "pf-t--global--dark--color--brand--accent--200",
31899
31922
  "attributes": {
@@ -31914,23 +31937,23 @@
31914
31937
  "references": [
31915
31938
  {
31916
31939
  "type": "color",
31917
- "value": "#f56e6e",
31940
+ "value": "#a60000",
31918
31941
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
31919
31942
  "isSource": true,
31920
31943
  "original": {
31921
31944
  "type": "color",
31922
- "value": "#f56e6e"
31945
+ "value": "#a60000"
31923
31946
  },
31924
- "name": "pf-t--color--red--40",
31947
+ "name": "pf-t--color--red--60",
31925
31948
  "attributes": {
31926
31949
  "category": "color",
31927
31950
  "type": "red",
31928
- "item": "40"
31951
+ "item": "60"
31929
31952
  },
31930
31953
  "path": [
31931
31954
  "color",
31932
31955
  "red",
31933
- "40"
31956
+ "60"
31934
31957
  ]
31935
31958
  }
31936
31959
  ]
@@ -31939,12 +31962,12 @@
31939
31962
  "pf-t--global--dark--color--brand--accent--300": {
31940
31963
  "default": {
31941
31964
  "type": "color",
31942
- "value": "#f9a8a8",
31965
+ "value": "#f56e6e",
31943
31966
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
31944
31967
  "isSource": true,
31945
31968
  "original": {
31946
31969
  "type": "color",
31947
- "value": "{color.red.30}"
31970
+ "value": "{color.red.40}"
31948
31971
  },
31949
31972
  "name": "pf-t--global--dark--color--brand--accent--300",
31950
31973
  "attributes": {
@@ -31965,23 +31988,23 @@
31965
31988
  "references": [
31966
31989
  {
31967
31990
  "type": "color",
31968
- "value": "#f9a8a8",
31991
+ "value": "#f56e6e",
31969
31992
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
31970
31993
  "isSource": true,
31971
31994
  "original": {
31972
31995
  "type": "color",
31973
- "value": "#f9a8a8"
31996
+ "value": "#f56e6e"
31974
31997
  },
31975
- "name": "pf-t--color--red--30",
31998
+ "name": "pf-t--color--red--40",
31976
31999
  "attributes": {
31977
32000
  "category": "color",
31978
32001
  "type": "red",
31979
- "item": "30"
32002
+ "item": "40"
31980
32003
  },
31981
32004
  "path": [
31982
32005
  "color",
31983
32006
  "red",
31984
- "30"
32007
+ "40"
31985
32008
  ]
31986
32009
  }
31987
32010
  ]
@@ -31990,12 +32013,12 @@
31990
32013
  "pf-t--global--dark--color--brand--accent--350": {
31991
32014
  "default": {
31992
32015
  "type": "color",
31993
- "value": "#fbc5c5",
32016
+ "value": "#e0e0e0",
31994
32017
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
31995
32018
  "isSource": true,
31996
32019
  "original": {
31997
32020
  "type": "color",
31998
- "value": "{color.red.20}"
32021
+ "value": "{color.gray.20}"
31999
32022
  },
32000
32023
  "name": "pf-t--global--dark--color--brand--accent--350",
32001
32024
  "attributes": {
@@ -32016,22 +32039,22 @@
32016
32039
  "references": [
32017
32040
  {
32018
32041
  "type": "color",
32019
- "value": "#fbc5c5",
32042
+ "value": "#e0e0e0",
32020
32043
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
32021
32044
  "isSource": true,
32022
32045
  "original": {
32023
32046
  "type": "color",
32024
- "value": "#fbc5c5"
32047
+ "value": "#e0e0e0"
32025
32048
  },
32026
- "name": "pf-t--color--red--20",
32049
+ "name": "pf-t--color--gray--20",
32027
32050
  "attributes": {
32028
32051
  "category": "color",
32029
- "type": "red",
32052
+ "type": "gray",
32030
32053
  "item": "20"
32031
32054
  },
32032
32055
  "path": [
32033
32056
  "color",
32034
- "red",
32057
+ "gray",
32035
32058
  "20"
32036
32059
  ]
32037
32060
  }
@@ -35093,12 +35116,12 @@
35093
35116
  "pf-t--global--dark--border--color--50": {
35094
35117
  "default": {
35095
35118
  "type": "color",
35096
- "value": "#383838",
35119
+ "value": "#4d4d4d",
35097
35120
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
35098
35121
  "isSource": true,
35099
35122
  "original": {
35100
35123
  "type": "color",
35101
- "value": "{color.gray.70}"
35124
+ "value": "{color.gray.60}"
35102
35125
  },
35103
35126
  "name": "pf-t--global--dark--border--color--50",
35104
35127
  "attributes": {
@@ -35118,23 +35141,23 @@
35118
35141
  "references": [
35119
35142
  {
35120
35143
  "type": "color",
35121
- "value": "#383838",
35144
+ "value": "#4d4d4d",
35122
35145
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
35123
35146
  "isSource": true,
35124
35147
  "original": {
35125
35148
  "type": "color",
35126
- "value": "#383838"
35149
+ "value": "#4d4d4d"
35127
35150
  },
35128
- "name": "pf-t--color--gray--70",
35151
+ "name": "pf-t--color--gray--60",
35129
35152
  "attributes": {
35130
35153
  "category": "color",
35131
35154
  "type": "gray",
35132
- "item": "70"
35155
+ "item": "60"
35133
35156
  },
35134
35157
  "path": [
35135
35158
  "color",
35136
35159
  "gray",
35137
- "70"
35160
+ "60"
35138
35161
  ]
35139
35162
  }
35140
35163
  ]
@@ -35872,12 +35895,12 @@
35872
35895
  "pf-t--global--dark--box-shadow--color--200": {
35873
35896
  "default": {
35874
35897
  "type": "color",
35875
- "value": "rgba(0, 0, 0, 0.7000)",
35898
+ "value": "rgba(0, 0, 0, 0.6000)",
35876
35899
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
35877
35900
  "isSource": true,
35878
35901
  "original": {
35879
35902
  "type": "color",
35880
- "value": "rgba(0, 0, 0, 0.7000)"
35903
+ "value": "rgba(0, 0, 0, 0.6000)"
35881
35904
  },
35882
35905
  "name": "pf-t--global--dark--box-shadow--color--200",
35883
35906
  "attributes": {
@@ -35955,13 +35978,13 @@
35955
35978
  "redhat": {
35956
35979
  "description": "Use this color for elements that you want to reinforce your brand",
35957
35980
  "type": "color",
35958
- "value": "#f9a8a8",
35981
+ "value": "#ffffff",
35959
35982
  "filePath": "tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json",
35960
35983
  "isSource": true,
35961
35984
  "original": {
35962
35985
  "description": "Use this color for elements that you want to reinforce your brand",
35963
35986
  "type": "color",
35964
- "value": "{global.dark.color.brand.accent.300}"
35987
+ "value": "{global.dark.color.brand.accent.400}"
35965
35988
  },
35966
35989
  "name": "pf-t--global--color--brand--accent--default",
35967
35990
  "attributes": {
@@ -35981,14 +36004,14 @@
35981
36004
  "references": [
35982
36005
  {
35983
36006
  "type": "color",
35984
- "value": "#f9a8a8",
36007
+ "value": "#ffffff",
35985
36008
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
35986
36009
  "isSource": true,
35987
36010
  "original": {
35988
36011
  "type": "color",
35989
- "value": "{color.red.30}"
36012
+ "value": "{color.white}"
35990
36013
  },
35991
- "name": "pf-t--global--dark--color--brand--accent--300",
36014
+ "name": "pf-t--global--dark--color--brand--accent--400",
35992
36015
  "attributes": {
35993
36016
  "category": "global",
35994
36017
  "type": "dark",
@@ -36002,28 +36025,26 @@
36002
36025
  "color",
36003
36026
  "brand",
36004
36027
  "accent",
36005
- "300"
36028
+ "400"
36006
36029
  ],
36007
36030
  "references": [
36008
36031
  {
36009
36032
  "type": "color",
36010
- "value": "#f9a8a8",
36033
+ "value": "#ffffff",
36011
36034
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
36012
36035
  "isSource": true,
36013
36036
  "original": {
36014
36037
  "type": "color",
36015
- "value": "#f9a8a8"
36038
+ "value": "#ffffff"
36016
36039
  },
36017
- "name": "pf-t--color--red--30",
36040
+ "name": "pf-t--color--white",
36018
36041
  "attributes": {
36019
36042
  "category": "color",
36020
- "type": "red",
36021
- "item": "30"
36043
+ "type": "white"
36022
36044
  },
36023
36045
  "path": [
36024
36046
  "color",
36025
- "red",
36026
- "30"
36047
+ "white"
36027
36048
  ]
36028
36049
  }
36029
36050
  ]
@@ -36035,7 +36056,7 @@
36035
36056
  "redhat": {
36036
36057
  "description": "Use as the hover state for elements that have a branded background color",
36037
36058
  "type": "color",
36038
- "value": "#fbc5c5",
36059
+ "value": "#e0e0e0",
36039
36060
  "filePath": "tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json",
36040
36061
  "isSource": true,
36041
36062
  "original": {
@@ -36061,12 +36082,12 @@
36061
36082
  "references": [
36062
36083
  {
36063
36084
  "type": "color",
36064
- "value": "#fbc5c5",
36085
+ "value": "#e0e0e0",
36065
36086
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
36066
36087
  "isSource": true,
36067
36088
  "original": {
36068
36089
  "type": "color",
36069
- "value": "{color.red.20}"
36090
+ "value": "{color.gray.20}"
36070
36091
  },
36071
36092
  "name": "pf-t--global--dark--color--brand--accent--350",
36072
36093
  "attributes": {
@@ -36087,22 +36108,22 @@
36087
36108
  "references": [
36088
36109
  {
36089
36110
  "type": "color",
36090
- "value": "#fbc5c5",
36111
+ "value": "#e0e0e0",
36091
36112
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
36092
36113
  "isSource": true,
36093
36114
  "original": {
36094
36115
  "type": "color",
36095
- "value": "#fbc5c5"
36116
+ "value": "#e0e0e0"
36096
36117
  },
36097
- "name": "pf-t--color--red--20",
36118
+ "name": "pf-t--color--gray--20",
36098
36119
  "attributes": {
36099
36120
  "category": "color",
36100
- "type": "red",
36121
+ "type": "gray",
36101
36122
  "item": "20"
36102
36123
  },
36103
36124
  "path": [
36104
36125
  "color",
36105
- "red",
36126
+ "gray",
36106
36127
  "20"
36107
36128
  ]
36108
36129
  }
@@ -36115,7 +36136,7 @@
36115
36136
  "redhat": {
36116
36137
  "description": "Use as the clicked state for elements that have a brand background color",
36117
36138
  "type": "color",
36118
- "value": "#fbc5c5",
36139
+ "value": "#e0e0e0",
36119
36140
  "filePath": "tokens/redhat/highcontrast-dark/redhat.color.highcontrast.dark.json",
36120
36141
  "isSource": true,
36121
36142
  "original": {
@@ -36141,12 +36162,12 @@
36141
36162
  "references": [
36142
36163
  {
36143
36164
  "type": "color",
36144
- "value": "#fbc5c5",
36165
+ "value": "#e0e0e0",
36145
36166
  "filePath": "tokens/default/highcontrast-dark/base.dark.json",
36146
36167
  "isSource": true,
36147
36168
  "original": {
36148
36169
  "type": "color",
36149
- "value": "{color.red.20}"
36170
+ "value": "{color.gray.20}"
36150
36171
  },
36151
36172
  "name": "pf-t--global--dark--color--brand--accent--350",
36152
36173
  "attributes": {
@@ -36167,22 +36188,22 @@
36167
36188
  "references": [
36168
36189
  {
36169
36190
  "type": "color",
36170
- "value": "#fbc5c5",
36191
+ "value": "#e0e0e0",
36171
36192
  "filePath": "tokens/default/highcontrast-dark/palette.color.json",
36172
36193
  "isSource": true,
36173
36194
  "original": {
36174
36195
  "type": "color",
36175
- "value": "#fbc5c5"
36196
+ "value": "#e0e0e0"
36176
36197
  },
36177
- "name": "pf-t--color--red--20",
36198
+ "name": "pf-t--color--gray--20",
36178
36199
  "attributes": {
36179
36200
  "category": "color",
36180
- "type": "red",
36201
+ "type": "gray",
36181
36202
  "item": "20"
36182
36203
  },
36183
36204
  "path": [
36184
36205
  "color",
36185
- "red",
36206
+ "gray",
36186
36207
  "20"
36187
36208
  ]
36188
36209
  }