@skbkontur/colors 1.1.2-34230.0 → 1.1.2-6463e.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 (125) hide show
  1. package/dist/cjs/get-base-tokens.d.ts +9 -7
  2. package/dist/cjs/get-base-tokens.js +77 -102
  3. package/dist/cjs/get-default-tokens.d.ts +98 -78
  4. package/dist/cjs/get-default-tokens.js +197 -177
  5. package/dist/cjs/helpers/get-palette.js +58 -64
  6. package/dist/cjs/helpers/get-promo.js +21 -27
  7. package/dist/cjs/types/base-tokens.d.ts +4 -4
  8. package/dist/cjs/utils/format-variable.d.ts +2 -0
  9. package/dist/cjs/utils/format-variable.js +11 -0
  10. package/dist/esm/get-base-tokens.d.ts +9 -7
  11. package/dist/esm/get-base-tokens.js +75 -96
  12. package/dist/esm/get-default-tokens.d.ts +98 -78
  13. package/dist/esm/get-default-tokens.js +197 -177
  14. package/dist/esm/helpers/get-palette.js +58 -64
  15. package/dist/esm/helpers/get-promo.js +21 -27
  16. package/dist/esm/types/base-tokens.d.ts +4 -4
  17. package/dist/esm/utils/format-variable.d.ts +2 -0
  18. package/dist/esm/utils/format-variable.js +6 -0
  19. package/dist/tokens/base/css/brand-blue-deep_accent-gray.css +1 -7
  20. package/dist/tokens/base/css/brand-blue_accent-gray.css +1 -7
  21. package/dist/tokens/base/css/brand-green_accent-gray.css +1 -7
  22. package/dist/tokens/base/css/brand-mint_accent-gray.css +1 -7
  23. package/dist/tokens/base/css/brand-orange_accent-gray.css +1 -7
  24. package/dist/tokens/base/css/brand-purple_accent-gray.css +1 -7
  25. package/dist/tokens/base/css/brand-red_accent-gray.css +1 -7
  26. package/dist/tokens/base/css/brand-violet_accent-gray.css +1 -7
  27. package/dist/tokens/base/js/brand-blue-deep_accent-gray.js +0 -6
  28. package/dist/tokens/base/js/brand-blue_accent-gray.js +0 -6
  29. package/dist/tokens/base/js/brand-green_accent-gray.js +0 -6
  30. package/dist/tokens/base/js/brand-mint_accent-gray.js +0 -6
  31. package/dist/tokens/base/js/brand-orange_accent-gray.js +0 -6
  32. package/dist/tokens/base/js/brand-purple_accent-gray.js +0 -6
  33. package/dist/tokens/base/js/brand-red_accent-gray.js +0 -6
  34. package/dist/tokens/base/js/brand-violet_accent-gray.js +0 -6
  35. package/dist/tokens/base/js-tree/brand-blue-deep_accent-gray.tree.js +0 -16
  36. package/dist/tokens/base/js-tree/brand-blue_accent-gray.tree.js +0 -16
  37. package/dist/tokens/base/js-tree/brand-green_accent-gray.tree.js +0 -16
  38. package/dist/tokens/base/js-tree/brand-mint_accent-gray.tree.js +0 -16
  39. package/dist/tokens/base/js-tree/brand-orange_accent-gray.tree.js +0 -16
  40. package/dist/tokens/base/js-tree/brand-purple_accent-gray.tree.js +0 -16
  41. package/dist/tokens/base/js-tree/brand-red_accent-gray.tree.js +0 -16
  42. package/dist/tokens/base/js-tree/brand-violet_accent-gray.tree.js +0 -16
  43. package/dist/tokens/base/json/brand-blue-deep_accent-gray.json +0 -6
  44. package/dist/tokens/base/json/brand-blue_accent-gray.json +0 -6
  45. package/dist/tokens/base/json/brand-green_accent-gray.json +0 -6
  46. package/dist/tokens/base/json/brand-mint_accent-gray.json +0 -6
  47. package/dist/tokens/base/json/brand-orange_accent-gray.json +0 -6
  48. package/dist/tokens/base/json/brand-purple_accent-gray.json +0 -6
  49. package/dist/tokens/base/json/brand-red_accent-gray.json +0 -6
  50. package/dist/tokens/base/json/brand-violet_accent-gray.json +0 -6
  51. package/dist/tokens/base/json-tree/brand-blue-deep_accent-gray.tree.json +0 -16
  52. package/dist/tokens/base/json-tree/brand-blue_accent-gray.tree.json +0 -16
  53. package/dist/tokens/base/json-tree/brand-green_accent-gray.tree.json +0 -16
  54. package/dist/tokens/base/json-tree/brand-mint_accent-gray.tree.json +0 -16
  55. package/dist/tokens/base/json-tree/brand-orange_accent-gray.tree.json +0 -16
  56. package/dist/tokens/base/json-tree/brand-purple_accent-gray.tree.json +0 -16
  57. package/dist/tokens/base/json-tree/brand-red_accent-gray.tree.json +0 -16
  58. package/dist/tokens/base/json-tree/brand-violet_accent-gray.tree.json +0 -16
  59. package/dist/tokens/base/less/brand-blue-deep_accent-gray.less +1 -7
  60. package/dist/tokens/base/less/brand-blue_accent-gray.less +1 -7
  61. package/dist/tokens/base/less/brand-green_accent-gray.less +1 -7
  62. package/dist/tokens/base/less/brand-mint_accent-gray.less +1 -7
  63. package/dist/tokens/base/less/brand-orange_accent-gray.less +1 -7
  64. package/dist/tokens/base/less/brand-purple_accent-gray.less +1 -7
  65. package/dist/tokens/base/less/brand-red_accent-gray.less +1 -7
  66. package/dist/tokens/base/less/brand-violet_accent-gray.less +1 -7
  67. package/dist/tokens/base/scss/brand-blue-deep_accent-gray.scss +1 -7
  68. package/dist/tokens/base/scss/brand-blue_accent-gray.scss +1 -7
  69. package/dist/tokens/base/scss/brand-green_accent-gray.scss +1 -7
  70. package/dist/tokens/base/scss/brand-mint_accent-gray.scss +1 -7
  71. package/dist/tokens/base/scss/brand-orange_accent-gray.scss +1 -7
  72. package/dist/tokens/base/scss/brand-purple_accent-gray.scss +1 -7
  73. package/dist/tokens/base/scss/brand-red_accent-gray.scss +1 -7
  74. package/dist/tokens/base/scss/brand-violet_accent-gray.scss +1 -7
  75. package/dist/tokens/semantic/css/brand-blue-deep_accent-brand.css +104 -84
  76. package/dist/tokens/semantic/css/brand-blue-deep_accent-gray.css +126 -106
  77. package/dist/tokens/semantic/css/brand-blue_accent-brand.css +104 -84
  78. package/dist/tokens/semantic/css/brand-blue_accent-gray.css +126 -106
  79. package/dist/tokens/semantic/css/brand-green_accent-brand.css +104 -84
  80. package/dist/tokens/semantic/css/brand-green_accent-gray.css +126 -106
  81. package/dist/tokens/semantic/css/brand-mint_accent-brand.css +104 -84
  82. package/dist/tokens/semantic/css/brand-mint_accent-gray.css +126 -106
  83. package/dist/tokens/semantic/css/brand-orange_accent-brand.css +104 -84
  84. package/dist/tokens/semantic/css/brand-orange_accent-gray.css +126 -106
  85. package/dist/tokens/semantic/css/brand-purple_accent-brand.css +104 -84
  86. package/dist/tokens/semantic/css/brand-purple_accent-gray.css +126 -106
  87. package/dist/tokens/semantic/css/brand-red_accent-brand.css +104 -84
  88. package/dist/tokens/semantic/css/brand-red_accent-gray.css +126 -106
  89. package/dist/tokens/semantic/css/brand-violet_accent-brand.css +104 -84
  90. package/dist/tokens/semantic/css/brand-violet_accent-gray.css +126 -106
  91. package/dist/tokens/semantic/js/brand-blue-deep_accent-brand.js +104 -84
  92. package/dist/tokens/semantic/js/brand-blue-deep_accent-gray.js +120 -106
  93. package/dist/tokens/semantic/js/brand-blue_accent-brand.js +104 -84
  94. package/dist/tokens/semantic/js/brand-blue_accent-gray.js +120 -106
  95. package/dist/tokens/semantic/js/brand-green_accent-brand.js +104 -84
  96. package/dist/tokens/semantic/js/brand-green_accent-gray.js +120 -106
  97. package/dist/tokens/semantic/js/brand-mint_accent-brand.js +104 -84
  98. package/dist/tokens/semantic/js/brand-mint_accent-gray.js +120 -106
  99. package/dist/tokens/semantic/js/brand-orange_accent-brand.js +104 -84
  100. package/dist/tokens/semantic/js/brand-orange_accent-gray.js +120 -106
  101. package/dist/tokens/semantic/js/brand-purple_accent-brand.js +104 -84
  102. package/dist/tokens/semantic/js/brand-purple_accent-gray.js +120 -106
  103. package/dist/tokens/semantic/js/brand-red_accent-brand.js +104 -84
  104. package/dist/tokens/semantic/js/brand-red_accent-gray.js +120 -106
  105. package/dist/tokens/semantic/js/brand-violet_accent-brand.js +104 -84
  106. package/dist/tokens/semantic/js/brand-violet_accent-gray.js +120 -106
  107. package/dist/tokens/semantic/json/brand-blue-deep_accent-brand.json +54 -22
  108. package/dist/tokens/semantic/json/brand-blue-deep_accent-gray.json +58 -30
  109. package/dist/tokens/semantic/json/brand-blue_accent-brand.json +54 -22
  110. package/dist/tokens/semantic/json/brand-blue_accent-gray.json +58 -30
  111. package/dist/tokens/semantic/json/brand-green_accent-brand.json +54 -22
  112. package/dist/tokens/semantic/json/brand-green_accent-gray.json +58 -30
  113. package/dist/tokens/semantic/json/brand-mint_accent-brand.json +54 -22
  114. package/dist/tokens/semantic/json/brand-mint_accent-gray.json +58 -30
  115. package/dist/tokens/semantic/json/brand-orange_accent-brand.json +54 -22
  116. package/dist/tokens/semantic/json/brand-orange_accent-gray.json +58 -30
  117. package/dist/tokens/semantic/json/brand-purple_accent-brand.json +54 -22
  118. package/dist/tokens/semantic/json/brand-purple_accent-gray.json +58 -30
  119. package/dist/tokens/semantic/json/brand-red_accent-brand.json +54 -22
  120. package/dist/tokens/semantic/json/brand-red_accent-gray.json +58 -30
  121. package/dist/tokens/semantic/json/brand-violet_accent-brand.json +54 -22
  122. package/dist/tokens/semantic/json/brand-violet_accent-gray.json +58 -30
  123. package/dist/tokens/semantic/less/semantic.less +46 -36
  124. package/dist/tokens/semantic/scss/semantic.scss +46 -36
  125. package/package.json +1 -1
@@ -1,48 +1,54 @@
1
1
  export const SEMANTIC_TOKENS = {
2
2
  light: {
3
- textAccentPrimary: '#027b68',
4
- textAccentPrimaryHover: '#02957f',
5
- textAccentPrimaryPressed: '#216c5d',
3
+ textAccentHeavy: '#027b68',
4
+ textAccentHeavyHover: '#02957f',
5
+ textAccentHeavyPressed: '#216c5d',
6
6
  textDisabled: 'rgba(0, 0, 0, 0.32)',
7
- textErrorPrimary: '#c50220',
8
- textErrorPrimaryHover: '#e62b34',
9
- textErrorPrimaryPressed: '#943e3b',
10
- textInvertedAccentPrimary: '#05bfa3',
11
- textInvertedAccentPrimaryHover: '#02dcbe',
12
- textInvertedAccentPrimaryPressed: '#35a08b',
7
+ textErrorHeavy: '#c50220',
8
+ textErrorHeavyHover: '#e62b34',
9
+ textErrorHeavyPressed: '#943e3b',
10
+ textInvertedAccentHeavy: '#05bfa3',
11
+ textInvertedAccentHeavyHover: '#02dcbe',
12
+ textInvertedAccentHeavyPressed: '#35a08b',
13
13
  textInvertedDisabled: 'rgba(255, 255, 255, 0.4)',
14
- textInvertedErrorPrimary: '#ff5352',
15
- textInvertedErrorPrimaryHover: '#ff726b',
16
- textInvertedErrorPrimaryPressed: '#dd5d58',
17
- textInvertedNeutralPrimary: 'rgba(255, 255, 255, 0.96)',
18
- textInvertedNeutralSecondary: 'rgba(255, 255, 255, 0.64)',
19
- textInvertedSuccessPrimary: '#00c655',
20
- textInvertedSuccessPrimaryHover: '#4ede76',
21
- textInvertedSuccessPrimaryPressed: '#4fa161',
22
- textInvertedWarningPrimary: '#f8ae00',
23
- textInvertedWarningPrimaryHover: '#ffbf0b',
24
- textInvertedWarningPrimaryPressed: '#cc9a51',
14
+ textInvertedErrorHeavy: '#ff5352',
15
+ textInvertedErrorHeavyHover: '#ff726b',
16
+ textInvertedErrorHeavyPressed: '#dd5d58',
17
+ textInvertedNeutralHeavy: 'rgba(255, 255, 255, 0.96)',
18
+ textInvertedNeutralPale: 'rgba(255, 255, 255, 0.48)',
19
+ textInvertedNeutralSoft: 'rgba(255, 255, 255, 0.64)',
20
+ textInvertedSuccessHeavy: '#00c655',
21
+ textInvertedSuccessHeavyHover: '#4ede76',
22
+ textInvertedSuccessHeavyPressed: '#4fa161',
23
+ textInvertedWarningHeavy: '#f8ae00',
24
+ textInvertedWarningHeavyHover: '#ffbf0b',
25
+ textInvertedWarningHeavyPressed: '#cc9a51',
25
26
  textLogo: '#00BEA2',
26
- textNeutralPrimary: 'rgba(0, 0, 0, 0.88)',
27
- textNeutralSecondary: 'rgba(0, 0, 0, 0.56)',
28
- textSuccessPrimary: '#007f34',
29
- textSuccessPrimaryHover: '#009b41',
30
- textSuccessPrimaryPressed: '#3a6a43',
31
- textWarningPrimary: '#bc7d00',
32
- textWarningPrimaryHover: '#db9400',
33
- textWarningPrimaryPressed: '#a37736',
27
+ textNeutralHeavy: 'rgba(0, 0, 0, 0.88)',
28
+ textNeutralPale: 'rgba(0, 0, 0, 0.4)',
29
+ textNeutralSoft: 'rgba(0, 0, 0, 0.56)',
30
+ textSuccessHeavy: '#007f34',
31
+ textSuccessHeavyHover: '#009b41',
32
+ textSuccessHeavyPressed: '#3a6a43',
33
+ textWarningHeavy: '#bc7d00',
34
+ textWarningHeavyHover: '#db9400',
35
+ textWarningHeavyPressed: '#a37736',
34
36
  textConstDisabledBlack: 'rgba(0, 0, 0, 0.32)',
35
37
  textConstDisabledWhite: 'rgba(255, 255, 255, 0.4)',
36
- textConstPrimaryBlack: 'rgba(0, 0, 0, 0.88)',
37
- textConstPrimaryWhite: 'rgba(255, 255, 255, 0.96)',
38
- textConstSecondaryBlack: 'rgba(0, 0, 0, 0.56)',
39
- textConstSecondaryWhite: 'rgba(255, 255, 255, 0.64)',
38
+ textConstHeavyBlack: 'rgba(0, 0, 0, 0.88)',
39
+ textConstHeavyWhite: 'rgba(255, 255, 255, 0.96)',
40
+ textConstPaleBlack: 'rgba(0, 0, 0, 0.4)',
41
+ textConstPaleWhite: 'rgba(255, 255, 255, 0.48)',
42
+ textConstSoftBlack: 'rgba(0, 0, 0, 0.56)',
43
+ textConstSoftWhite: 'rgba(255, 255, 255, 0.64)',
40
44
  textOnAccentBoldDisabled: 'rgba(255, 255, 255, 0.4)',
41
- textOnAccentBoldPrimary: 'rgba(255, 255, 255, 0.96)',
42
- textOnAccentBoldSecondary: 'rgba(255, 255, 255, 0.64)',
45
+ textOnAccentBoldHeavy: 'rgba(255, 255, 255, 0.96)',
46
+ textOnAccentBoldPale: 'rgba(255, 255, 255, 0.48)',
47
+ textOnAccentBoldSoft: 'rgba(255, 255, 255, 0.64)',
43
48
  textOnBrandOriginalDisabled: 'rgba(255, 255, 255, 0.4)',
44
- textOnBrandOriginalPrimary: 'rgba(255, 255, 255, 0.96)',
45
- textOnBrandOriginalSecondary: 'rgba(255, 255, 255, 0.64)',
49
+ textOnBrandOriginalHeavy: 'rgba(255, 255, 255, 0.96)',
50
+ textOnBrandOriginalPale: 'rgba(255, 255, 255, 0.48)',
51
+ textOnBrandOriginalSoft: 'rgba(255, 255, 255, 0.64)',
46
52
  shapeBoldAccent: '#00BEA2',
47
53
  shapeBoldAccentHover: '#00b196',
48
54
  shapeBoldAccentPressed: '#329f8a',
@@ -84,13 +90,15 @@ export const SEMANTIC_TOKENS = {
84
90
  shapeHeavySuccess: '#0b4a1f',
85
91
  shapeHeavyWarning: '#543600',
86
92
  shapeOtherAccentBoldDisabled: 'rgba(0, 0, 0, 0.32)',
87
- shapeOtherBacklessHover: 'rgba(0, 0, 0, 0.08)',
88
- shapeOtherBacklessPressed: 'rgba(0, 0, 0, 0.12)',
93
+ shapeOtherBacklessHover: 'rgba(0, 0, 0, 0.06)',
94
+ shapeOtherBacklessPressed: 'rgba(0, 0, 0, 0.08)',
89
95
  shapeOtherBase: '#ffffff',
90
- shapeOtherBaseHover: 'rgba(255, 255, 255, 0.64)',
91
- shapeOtherBasePressed: 'rgba(255, 255, 255, 0.32)',
96
+ shapeOtherBaseHover: '#f2f2f2',
97
+ shapeOtherBasePressed: '#e4e4e4',
92
98
  shapeOtherDisabled: 'rgba(0, 0, 0, 0.06)',
93
99
  shapeOtherField: '#ffffff',
100
+ shapeOtherFieldHover: '#f2f2f2',
101
+ shapeOtherFieldPressed: '#e4e4e4',
94
102
  shapeOtherLow: 'rgba(0, 0, 0, 0.06)',
95
103
  shapeOtherLowHover: 'rgba(0, 0, 0, 0.08)',
96
104
  shapeOtherLowPressed: 'rgba(0, 0, 0, 0.12)',
@@ -139,7 +147,7 @@ export const SEMANTIC_TOKENS = {
139
147
  shapeSoftWarning: '#fcd35d',
140
148
  shapeSoftWarningHover: '#f4c359',
141
149
  shapeSoftWarningPressed: '#e5b566',
142
- shapeInvertedBacklessHover: 'rgba(255, 255, 255, 0.08)',
150
+ shapeInvertedBacklessHover: 'rgba(255, 255, 255, 0.06)',
143
151
  shapeInvertedBacklessPressed: 'rgba(255, 255, 255, 0.04)',
144
152
  shapeInvertedDisabled: 'rgba(255, 255, 255, 0.06)',
145
153
  shapeInvertedNeutralFaintAlpha: 'rgba(255, 255, 255, 0.06)',
@@ -249,6 +257,8 @@ export const SEMANTIC_TOKENS = {
249
257
  illustrationBlack: '#0d0d0d',
250
258
  illustrationBrand: '#00BEA2',
251
259
  illustrationComplement: '#003e53',
260
+ illustrationInvertedNeutral: '#ffffff',
261
+ illustrationNeutral: '#000000',
252
262
  illustrationOnBrand: 'rgba(255, 255, 255, 1)',
253
263
  illustrationOnComplement: '#ffffff',
254
264
  illustrationPromo: '#003e53',
@@ -311,49 +321,55 @@ export const SEMANTIC_TOKENS = {
311
321
  customizableSoftYellow: '#f6d65e',
312
322
  },
313
323
  dark: {
314
- textAccentPrimary: '#05bfa3',
315
- textAccentPrimaryHover: '#02dcbe',
316
- textAccentPrimaryPressed: '#35a08b',
324
+ textAccentHeavy: '#05bfa3',
325
+ textAccentHeavyHover: '#02dcbe',
326
+ textAccentHeavyPressed: '#35a08b',
317
327
  textDisabled: 'rgba(255, 255, 255, 0.4)',
318
- textErrorPrimary: '#ff5352',
319
- textErrorPrimaryHover: '#ff726b',
320
- textErrorPrimaryPressed: '#dd5d58',
321
- textInvertedAccentPrimary: '#027b68',
322
- textInvertedAccentPrimaryHover: '#02957f',
323
- textInvertedAccentPrimaryPressed: '#216c5d',
328
+ textErrorHeavy: '#ff5352',
329
+ textErrorHeavyHover: '#ff726b',
330
+ textErrorHeavyPressed: '#dd5d58',
331
+ textInvertedAccentHeavy: '#027b68',
332
+ textInvertedAccentHeavyHover: '#02957f',
333
+ textInvertedAccentHeavyPressed: '#216c5d',
324
334
  textInvertedDisabled: 'rgba(0, 0, 0, 0.32)',
325
- textInvertedErrorPrimary: '#c50220',
326
- textInvertedErrorPrimaryHover: '#e62b34',
327
- textInvertedErrorPrimaryPressed: '#943e3b',
328
- textInvertedNeutralPrimary: 'rgba(0, 0, 0, 0.88)',
329
- textInvertedNeutralSecondary: 'rgba(0, 0, 0, 0.56)',
330
- textInvertedSuccessPrimary: '#007f34',
331
- textInvertedSuccessPrimaryHover: '#009b41',
332
- textInvertedSuccessPrimaryPressed: '#3a6a43',
333
- textInvertedWarningPrimary: '#bc7d00',
334
- textInvertedWarningPrimaryHover: '#db9400',
335
- textInvertedWarningPrimaryPressed: '#956c30',
335
+ textInvertedErrorHeavy: '#c50220',
336
+ textInvertedErrorHeavyHover: '#e62b34',
337
+ textInvertedErrorHeavyPressed: '#943e3b',
338
+ textInvertedNeutralHeavy: 'rgba(0, 0, 0, 0.88)',
339
+ textInvertedNeutralPale: 'rgba(0, 0, 0, 0.4)',
340
+ textInvertedNeutralSoft: 'rgba(0, 0, 0, 0.56)',
341
+ textInvertedSuccessHeavy: '#007f34',
342
+ textInvertedSuccessHeavyHover: '#009b41',
343
+ textInvertedSuccessHeavyPressed: '#3a6a43',
344
+ textInvertedWarningHeavy: '#bc7d00',
345
+ textInvertedWarningHeavyHover: '#db9400',
346
+ textInvertedWarningHeavyPressed: '#956c30',
336
347
  textLogo: '#00bea2',
337
- textNeutralPrimary: 'rgba(255, 255, 255, 0.96)',
338
- textNeutralSecondary: 'rgba(255, 255, 255, 0.64)',
339
- textSuccessPrimary: '#00c655',
340
- textSuccessPrimaryHover: '#4ede76',
341
- textSuccessPrimaryPressed: '#4fa161',
342
- textWarningPrimary: '#f8ae00',
343
- textWarningPrimaryHover: '#ffbf0b',
344
- textWarningPrimaryPressed: '#cc9a51',
348
+ textNeutralHeavy: 'rgba(255, 255, 255, 0.96)',
349
+ textNeutralPale: 'rgba(255, 255, 255, 0.48)',
350
+ textNeutralSoft: 'rgba(255, 255, 255, 0.64)',
351
+ textSuccessHeavy: '#00c655',
352
+ textSuccessHeavyHover: '#4ede76',
353
+ textSuccessHeavyPressed: '#4fa161',
354
+ textWarningHeavy: '#f8ae00',
355
+ textWarningHeavyHover: '#ffbf0b',
356
+ textWarningHeavyPressed: '#cc9a51',
345
357
  textConstDisabledBlack: 'rgba(0, 0, 0, 0.32)',
346
358
  textConstDisabledWhite: 'rgba(255, 255, 255, 0.4)',
347
- textConstPrimaryBlack: 'rgba(0, 0, 0, 0.88)',
348
- textConstPrimaryWhite: 'rgba(255, 255, 255, 0.96)',
349
- textConstSecondaryBlack: 'rgba(0, 0, 0, 0.56)',
350
- textConstSecondaryWhite: 'rgba(255, 255, 255, 0.64)',
359
+ textConstHeavyBlack: 'rgba(0, 0, 0, 0.88)',
360
+ textConstHeavyWhite: 'rgba(255, 255, 255, 0.96)',
361
+ textConstPaleBlack: 'rgba(0, 0, 0, 0.4)',
362
+ textConstPaleWhite: 'rgba(255, 255, 255, 0.48)',
363
+ textConstSoftBlack: 'rgba(0, 0, 0, 0.56)',
364
+ textConstSoftWhite: 'rgba(255, 255, 255, 0.64)',
351
365
  textOnAccentBoldDisabled: 'rgba(255, 255, 255, 0.32)',
352
- textOnAccentBoldPrimary: 'rgba(255, 255, 255, 0.96)',
353
- textOnAccentBoldSecondary: 'rgba(255, 255, 255, 0.56)',
366
+ textOnAccentBoldHeavy: 'rgba(255, 255, 255, 0.96)',
367
+ textOnAccentBoldPale: 'rgba(255, 255, 255, 0.4)',
368
+ textOnAccentBoldSoft: 'rgba(255, 255, 255, 0.56)',
354
369
  textOnBrandOriginalDisabled: 'rgba(255, 255, 255, 0.4)',
355
- textOnBrandOriginalPrimary: 'rgba(255, 255, 255, 0.96)',
356
- textOnBrandOriginalSecondary: 'rgba(255, 255, 255, 0.64)',
370
+ textOnBrandOriginalHeavy: 'rgba(255, 255, 255, 0.96)',
371
+ textOnBrandOriginalPale: 'rgba(255, 255, 255, 0.48)',
372
+ textOnBrandOriginalSoft: 'rgba(255, 255, 255, 0.64)',
357
373
  shapeBoldAccent: '#00BEA2',
358
374
  shapeBoldAccentHover: '#28cbae',
359
375
  shapeBoldAccentPressed: '#41ac96',
@@ -395,13 +411,15 @@ export const SEMANTIC_TOKENS = {
395
411
  shapeHeavySuccess: '#c3f3ca',
396
412
  shapeHeavyWarning: '#fbe48d',
397
413
  shapeOtherAccentBoldDisabled: 'rgba(255, 255, 255, 0.32)',
398
- shapeOtherBacklessHover: 'rgba(255, 255, 255, 0.08)',
414
+ shapeOtherBacklessHover: 'rgba(255, 255, 255, 0.06)',
399
415
  shapeOtherBacklessPressed: 'rgba(255, 255, 255, 0.04)',
400
- shapeOtherBase: 'rgba(255, 255, 255, 0.06)',
401
- shapeOtherBaseHover: 'rgba(255, 255, 255, 0.12)',
402
- shapeOtherBasePressed: 'rgba(255, 255, 255, 0.04)',
416
+ shapeOtherBase: '#333333',
417
+ shapeOtherBaseHover: '#3d3d3d',
418
+ shapeOtherBasePressed: '#292929',
403
419
  shapeOtherDisabled: 'rgba(255, 255, 255, 0.06)',
404
- shapeOtherField: 'rgba(0, 0, 0, 0.12)',
420
+ shapeOtherField: 'rgba(0, 0, 0, 0.16)',
421
+ shapeOtherFieldHover: 'rgba(0, 0, 0, 0.04)',
422
+ shapeOtherFieldPressed: 'rgba(0, 0, 0, 0.12)',
405
423
  shapeOtherLow: 'rgba(0, 0, 0, 0.24)',
406
424
  shapeOtherLowHover: 'rgba(0, 0, 0, 0.16)',
407
425
  shapeOtherLowPressed: 'rgba(0, 0, 0, 0.32)',
@@ -450,8 +468,8 @@ export const SEMANTIC_TOKENS = {
450
468
  shapeSoftWarning: '#86612c',
451
469
  shapeSoftWarningHover: '#956c30',
452
470
  shapeSoftWarningPressed: '#775728',
453
- shapeInvertedBacklessHover: 'rgba(0, 0, 0, 0.08)',
454
- shapeInvertedBacklessPressed: 'rgba(0, 0, 0, 0.12)',
471
+ shapeInvertedBacklessHover: 'rgba(0, 0, 0, 0.06)',
472
+ shapeInvertedBacklessPressed: 'rgba(0, 0, 0, 0.08)',
455
473
  shapeInvertedDisabled: 'rgba(0, 0, 0, 0.06)',
456
474
  shapeInvertedNeutralFaintAlpha: 'rgba(0, 0, 0, 0.06)',
457
475
  shapeInvertedNeutralFaintAlphaHover: 'rgba(0, 0, 0, 0.08)',
@@ -560,6 +578,8 @@ export const SEMANTIC_TOKENS = {
560
578
  illustrationBlack: '#0d0d0d',
561
579
  illustrationBrand: '#00BEA2',
562
580
  illustrationComplement: '#ffffff',
581
+ illustrationInvertedNeutral: '#000000',
582
+ illustrationNeutral: '#ffffff',
563
583
  illustrationOnBrand: 'rgba(255, 255, 255, 1)',
564
584
  illustrationOnComplement: '#003e53',
565
585
  illustrationPromo: '#003e53',
@@ -1,54 +1,57 @@
1
1
  export const SEMANTIC_TOKENS = {
2
2
  light: {
3
- textAccentPrimary: 'rgba(0, 0, 0, 0.88)',
4
- textAccentPrimaryHover: 'rgba(0, 0, 0, 0.96)',
5
- textAccentPrimaryPressed: 'rgba(0, 0, 0, 0.96)',
3
+ textAccentHeavy: 'rgba(0, 0, 0, 0.88)',
4
+ textAccentHeavyHover: 'rgba(0, 0, 0, 0.96)',
5
+ textAccentHeavyPressed: 'rgba(0, 0, 0, 0.96)',
6
6
  textDisabled: 'rgba(0, 0, 0, 0.32)',
7
- textErrorPrimary: '#c50220',
8
- textErrorPrimaryHover: '#e62b34',
9
- textErrorPrimaryPressed: '#943e3b',
10
- textInvertedAccentPrimary: 'rgba(255, 255, 255, 0.96)',
11
- textInvertedAccentPrimaryHover: '#ffffff',
12
- textInvertedAccentPrimaryPressed: '#ffffff',
7
+ textErrorHeavy: '#c50220',
8
+ textErrorHeavyHover: '#e62b34',
9
+ textErrorHeavyPressed: '#943e3b',
10
+ textInvertedAccentHeavy: 'rgba(255, 255, 255, 0.96)',
11
+ textInvertedAccentHeavyHover: '#ffffff',
12
+ textInvertedAccentHeavyPressed: '#ffffff',
13
13
  textInvertedDisabled: 'rgba(255, 255, 255, 0.4)',
14
- textInvertedErrorPrimary: '#ff5352',
15
- textInvertedErrorPrimaryHover: '#ff726b',
16
- textInvertedErrorPrimaryPressed: '#dd5d58',
17
- textInvertedNeutralPrimary: 'rgba(255, 255, 255, 0.96)',
18
- textInvertedNeutralSecondary: 'rgba(255, 255, 255, 0.64)',
19
- textInvertedSuccessPrimary: '#00c655',
20
- textInvertedSuccessPrimaryHover: '#4ede76',
21
- textInvertedSuccessPrimaryPressed: '#4fa161',
22
- textInvertedWarningPrimary: '#f8ae00',
23
- textInvertedWarningPrimaryHover: '#ffbf0b',
24
- textInvertedWarningPrimaryPressed: '#cc9a51',
14
+ textInvertedErrorHeavy: '#ff5352',
15
+ textInvertedErrorHeavyHover: '#ff726b',
16
+ textInvertedErrorHeavyPressed: '#dd5d58',
17
+ textInvertedNeutralHeavy: 'rgba(255, 255, 255, 0.96)',
18
+ textInvertedNeutralPale: 'rgba(255, 255, 255, 0.48)',
19
+ textInvertedNeutralSoft: 'rgba(255, 255, 255, 0.64)',
20
+ textInvertedSuccessHeavy: '#00c655',
21
+ textInvertedSuccessHeavyHover: '#4ede76',
22
+ textInvertedSuccessHeavyPressed: '#4fa161',
23
+ textInvertedWarningHeavy: '#f8ae00',
24
+ textInvertedWarningHeavyHover: '#ffbf0b',
25
+ textInvertedWarningHeavyPressed: '#cc9a51',
25
26
  textLogo: '#00BEA2',
26
- textNeutralPrimary: 'rgba(0, 0, 0, 0.88)',
27
- textNeutralSecondary: 'rgba(0, 0, 0, 0.56)',
28
- textSuccessPrimary: '#007f34',
29
- textSuccessPrimaryHover: '#009b41',
30
- textSuccessPrimaryPressed: '#3a6a43',
31
- textWarningPrimary: '#bc7d00',
32
- textWarningPrimaryHover: '#db9400',
33
- textWarningPrimaryPressed: '#a37736',
27
+ textNeutralHeavy: 'rgba(0, 0, 0, 0.88)',
28
+ textNeutralPale: 'rgba(0, 0, 0, 0.4)',
29
+ textNeutralSoft: 'rgba(0, 0, 0, 0.56)',
30
+ textSuccessHeavy: '#007f34',
31
+ textSuccessHeavyHover: '#009b41',
32
+ textSuccessHeavyPressed: '#3a6a43',
33
+ textWarningHeavy: '#bc7d00',
34
+ textWarningHeavyHover: '#db9400',
35
+ textWarningHeavyPressed: '#a37736',
34
36
  textConstDisabledBlack: 'rgba(0, 0, 0, 0.32)',
35
37
  textConstDisabledWhite: 'rgba(255, 255, 255, 0.4)',
36
- textConstPrimaryBlack: 'rgba(0, 0, 0, 0.88)',
37
- textConstPrimaryWhite: 'rgba(255, 255, 255, 0.96)',
38
- textConstSecondaryBlack: 'rgba(0, 0, 0, 0.56)',
39
- textConstSecondaryWhite: 'rgba(255, 255, 255, 0.64)',
38
+ textConstHeavyBlack: 'rgba(0, 0, 0, 0.88)',
39
+ textConstHeavyWhite: 'rgba(255, 255, 255, 0.96)',
40
+ textConstPaleBlack: 'rgba(0, 0, 0, 0.4)',
41
+ textConstPaleWhite: 'rgba(255, 255, 255, 0.48)',
42
+ textConstSoftBlack: 'rgba(0, 0, 0, 0.56)',
43
+ textConstSoftWhite: 'rgba(255, 255, 255, 0.64)',
40
44
  textOnAccentBoldDisabled: 'rgba(255, 255, 255, 0.4)',
41
- textOnAccentBoldPrimary: 'rgba(255, 255, 255, 0.96)',
42
- textOnAccentBoldSecondary: 'rgba(255, 255, 255, 0.64)',
45
+ textOnAccentBoldHeavy: 'rgba(255, 255, 255, 0.96)',
46
+ textOnAccentBoldPale: 'rgba(255, 255, 255, 0.48)',
47
+ textOnAccentBoldSoft: 'rgba(255, 255, 255, 0.64)',
43
48
  textOnBrandOriginalDisabled: 'rgba(255, 255, 255, 0.4)',
44
- textOnBrandOriginalPrimary: 'rgba(255, 255, 255, 0.96)',
45
- textOnBrandOriginalSecondary: 'rgba(255, 255, 255, 0.64)',
49
+ textOnBrandOriginalHeavy: 'rgba(255, 255, 255, 0.96)',
50
+ textOnBrandOriginalPale: 'rgba(255, 255, 255, 0.48)',
51
+ textOnBrandOriginalSoft: 'rgba(255, 255, 255, 0.64)',
46
52
  shapeBoldAccent: '#3d3d3d',
47
- shapeBoldAccentHover: '#333333',
48
- shapeBoldAccentPressed: '#292929',
49
- shapeBoldBrandOriginal: '#3d3d3d',
50
- shapeBoldBrandOriginalHover: '#333333',
51
- shapeBoldBrandOriginalPressed: '#292929',
53
+ shapeBoldAccentHover: '#292929',
54
+ shapeBoldAccentPressed: '#161616',
52
55
  shapeBoldError: '#f63b40',
53
56
  shapeBoldErrorHover: '#e62b34',
54
57
  shapeBoldErrorPressed: '#cd3235',
@@ -84,13 +87,15 @@ export const SEMANTIC_TOKENS = {
84
87
  shapeHeavySuccess: '#0b4a1f',
85
88
  shapeHeavyWarning: '#543600',
86
89
  shapeOtherAccentBoldDisabled: 'rgba(0, 0, 0, 0.32)',
87
- shapeOtherBacklessHover: 'rgba(0, 0, 0, 0.08)',
88
- shapeOtherBacklessPressed: 'rgba(0, 0, 0, 0.12)',
90
+ shapeOtherBacklessHover: 'rgba(0, 0, 0, 0.06)',
91
+ shapeOtherBacklessPressed: 'rgba(0, 0, 0, 0.08)',
89
92
  shapeOtherBase: '#ffffff',
90
- shapeOtherBaseHover: 'rgba(255, 255, 255, 0.64)',
91
- shapeOtherBasePressed: 'rgba(255, 255, 255, 0.32)',
93
+ shapeOtherBaseHover: '#f2f2f2',
94
+ shapeOtherBasePressed: '#e4e4e4',
92
95
  shapeOtherDisabled: 'rgba(0, 0, 0, 0.06)',
93
96
  shapeOtherField: '#ffffff',
97
+ shapeOtherFieldHover: '#f2f2f2',
98
+ shapeOtherFieldPressed: '#e4e4e4',
94
99
  shapeOtherLow: 'rgba(0, 0, 0, 0.06)',
95
100
  shapeOtherLowHover: 'rgba(0, 0, 0, 0.08)',
96
101
  shapeOtherLowPressed: 'rgba(0, 0, 0, 0.12)',
@@ -139,7 +144,7 @@ export const SEMANTIC_TOKENS = {
139
144
  shapeSoftWarning: '#fcd35d',
140
145
  shapeSoftWarningHover: '#f4c359',
141
146
  shapeSoftWarningPressed: '#e5b566',
142
- shapeInvertedBacklessHover: 'rgba(255, 255, 255, 0.08)',
147
+ shapeInvertedBacklessHover: 'rgba(255, 255, 255, 0.06)',
143
148
  shapeInvertedBacklessPressed: 'rgba(255, 255, 255, 0.04)',
144
149
  shapeInvertedDisabled: 'rgba(255, 255, 255, 0.06)',
145
150
  shapeInvertedNeutralFaintAlpha: 'rgba(255, 255, 255, 0.06)',
@@ -185,9 +190,9 @@ export const SEMANTIC_TOKENS = {
185
190
  shapeConstSoftWhite: 'rgba(255, 255, 255, 0.24)',
186
191
  shapeConstSoftWhiteHover: 'rgba(255, 255, 255, 0.32)',
187
192
  shapeConstSoftWhitePressed: 'rgba(255, 255, 255, 0.24)',
188
- lineAccentBold: '#3d3d3d',
189
- lineAccentBoldHover: '#333333',
190
- lineAccentBoldPressed: '#292929',
193
+ lineAccentBold: '#484848',
194
+ lineAccentBoldHover: '#161616',
195
+ lineAccentBoldPressed: 'rgba(0, 0, 0, 0.64)',
191
196
  lineAccentPale: 'rgba(0, 0, 0, 0.24)',
192
197
  lineAccentPaleHover: 'rgba(0, 0, 0, 0.32)',
193
198
  lineAccentPalePressed: 'rgba(0, 0, 0, 0.4)',
@@ -212,9 +217,9 @@ export const SEMANTIC_TOKENS = {
212
217
  lineWarningBold: '#f8ae00',
213
218
  lineWarningBoldHover: '#db9400',
214
219
  lineWarningBoldPressed: '#bd8f4d',
215
- lineInvertedAccentBold: '#f2f2f2',
216
- lineInvertedAccentBoldHover: '#484848',
217
- lineInvertedAccentBoldPressed: '#333333',
220
+ lineInvertedAccentBold: '#d7d7d7',
221
+ lineInvertedAccentBoldHover: '#ffffff',
222
+ lineInvertedAccentBoldPressed: 'rgba(255, 255, 255, 0.64)',
218
223
  lineInvertedAccentPale: 'rgba(255, 255, 255, 0.24)',
219
224
  lineInvertedAccentPaleHover: 'rgba(255, 255, 255, 0.32)',
220
225
  lineInvertedAccentPalePressed: 'rgba(255, 255, 255, 0.16)',
@@ -249,6 +254,8 @@ export const SEMANTIC_TOKENS = {
249
254
  illustrationBlack: '#0d0d0d',
250
255
  illustrationBrand: '#00BEA2',
251
256
  illustrationComplement: '#003e53',
257
+ illustrationInvertedNeutral: '#ffffff',
258
+ illustrationNeutral: '#000000',
252
259
  illustrationOnBrand: 'rgba(255, 255, 255, 1)',
253
260
  illustrationOnComplement: '#ffffff',
254
261
  illustrationPromo: '#003e53',
@@ -311,55 +318,58 @@ export const SEMANTIC_TOKENS = {
311
318
  customizableSoftYellow: '#f6d65e',
312
319
  },
313
320
  dark: {
314
- textAccentPrimary: 'rgba(255, 255, 255, 0.96)',
315
- textAccentPrimaryHover: '#ffffff',
316
- textAccentPrimaryPressed: '#ffffff',
321
+ textAccentHeavy: 'rgba(255, 255, 255, 0.96)',
322
+ textAccentHeavyHover: '#ffffff',
323
+ textAccentHeavyPressed: '#ffffff',
317
324
  textDisabled: 'rgba(255, 255, 255, 0.4)',
318
- textErrorPrimary: '#ff5352',
319
- textErrorPrimaryHover: '#ff726b',
320
- textErrorPrimaryPressed: '#dd5d58',
321
- textInvertedAccentPrimary: 'rgba(0, 0, 0, 0.88)',
322
- textInvertedAccentPrimaryHover: 'rgba(0, 0, 0, 0.96)',
323
- textInvertedAccentPrimaryPressed: 'rgba(0, 0, 0, 0.96)',
325
+ textErrorHeavy: '#ff5352',
326
+ textErrorHeavyHover: '#ff726b',
327
+ textErrorHeavyPressed: '#dd5d58',
328
+ textInvertedAccentHeavy: 'rgba(0, 0, 0, 0.88)',
329
+ textInvertedAccentHeavyHover: 'rgba(0, 0, 0, 0.96)',
330
+ textInvertedAccentHeavyPressed: 'rgba(0, 0, 0, 0.96)',
324
331
  textInvertedDisabled: 'rgba(0, 0, 0, 0.32)',
325
- textInvertedErrorPrimary: '#c50220',
326
- textInvertedErrorPrimaryHover: '#e62b34',
327
- textInvertedErrorPrimaryPressed: '#943e3b',
328
- textInvertedNeutralPrimary: 'rgba(0, 0, 0, 0.88)',
329
- textInvertedNeutralSecondary: 'rgba(0, 0, 0, 0.56)',
330
- textInvertedSuccessPrimary: '#007f34',
331
- textInvertedSuccessPrimaryHover: '#009b41',
332
- textInvertedSuccessPrimaryPressed: '#3a6a43',
333
- textInvertedWarningPrimary: '#bc7d00',
334
- textInvertedWarningPrimaryHover: '#db9400',
335
- textInvertedWarningPrimaryPressed: '#956c30',
332
+ textInvertedErrorHeavy: '#c50220',
333
+ textInvertedErrorHeavyHover: '#e62b34',
334
+ textInvertedErrorHeavyPressed: '#943e3b',
335
+ textInvertedNeutralHeavy: 'rgba(0, 0, 0, 0.88)',
336
+ textInvertedNeutralPale: 'rgba(0, 0, 0, 0.4)',
337
+ textInvertedNeutralSoft: 'rgba(0, 0, 0, 0.56)',
338
+ textInvertedSuccessHeavy: '#007f34',
339
+ textInvertedSuccessHeavyHover: '#009b41',
340
+ textInvertedSuccessHeavyPressed: '#3a6a43',
341
+ textInvertedWarningHeavy: '#bc7d00',
342
+ textInvertedWarningHeavyHover: '#db9400',
343
+ textInvertedWarningHeavyPressed: '#956c30',
336
344
  textLogo: '#00bea2',
337
- textNeutralPrimary: 'rgba(255, 255, 255, 0.96)',
338
- textNeutralSecondary: 'rgba(255, 255, 255, 0.64)',
339
- textSuccessPrimary: '#00c655',
340
- textSuccessPrimaryHover: '#4ede76',
341
- textSuccessPrimaryPressed: '#4fa161',
342
- textWarningPrimary: '#f8ae00',
343
- textWarningPrimaryHover: '#ffbf0b',
344
- textWarningPrimaryPressed: '#cc9a51',
345
+ textNeutralHeavy: 'rgba(255, 255, 255, 0.96)',
346
+ textNeutralPale: 'rgba(255, 255, 255, 0.48)',
347
+ textNeutralSoft: 'rgba(255, 255, 255, 0.64)',
348
+ textSuccessHeavy: '#00c655',
349
+ textSuccessHeavyHover: '#4ede76',
350
+ textSuccessHeavyPressed: '#4fa161',
351
+ textWarningHeavy: '#f8ae00',
352
+ textWarningHeavyHover: '#ffbf0b',
353
+ textWarningHeavyPressed: '#cc9a51',
345
354
  textConstDisabledBlack: 'rgba(0, 0, 0, 0.32)',
346
355
  textConstDisabledWhite: 'rgba(255, 255, 255, 0.4)',
347
- textConstPrimaryBlack: 'rgba(0, 0, 0, 0.88)',
348
- textConstPrimaryWhite: 'rgba(255, 255, 255, 0.96)',
349
- textConstSecondaryBlack: 'rgba(0, 0, 0, 0.56)',
350
- textConstSecondaryWhite: 'rgba(255, 255, 255, 0.64)',
356
+ textConstHeavyBlack: 'rgba(0, 0, 0, 0.88)',
357
+ textConstHeavyWhite: 'rgba(255, 255, 255, 0.96)',
358
+ textConstPaleBlack: 'rgba(0, 0, 0, 0.4)',
359
+ textConstPaleWhite: 'rgba(255, 255, 255, 0.48)',
360
+ textConstSoftBlack: 'rgba(0, 0, 0, 0.56)',
361
+ textConstSoftWhite: 'rgba(255, 255, 255, 0.64)',
351
362
  textOnAccentBoldDisabled: 'rgba(0, 0, 0, 0.32)',
352
- textOnAccentBoldPrimary: 'rgba(0, 0, 0, 0.88)',
353
- textOnAccentBoldSecondary: 'rgba(0, 0, 0, 0.56)',
363
+ textOnAccentBoldHeavy: 'rgba(0, 0, 0, 0.88)',
364
+ textOnAccentBoldPale: 'rgba(0, 0, 0, 0.4)',
365
+ textOnAccentBoldSoft: 'rgba(0, 0, 0, 0.56)',
354
366
  textOnBrandOriginalDisabled: 'rgba(255, 255, 255, 0.4)',
355
- textOnBrandOriginalPrimary: 'rgba(255, 255, 255, 0.96)',
356
- textOnBrandOriginalSecondary: 'rgba(255, 255, 255, 0.64)',
367
+ textOnBrandOriginalHeavy: 'rgba(255, 255, 255, 0.96)',
368
+ textOnBrandOriginalPale: 'rgba(255, 255, 255, 0.48)',
369
+ textOnBrandOriginalSoft: 'rgba(255, 255, 255, 0.64)',
357
370
  shapeBoldAccent: '#f2f2f2',
358
- shapeBoldAccentHover: '#484848',
359
- shapeBoldAccentPressed: '#333333',
360
- shapeBoldBrandOriginal: '#f2f2f2',
361
- shapeBoldBrandOriginalHover: '#484848',
362
- shapeBoldBrandOriginalPressed: '#292929',
371
+ shapeBoldAccentHover: '#ffffff',
372
+ shapeBoldAccentPressed: '#cacaca',
363
373
  shapeBoldError: '#de3c3e',
364
374
  shapeBoldErrorHover: '#ee4948',
365
375
  shapeBoldErrorPressed: '#a74541',
@@ -395,13 +405,15 @@ export const SEMANTIC_TOKENS = {
395
405
  shapeHeavySuccess: '#c3f3ca',
396
406
  shapeHeavyWarning: '#fbe48d',
397
407
  shapeOtherAccentBoldDisabled: 'rgba(255, 255, 255, 0.32)',
398
- shapeOtherBacklessHover: 'rgba(255, 255, 255, 0.08)',
408
+ shapeOtherBacklessHover: 'rgba(255, 255, 255, 0.06)',
399
409
  shapeOtherBacklessPressed: 'rgba(255, 255, 255, 0.04)',
400
- shapeOtherBase: 'rgba(255, 255, 255, 0.06)',
401
- shapeOtherBaseHover: 'rgba(255, 255, 255, 0.12)',
402
- shapeOtherBasePressed: 'rgba(255, 255, 255, 0.04)',
410
+ shapeOtherBase: '#333333',
411
+ shapeOtherBaseHover: '#3d3d3d',
412
+ shapeOtherBasePressed: '#292929',
403
413
  shapeOtherDisabled: 'rgba(255, 255, 255, 0.06)',
404
- shapeOtherField: 'rgba(0, 0, 0, 0.12)',
414
+ shapeOtherField: 'rgba(0, 0, 0, 0.16)',
415
+ shapeOtherFieldHover: 'rgba(0, 0, 0, 0.04)',
416
+ shapeOtherFieldPressed: 'rgba(0, 0, 0, 0.12)',
405
417
  shapeOtherLow: 'rgba(0, 0, 0, 0.24)',
406
418
  shapeOtherLowHover: 'rgba(0, 0, 0, 0.16)',
407
419
  shapeOtherLowPressed: 'rgba(0, 0, 0, 0.32)',
@@ -450,8 +462,8 @@ export const SEMANTIC_TOKENS = {
450
462
  shapeSoftWarning: '#86612c',
451
463
  shapeSoftWarningHover: '#956c30',
452
464
  shapeSoftWarningPressed: '#775728',
453
- shapeInvertedBacklessHover: 'rgba(0, 0, 0, 0.08)',
454
- shapeInvertedBacklessPressed: 'rgba(0, 0, 0, 0.12)',
465
+ shapeInvertedBacklessHover: 'rgba(0, 0, 0, 0.06)',
466
+ shapeInvertedBacklessPressed: 'rgba(0, 0, 0, 0.08)',
455
467
  shapeInvertedDisabled: 'rgba(0, 0, 0, 0.06)',
456
468
  shapeInvertedNeutralFaintAlpha: 'rgba(0, 0, 0, 0.06)',
457
469
  shapeInvertedNeutralFaintAlphaHover: 'rgba(0, 0, 0, 0.08)',
@@ -496,9 +508,9 @@ export const SEMANTIC_TOKENS = {
496
508
  shapeConstSoftWhite: 'rgba(255, 255, 255, 0.24)',
497
509
  shapeConstSoftWhiteHover: 'rgba(255, 255, 255, 0.32)',
498
510
  shapeConstSoftWhitePressed: 'rgba(255, 255, 255, 0.24)',
499
- lineAccentBold: '#f2f2f2',
500
- lineAccentBoldHover: '#484848',
501
- lineAccentBoldPressed: '#333333',
511
+ lineAccentBold: '#d7d7d7',
512
+ lineAccentBoldHover: '#ffffff',
513
+ lineAccentBoldPressed: 'rgba(255, 255, 255, 0.64)',
502
514
  lineAccentPale: 'rgba(255, 255, 255, 0.24)',
503
515
  lineAccentPaleHover: 'rgba(255, 255, 255, 0.32)',
504
516
  lineAccentPalePressed: 'rgba(255, 255, 255, 0.16)',
@@ -523,9 +535,9 @@ export const SEMANTIC_TOKENS = {
523
535
  lineWarningBold: '#f8ae00',
524
536
  lineWarningBoldHover: '#ffbf0b',
525
537
  lineWarningBoldPressed: '#cc9a51',
526
- lineInvertedAccentBold: '#3d3d3d',
527
- lineInvertedAccentBoldHover: '#333333',
528
- lineInvertedAccentBoldPressed: '#292929',
538
+ lineInvertedAccentBold: '#525252',
539
+ lineInvertedAccentBoldHover: '#161616',
540
+ lineInvertedAccentBoldPressed: 'rgba(0, 0, 0, 0.64)',
529
541
  lineInvertedAccentPale: 'rgba(0, 0, 0, 0.24)',
530
542
  lineInvertedAccentPaleHover: 'rgba(0, 0, 0, 0.32)',
531
543
  lineInvertedAccentPalePressed: 'rgba(0, 0, 0, 0.4)',
@@ -560,6 +572,8 @@ export const SEMANTIC_TOKENS = {
560
572
  illustrationBlack: '#0d0d0d',
561
573
  illustrationBrand: '#00BEA2',
562
574
  illustrationComplement: '#ffffff',
575
+ illustrationInvertedNeutral: '#000000',
576
+ illustrationNeutral: '#ffffff',
563
577
  illustrationOnBrand: 'rgba(255, 255, 255, 1)',
564
578
  illustrationOnComplement: '#003e53',
565
579
  illustrationPromo: '#003e53',