@marioschmidt/design-system-tokens 1.0.13 → 1.0.14

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 (204) hide show
  1. package/dist/android/res/values/base/primitive_color_value.xml +12 -12
  2. package/dist/android/res/values/base/primitive_font_value.xml +22 -22
  3. package/dist/android/res/values/base/primitive_size_value.xml +49 -49
  4. package/dist/android/res/values/base/primitive_space_value.xml +25 -25
  5. package/dist/android/res/values/density/density_compact.xml +8 -8
  6. package/dist/android/res/values/density/density_default.xml +8 -8
  7. package/dist/android/res/values/density/density_spacious.xml +8 -8
  8. package/dist/android/res/values/mapping/brand_advertorial.xml +240 -240
  9. package/dist/android/res/values/mapping/brand_bild.xml +240 -240
  10. package/dist/android/res/values/mapping/brand_sportbild.xml +240 -240
  11. package/dist/android/res/values/semantic/advertorial/breakpoints/breakpoint_advertorial_lg.xml +423 -423
  12. package/dist/android/res/values/semantic/advertorial/breakpoints/breakpoint_advertorial_md.xml +423 -423
  13. package/dist/android/res/values/semantic/advertorial/breakpoints/breakpoint_advertorial_sm.xml +423 -423
  14. package/dist/android/res/values/semantic/advertorial/breakpoints/breakpoint_advertorial_xs.xml +423 -423
  15. package/dist/android/res/values/semantic/advertorial/color/color_advertorial_dark.xml +15 -15
  16. package/dist/android/res/values/semantic/advertorial/color/color_advertorial_light.xml +15 -15
  17. package/dist/android/res/values/semantic/bild/breakpoints/breakpoint_bild_lg.xml +423 -423
  18. package/dist/android/res/values/semantic/bild/breakpoints/breakpoint_bild_md.xml +423 -423
  19. package/dist/android/res/values/semantic/bild/breakpoints/breakpoint_bild_sm.xml +423 -423
  20. package/dist/android/res/values/semantic/bild/breakpoints/breakpoint_bild_xs.xml +423 -423
  21. package/dist/android/res/values/semantic/bild/color/color_bild_dark.xml +15 -15
  22. package/dist/android/res/values/semantic/bild/color/color_bild_light.xml +15 -15
  23. package/dist/android/res/values/semantic/sportbild/breakpoints/breakpoint_sportbild_lg.xml +423 -423
  24. package/dist/android/res/values/semantic/sportbild/breakpoints/breakpoint_sportbild_md.xml +423 -423
  25. package/dist/android/res/values/semantic/sportbild/breakpoints/breakpoint_sportbild_sm.xml +423 -423
  26. package/dist/android/res/values/semantic/sportbild/breakpoints/breakpoint_sportbild_xs.xml +423 -423
  27. package/dist/android/res/values/semantic/sportbild/color/color_sportbild_dark.xml +15 -15
  28. package/dist/android/res/values/semantic/sportbild/color/color_sportbild_light.xml +15 -15
  29. package/dist/css/base/primitive-font-value-global.css +11 -11
  30. package/dist/css/base/primitive-font-value.css +11 -11
  31. package/dist/css/base/primitive-size-value-global.css +49 -49
  32. package/dist/css/base/primitive-size-value.css +49 -49
  33. package/dist/css/base/primitive-space-value-global.css +25 -25
  34. package/dist/css/base/primitive-space-value.css +25 -25
  35. package/dist/css/density/density-compact-global.css +2 -2
  36. package/dist/css/density/density-compact.css +2 -2
  37. package/dist/css/density/density-default-global.css +2 -2
  38. package/dist/css/density/density-default.css +2 -2
  39. package/dist/css/density/density-spacious-global.css +2 -2
  40. package/dist/css/density/density-spacious.css +2 -2
  41. package/dist/css/mapping/brand-advertorial-global.css +203 -203
  42. package/dist/css/mapping/brand-advertorial.css +203 -203
  43. package/dist/css/mapping/brand-bild-global.css +203 -203
  44. package/dist/css/mapping/brand-bild.css +203 -203
  45. package/dist/css/mapping/brand-sportbild-global.css +203 -203
  46. package/dist/css/mapping/brand-sportbild.css +203 -203
  47. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-lg-global.css +97 -97
  48. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-lg.css +97 -97
  49. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-md-global.css +94 -94
  50. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-md.css +94 -94
  51. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-sm-global.css +95 -95
  52. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-sm.css +95 -95
  53. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-xs-global.css +95 -95
  54. package/dist/css/semantic/advertorial/breakpoints/breakpoint-advertorial-xs.css +95 -95
  55. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-lg-global.css +97 -97
  56. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-lg.css +97 -97
  57. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-md-global.css +94 -94
  58. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-md.css +94 -94
  59. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-sm-global.css +95 -95
  60. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-sm.css +95 -95
  61. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-xs-global.css +95 -95
  62. package/dist/css/semantic/bild/breakpoints/breakpoint-bild-xs.css +95 -95
  63. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-lg-global.css +97 -97
  64. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-lg.css +97 -97
  65. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-md-global.css +94 -94
  66. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-md.css +94 -94
  67. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-sm-global.css +95 -95
  68. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-sm.css +95 -95
  69. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-xs-global.css +95 -95
  70. package/dist/css/semantic/sportbild/breakpoints/breakpoint-sportbild-xs.css +95 -95
  71. package/dist/flutter/base/primitive_color_value.dart +119 -85
  72. package/dist/flutter/base/primitive_font_value.dart +58 -46
  73. package/dist/flutter/base/primitive_size_value.dart +49 -49
  74. package/dist/flutter/base/primitive_space_value.dart +26 -26
  75. package/dist/flutter/density/density_compact.dart +16 -11
  76. package/dist/flutter/density/density_default.dart +16 -11
  77. package/dist/flutter/density/density_spacious.dart +16 -11
  78. package/dist/flutter/mapping/brand_advertorial.dart +398 -274
  79. package/dist/flutter/mapping/brand_bild.dart +398 -274
  80. package/dist/flutter/mapping/brand_color_bild.dart +121 -71
  81. package/dist/flutter/mapping/brand_color_sportbild.dart +121 -71
  82. package/dist/flutter/mapping/brand_sportbild.dart +398 -274
  83. package/dist/flutter/semantic/advertorial/breakpoints/breakpoint_advertorial_lg.dart +689 -487
  84. package/dist/flutter/semantic/advertorial/breakpoints/breakpoint_advertorial_md.dart +689 -487
  85. package/dist/flutter/semantic/advertorial/breakpoints/breakpoint_advertorial_sm.dart +689 -487
  86. package/dist/flutter/semantic/advertorial/breakpoints/breakpoint_advertorial_xs.dart +689 -487
  87. package/dist/flutter/semantic/advertorial/color/color_advertorial_dark.dart +369 -423
  88. package/dist/flutter/semantic/advertorial/color/color_advertorial_light.dart +369 -423
  89. package/dist/flutter/semantic/bild/breakpoints/breakpoint_bild_lg.dart +689 -487
  90. package/dist/flutter/semantic/bild/breakpoints/breakpoint_bild_md.dart +689 -487
  91. package/dist/flutter/semantic/bild/breakpoints/breakpoint_bild_sm.dart +689 -487
  92. package/dist/flutter/semantic/bild/breakpoints/breakpoint_bild_xs.dart +689 -487
  93. package/dist/flutter/semantic/bild/color/color_bild_dark.dart +369 -423
  94. package/dist/flutter/semantic/bild/color/color_bild_light.dart +369 -423
  95. package/dist/flutter/semantic/sportbild/breakpoints/breakpoint_sportbild_lg.dart +689 -487
  96. package/dist/flutter/semantic/sportbild/breakpoints/breakpoint_sportbild_md.dart +689 -487
  97. package/dist/flutter/semantic/sportbild/breakpoints/breakpoint_sportbild_sm.dart +689 -487
  98. package/dist/flutter/semantic/sportbild/breakpoints/breakpoint_sportbild_xs.dart +689 -487
  99. package/dist/flutter/semantic/sportbild/color/color_sportbild_dark.dart +369 -423
  100. package/dist/flutter/semantic/sportbild/color/color_sportbild_light.dart +369 -423
  101. package/dist/ios/base/PrimitiveColorValue.swift +130 -96
  102. package/dist/ios/base/PrimitiveFontValue.swift +57 -45
  103. package/dist/ios/base/PrimitiveSizeValue.swift +51 -51
  104. package/dist/ios/base/PrimitiveSpaceValue.swift +27 -27
  105. package/dist/ios/density/DensityCompact.swift +15 -10
  106. package/dist/ios/density/DensityDefault.swift +15 -10
  107. package/dist/ios/density/DensitySpacious.swift +15 -10
  108. package/dist/ios/mapping/BrandAdvertorial.swift +397 -273
  109. package/dist/ios/mapping/BrandBild.swift +397 -273
  110. package/dist/ios/mapping/BrandColorBild.swift +120 -70
  111. package/dist/ios/mapping/BrandColorSportbild.swift +120 -70
  112. package/dist/ios/mapping/BrandSportbild.swift +397 -273
  113. package/dist/ios/semantic/advertorial/breakpoints/BreakpointAdvertorialLg.swift +688 -486
  114. package/dist/ios/semantic/advertorial/breakpoints/BreakpointAdvertorialMd.swift +688 -486
  115. package/dist/ios/semantic/advertorial/breakpoints/BreakpointAdvertorialSm.swift +688 -486
  116. package/dist/ios/semantic/advertorial/breakpoints/BreakpointAdvertorialXs.swift +688 -486
  117. package/dist/ios/semantic/advertorial/color/ColorAdvertorialDark.swift +368 -422
  118. package/dist/ios/semantic/advertorial/color/ColorAdvertorialLight.swift +368 -422
  119. package/dist/ios/semantic/bild/breakpoints/BreakpointBildLg.swift +688 -486
  120. package/dist/ios/semantic/bild/breakpoints/BreakpointBildMd.swift +688 -486
  121. package/dist/ios/semantic/bild/breakpoints/BreakpointBildSm.swift +688 -486
  122. package/dist/ios/semantic/bild/breakpoints/BreakpointBildXs.swift +688 -486
  123. package/dist/ios/semantic/bild/color/ColorBildDark.swift +368 -422
  124. package/dist/ios/semantic/bild/color/ColorBildLight.swift +368 -422
  125. package/dist/ios/semantic/sportbild/breakpoints/BreakpointSportbildLg.swift +688 -486
  126. package/dist/ios/semantic/sportbild/breakpoints/BreakpointSportbildMd.swift +688 -486
  127. package/dist/ios/semantic/sportbild/breakpoints/BreakpointSportbildSm.swift +688 -486
  128. package/dist/ios/semantic/sportbild/breakpoints/BreakpointSportbildXs.swift +688 -486
  129. package/dist/ios/semantic/sportbild/color/ColorSportbildDark.swift +368 -422
  130. package/dist/ios/semantic/sportbild/color/ColorSportbildLight.swift +368 -422
  131. package/dist/js/base/primitive-color-value.js +34 -34
  132. package/dist/js/base/primitive-font-value.js +12 -12
  133. package/dist/js/base/primitive-size-value.js +49 -49
  134. package/dist/js/base/primitive-space-value.js +25 -25
  135. package/dist/js/density/density-compact.js +5 -5
  136. package/dist/js/density/density-default.js +5 -5
  137. package/dist/js/density/density-spacious.js +5 -5
  138. package/dist/js/mapping/brand-advertorial.js +229 -222
  139. package/dist/js/mapping/brand-bild.js +230 -222
  140. package/dist/js/mapping/brand-color-bild.js +50 -50
  141. package/dist/js/mapping/brand-color-sportbild.js +50 -50
  142. package/dist/js/mapping/brand-sportbild.js +234 -222
  143. package/dist/js/semantic/advertorial/breakpoints/breakpoint-advertorial-lg.js +285 -293
  144. package/dist/js/semantic/advertorial/breakpoints/breakpoint-advertorial-md.js +283 -291
  145. package/dist/js/semantic/advertorial/breakpoints/breakpoint-advertorial-sm.js +285 -292
  146. package/dist/js/semantic/advertorial/breakpoints/breakpoint-advertorial-xs.js +285 -292
  147. package/dist/js/semantic/advertorial/color/color-advertorial-dark.js +50 -154
  148. package/dist/js/semantic/advertorial/color/color-advertorial-light.js +50 -154
  149. package/dist/js/semantic/bild/breakpoints/breakpoint-bild-lg.js +285 -293
  150. package/dist/js/semantic/bild/breakpoints/breakpoint-bild-md.js +283 -291
  151. package/dist/js/semantic/bild/breakpoints/breakpoint-bild-sm.js +285 -292
  152. package/dist/js/semantic/bild/breakpoints/breakpoint-bild-xs.js +285 -292
  153. package/dist/js/semantic/bild/color/color-bild-dark.js +50 -154
  154. package/dist/js/semantic/bild/color/color-bild-light.js +50 -154
  155. package/dist/js/semantic/sportbild/breakpoints/breakpoint-sportbild-lg.js +285 -293
  156. package/dist/js/semantic/sportbild/breakpoints/breakpoint-sportbild-md.js +283 -291
  157. package/dist/js/semantic/sportbild/breakpoints/breakpoint-sportbild-sm.js +285 -292
  158. package/dist/js/semantic/sportbild/breakpoints/breakpoint-sportbild-xs.js +285 -292
  159. package/dist/js/semantic/sportbild/color/color-sportbild-dark.js +50 -154
  160. package/dist/js/semantic/sportbild/color/color-sportbild-light.js +50 -154
  161. package/dist/json/base/primitive-font-value.json +11 -11
  162. package/dist/json/base/primitive-size-value.json +49 -49
  163. package/dist/json/base/primitive-space-value.json +25 -25
  164. package/dist/json/density/density-compact.json +2 -2
  165. package/dist/json/density/density-default.json +2 -2
  166. package/dist/json/density/density-spacious.json +2 -2
  167. package/dist/json/mapping/brand-advertorial.json +203 -203
  168. package/dist/json/mapping/brand-bild.json +203 -203
  169. package/dist/json/mapping/brand-sportbild.json +203 -203
  170. package/dist/json/semantic/advertorial/breakpoints/breakpoint-advertorial-lg.json +97 -97
  171. package/dist/json/semantic/advertorial/breakpoints/breakpoint-advertorial-md.json +94 -94
  172. package/dist/json/semantic/advertorial/breakpoints/breakpoint-advertorial-sm.json +95 -95
  173. package/dist/json/semantic/advertorial/breakpoints/breakpoint-advertorial-xs.json +95 -95
  174. package/dist/json/semantic/bild/breakpoints/breakpoint-bild-lg.json +97 -97
  175. package/dist/json/semantic/bild/breakpoints/breakpoint-bild-md.json +94 -94
  176. package/dist/json/semantic/bild/breakpoints/breakpoint-bild-sm.json +95 -95
  177. package/dist/json/semantic/bild/breakpoints/breakpoint-bild-xs.json +95 -95
  178. package/dist/json/semantic/sportbild/breakpoints/breakpoint-sportbild-lg.json +97 -97
  179. package/dist/json/semantic/sportbild/breakpoints/breakpoint-sportbild-md.json +94 -94
  180. package/dist/json/semantic/sportbild/breakpoints/breakpoint-sportbild-sm.json +95 -95
  181. package/dist/json/semantic/sportbild/breakpoints/breakpoint-sportbild-xs.json +95 -95
  182. package/dist/manifest.json +1 -1
  183. package/dist/scss/base/primitive-font-value.scss +11 -11
  184. package/dist/scss/base/primitive-size-value.scss +49 -49
  185. package/dist/scss/base/primitive-space-value.scss +25 -25
  186. package/dist/scss/density/density-compact.scss +2 -2
  187. package/dist/scss/density/density-default.scss +2 -2
  188. package/dist/scss/density/density-spacious.scss +2 -2
  189. package/dist/scss/mapping/brand-advertorial.scss +203 -203
  190. package/dist/scss/mapping/brand-bild.scss +203 -203
  191. package/dist/scss/mapping/brand-sportbild.scss +203 -203
  192. package/dist/scss/semantic/advertorial/breakpoints/breakpoint-advertorial-lg.scss +97 -97
  193. package/dist/scss/semantic/advertorial/breakpoints/breakpoint-advertorial-md.scss +94 -94
  194. package/dist/scss/semantic/advertorial/breakpoints/breakpoint-advertorial-sm.scss +95 -95
  195. package/dist/scss/semantic/advertorial/breakpoints/breakpoint-advertorial-xs.scss +95 -95
  196. package/dist/scss/semantic/bild/breakpoints/breakpoint-bild-lg.scss +97 -97
  197. package/dist/scss/semantic/bild/breakpoints/breakpoint-bild-md.scss +94 -94
  198. package/dist/scss/semantic/bild/breakpoints/breakpoint-bild-sm.scss +95 -95
  199. package/dist/scss/semantic/bild/breakpoints/breakpoint-bild-xs.scss +95 -95
  200. package/dist/scss/semantic/sportbild/breakpoints/breakpoint-sportbild-lg.scss +97 -97
  201. package/dist/scss/semantic/sportbild/breakpoints/breakpoint-sportbild-md.scss +94 -94
  202. package/dist/scss/semantic/sportbild/breakpoints/breakpoint-sportbild-sm.scss +95 -95
  203. package/dist/scss/semantic/sportbild/breakpoints/breakpoint-sportbild-xs.scss +95 -95
  204. package/package.json +1 -1
@@ -8,425 +8,371 @@
8
8
 
9
9
  import UIKit
10
10
 
11
- public class {
12
- public static let componentAlertAlertSurfaceColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1) /** On marketing offer surfaces this variable is usually not used. The alertSurfaceConstant variables should be used. This token changes color between light and dark modes. L:100 / D:025 */
13
- public static let componentAlertAlertSurfaceColorConstant = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** On marketing offer surfaces this variable is used. */
14
- public static let componentAvatarAvatarLabelColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** 09-2025 css --article-author-name-color */
15
- public static let componentAvatarAvatarLabelColorHover = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1) /** 09-2025 css --article-author-name-color */
16
- public static let componentBreadcrumbBreadcrumbTextColorHover = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Use this token on breadcrumbs that the user's pointer is hovering on or clicked on. This token changes color between light and dark modes. L:015 / D:100 */
17
- public static let componentBreadcrumbBreadcrumbTextColorIdle = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1) /** Use this token on breadcrumbs that are in their default idle state. This token changes color between light and dark modes. L:035 / D:096 */
18
- public static let componentBreakingNewsBreakingNewsBottomTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1)
19
- public static let componentBreakingNewsBreakingNewsSurfaceColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
20
- public static let componentBreakingNewsBreakingNewsTextContentColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
21
- public static let componentBreakingNewsBreakingNewsTitleSurfaceColor = UIColor(red: 0.988, green: 0.510, blue: 0.149, alpha: 1)
22
- public static let componentBreakingNewsBreakingNewsTopTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1)
23
- public static let componentButtonButtonLiveTickerLoadNewLabelColor = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
24
- public static let componentButtonButtonLiveTickerLoadNewSurfaceColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
25
- public static let componentButtonGhostButtonGhostBgColorHover = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 0.5)
26
- public static let componentButtonPrimaryButtonPrimaryBrandBgColorHover = UIColor(red: 0.690, green: 0.000, blue: 0.012, alpha: 1)
27
- public static let componentButtonPrimaryButtonPrimaryBrandBgColorIdle = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1)
28
- public static let componentButtonPrimaryButtonPrimaryLabelColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
29
- public static let componentButtonPrimaryButtonPrimaryNeutralBgColorHover = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
30
- public static let componentButtonPrimaryButtonPrimaryNeutralBgColorIdle = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Use this variable on the neutral color primary button. Tone changes between light and dark mode. Light mode Bild & SpoBi: Tone 015 ; Dark mode Bild & SpoBi: Tone 100 */
31
- public static let componentButtonPrimaryButtonPrimarySuccessColorHover = UIColor(red: 0.000, green: 0.431, blue: 0.239, alpha: 1)
32
- public static let componentButtonPrimaryButtonPrimarySuccessColorIdle = UIColor(red: 0.090, green: 0.600, blue: 0.361, alpha: 1)
33
- public static let componentButtonSecondaryButtonSecondaryBgColorHover = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 0.5)
34
- public static let componentButtonSecondaryButtonSecondaryBgColorIdle = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
35
- public static let componentButtonSecondaryButtonSecondaryLabelColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
36
- public static let componentButtonTertiaryButtonTertiaryBorderColorHover = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
37
- public static let componentButtonTertiaryButtonTertiaryBorderColorIdle = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
38
- public static let componentButtonTertiaryButtonTertiaryLabelColor = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
39
- public static let componentButtonTertiaryButtonTertiarySuccessBgColorHover = UIColor(red: 0.000, green: 0.612, blue: 0.349, alpha: 0.5)
40
- public static let componentButtonTertiaryButtonTertiarySuccessBorderColor = UIColor(red: 0.090, green: 0.600, blue: 0.361, alpha: 1)
41
- public static let componentCardCardSurfaceBgColor = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 1)
42
- public static let componentChipsChipsBgColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
43
- public static let componentChipsChipsBgColorHover = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
44
- public static let componentChipsChipsBgColorIdle = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
45
- public static let componentChipsChipsLabelColorHover = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
46
- public static let componentChipsChipsLabelColorIdle = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
47
- public static let componentDSysDocDSysDocsLabelTextColorMode = (Dark Mode) /** This is currently for use in this design system's documentation texts. It is a text string made for being used in light and dark mode documentation texts. */
48
- public static let componentDSysDocDSysDocsLabelTextSurfaceColorPrimaryPrimitiveName = BILD010 /** This variable is only for use in Figma's Design System File. It is automating some of the content in documentation pages. */
49
- public static let componentDSysDocDsDocSpacingItemBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.2)
50
- public static let componentDSysDocDsDocSpacingItemBorderColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.8)
51
- public static let componentDropdownDropdownBgColorHover = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
52
- public static let componentDropdownDropdownBgColorIdle = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
53
- public static let componentEmptiesEmptiesBgColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
54
- public static let componentEmptiesEmptiesLogoColor = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 1)
55
- public static let componentFoldoutFoldoutLabelColorActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
56
- public static let componentFoldoutFoldoutLabelColorIdle = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
57
- public static let componentGalleryAppImageLightboxGalleryBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1)
58
- public static let componentHeyHeyDrawerSurfaceColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
59
- public static let componentHeyHeyFavInputFieldSurfaceColor = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
60
- public static let componentHeyHeyIconUtilColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
61
- public static let componentHeyHeySeparatorColor = UIColor(red: 0.400, green: 0.420, blue: 0.439, alpha: 1) /** This is the most used color for separators across Bild products. */
62
- public static let componentHeyHeyTextColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
63
- public static let componentInputFieldInputFieldBgColorDarkHighContrast = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
64
- public static let componentInputFieldInputFieldBgColorDarkLowContrast = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
65
- public static let componentInputFieldInputFieldBgColorDarkMediumContrast = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
66
- public static let componentInputFieldInputFieldBorderColorActive = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
67
- public static let componentInputFieldInputFieldBorderColorDark = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
68
- public static let componentInputFieldInputFieldBorderColorDarkActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
69
- public static let componentInputFieldInputFieldBorderColorIdle = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
70
- public static let componentKickerPartnerKickerAubiBgColor = UIColor(red: 0.941, green: 0.000, blue: 0.000, alpha: 1)
71
- public static let componentKickerPartnerKickerBzBgColor = UIColor(red: 0.890, green: 0.000, blue: 0.110, alpha: 1)
72
- public static let componentKickerPartnerKickerCobiBgColor = UIColor(red: 0.859, green: 0.141, blue: 0.110, alpha: 1)
73
- public static let componentKickerPartnerKickerFitbookBgColor = UIColor(red: 1.000, green: 0.588, blue: 0.722, alpha: 1)
74
- public static let componentKickerPartnerKickerKaufberaterBgColor = UIColor(red: 0.329, green: 0.278, blue: 0.431, alpha: 1)
75
- public static let componentKickerPartnerKickerMyhomebookBgColor = UIColor(red: 0.400, green: 0.800, blue: 0.800, alpha: 1)
76
- public static let componentKickerPartnerKickerPetbookBgColor = UIColor(red: 0.729, green: 0.859, blue: 0.569, alpha: 1)
77
- public static let componentKickerPartnerKickerSpobiBgColor = UIColor(red: 0.090, green: 0.271, blue: 0.510, alpha: 1)
78
- public static let componentKickerPartnerKickerTechbookBgColor = UIColor(red: 0.580, green: 0.890, blue: 1.000, alpha: 1)
79
- public static let componentKickerPartnerKickerTravelbookBgColor = UIColor(red: 0.561, green: 0.941, blue: 0.929, alpha: 1)
80
- public static let componentKickerStandardKickerBgColorOnSurface = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
81
- public static let componentMediaplayerAudioPlayerPlayButtonBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.3)
82
- public static let componentMediaplayerVidPlayerControlButtonsBgColorHover = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.2)
83
- public static let componentMediaplayerVidPlayerControlButtonsBgColorPressed = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.05)
84
- public static let componentMediaplayerVidPlayerControlButtonsBgHoverColor = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 0.8) /** This variable is used for hover states of video player control buttons. */
85
- public static let componentMediaplayerVidPlayerControlsAutoplayButtonBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.2)
86
- public static let componentMediaplayerVidPlayerOverlayScrimColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.5)
87
- public static let componentMediaplayerVidPlayerProgressBarPreloadBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.3)
88
- public static let componentMediaplayerVidPlayerTooltipBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.7)
89
- public static let componentMediaplayerVidPlayerUnmuteButtonBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.2)
90
- public static let componentMediaplayerVidPlayerUnmuteButtonBgColorHover = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.35)
91
- public static let componentMenuAppTobBarTabNavBottomBorder = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
92
- public static let componentMenuAppTobBarTabNavBottomBorderActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
93
- public static let componentMenuAppTopBarIconColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
94
- public static let componentMenuAppTopBarSurfaceColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
95
- public static let componentMenuAppTopBarTextColorPrimary = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
96
- public static let componentMenuItemMenuItemBorderColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
97
- public static let componentMenuItemMenuItemLabelColorPrimary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
98
- public static let componentMenuItemMenuItemLabelColorPrimaryActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
99
- public static let componentMenuItemMenuItemLabelColorSecondary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** The variable can be used on secondary menus that many times show up on dedicated home pages specific to a topic. The menu labels are often times using the color white across color modes. */
100
- public static let componentMenuMenuLinkLaneLabelColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
101
- public static let componentMenuMenuLinkLaneLabelColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
102
- public static let componentMenuMenuLinkLaneSurfaceColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
103
- public static let componentMenuMenuScrolledSurfaceGradientColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 0.95) /** Used on a thin part at the top of header in navigation menu. */
104
- public static let componentMenuMenuSurfaceColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
105
- public static let componentNewstickerNewsTickerBadgeIconsColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
106
- public static let componentNewstickerNewsTickerTimestampColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
107
- public static let componentPaginationGalleryPaginationElementActiveOpacity = 100 /** Use this on gallery slider pagination elements. This can also be applied to hover states of those elements. */
108
- public static let componentPaginationPaginationElementColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
109
- public static let componentPaginationPaginationElementColorDefault = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
110
- public static let componentPaginationScrollBarThumbBgColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Use on the scroll bar interactive element which shows where the scroll view is positioned inside the full extent of the scrolling space. */
111
- public static let componentPaginationScrollBarTrackBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.1) /** Used as the background surface color scroll bars. Found on components that vertically or horizontally stack elements. */
112
- public static let componentPartnerLinksPartnerLinksBgColorActive = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
113
- public static let componentPartnerLinksPartnerLinksBgColorIdle = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1) /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
114
- public static let componentPartnerLinksPartnerLinksBorderColorActive = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1) /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
115
- public static let componentPartnerLinksPartnerLinksBorderColorIdle = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1) /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
116
- public static let componentPartnerLinksPartnerLinksContainerBorderColor = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1) /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
117
- public static let componentSelectionSelectionBorderColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Checkboxes and Radio buttons use this variable for their border. */
118
- public static let componentSliderSliderButtonOpacity = 90 /** When users hover on gallery slider buttons the opacity changes to 90%. */
119
- public static let componentSliderSliderTrackBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.35) /** This variable is used on audio player slider bars. It references a pure white with 35% opacity. */
120
- public static let componentSocialShareButtonSocialShareButtonBgColorActive = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
121
- public static let componentSocialShareButtonSocialShareButtonBgColorDefault = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
122
- public static let componentSocialShareButtonSocialShareButtonLabelColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
123
- public static let componentSocialShareButtonSocialShareButtonLabelColorDefault = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
124
- public static let componentSubheaderSubheadersColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
125
- public static let componentTabAppBottomTabBarBgColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
126
- public static let componentTabTabBgColorHover = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
127
- public static let componentTabTabLabelColorActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
128
- public static let componentTabTabLabelColorDefault = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
129
- public static let componentTeaserTeaserHoverOpacity = 80 /** When users hover over graphical teasers the image reduces opacity to 80%. */
130
- public static let componentTeaserTeaserTitleBackgroundGradientStart = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.7)
131
- public static let componentTeaserTeaserTitleBackgroundGradientStop = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)
132
- public static let componentTextLinkTextLinkColorPrimary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
133
- public static let componentTextLinkTextLinkColorSecondary = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
134
- public static let componentTextLinkTextLinkColorSecondaryActive = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
135
- public static let semanticAttentionAccentColorPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Primary accent color used to emphasize interactive or highlight elements such as links, selection states, or focus indicators. Adapts in Darkmode to a fully white tone. */
136
- public static let semanticAttentionAccentColorPrimaryConstant = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1) /** Used for accent highlights that must remain visually consistent across themes (e.g., brand identifiers, logos, or fixed emphasis areas). Color value does not change between Light and Dark mode. */
137
- public static let semanticAttentionAttentionColorExtraLow = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1) /** Very low-contrast background tone used for information or system-neutral surfaces, often for tooltips or quiet information highlights. Dynamic — light neutral in Light mode and dark neutral in Dark mode. */
138
- public static let semanticAttentionAttentionColorHigh = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1) /** High-level attention color used for errors, destructive actions, and critical alerts (e.g., delete actions, error states). Remains red in both Light and Dark mode for immediate recognition. */
139
- public static let semanticAttentionAttentionColorLow = UIColor(red: 1.000, green: 0.749, blue: 0.000, alpha: 1) /** Low-level warning or attention tone, typically used for informational or cautionary messages. Same yellow tone across Light and Dark to maintain recognition. */
140
- public static let semanticAttentionAttentionColorMedium = UIColor(red: 0.988, green: 0.510, blue: 0.149, alpha: 1) /** Medium-level attention tone representing stronger caution or intermediate alert states. Commonly applied in warning messages. Constant — identical in both modes. */
141
- public static let semanticAttentionAttentionColorSuccessPrimary = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1) /** Primary success color used to indicate positive states, confirmations, or completed actions (e.g., success banners, icons, or badges). Remains the same across modes to ensure recognizability and consistency. */
142
- public static let semanticAttentionAttentionColorSuccessSecondary = UIColor(red: 0.000, green: 0.431, blue: 0.239, alpha: 1) /** Secondary success tone used for secondary states. Maintains the same color in both Light and Dark mode for clarity. */
143
- public static let /**
144
- * High-emphasis border color for clear delineation between surfaces (e.g., focus rings, high-contrast UI zones).
145
- * Behavior: Dynamic — light surfaces use a darker neutral, dark surfaces a light neutral tone.
146
- */
147
- semanticBorderBorderColorHighContrast = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
148
- public static let /**
149
- * Used for subtle dividers and low-emphasis borders in neutral areas (e.g., card outlines, input containers).
150
- * Dynamic light gray in Light mode, dark gray in Dark mode.
151
- */
152
- semanticBorderBorderColorLowContrast = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
153
- public static let semanticBorderBorderColorLowContrastConstant = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1) /** Applies to UI elements that must visually remain the same regardless of theme (e.g., brand containers, static illustrations). Identical tone across Light and Dark mode. */
154
- public static let /**
155
- * Medium-emphasis border color for standard outlines, input fields, or separators that require visible yet non-dominant contrast.
156
- * Behavior: Dynamic adjusts to maintain legibility in Light and Dark themes.
157
- */
158
- semanticBorderBorderColorMediumContrast = UIColor(red: 0.400, green: 0.420, blue: 0.439, alpha: 1)
159
- public static let semanticBorderBorderColorPrimaryDisabled = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1) /** Applied to disabled states of primary elements (e.g., buttons, inputs) to visually reduce emphasis and indicate inactivity. */
160
- public static let semanticBorderBorderColorSecondaryDisabled = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1) /** Used for secondary component borders in a disabled state (e.g., secondary buttons, inactive input outlines). */
161
- public static let /**
162
- * Used for success states and validation borders (e.g., input success outlines or confirmation frames).
163
- * Behavior: Constantsame success tone across modes for consistent feedback semantics.
164
- */
165
- semanticBorderBorderColorSuccess = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1)
166
- public static let /**
167
- * Defines border color for warning and error-related components, typically used for input validation or caution zones.
168
- * Behavior: Constant retains the same red warning tone in both Light and Dark modes.
169
- */
170
- semanticBorderBorderColorWarning = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1)
171
- public static let semanticCoreCoreColorPrimary = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1) /** Used as the main brand color for key interactive elements such as primary buttons, active states, and prominent highlights. It remains constant across Light and Dark Mode. */
172
- public static let semanticCoreCoreColorSecondary = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1) /** Defines the secondary brand tone. This variable changes across Light and Dark Mode. */
173
- public static let semanticCoreCoreColorSecondaryConstant = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Use this on elements that must maintain the white color even in dark mode. */
174
- public static let semanticCoreCoreColorTertiary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Represents tertiary brand accents. This variable changes across Light and Dark Mode. */
175
- public static let semanticCoreCoreColorTertiaryConstant = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1) /** Use this on elements that need to maintain the dark color across themes and color modes. */
176
- public static let semanticCoreCoreColorTertiaryVvPipeTest = UIColor(red: 0.690, green: 0.820, blue: 0.949, alpha: 1) /** this is a test for the token pipeline */
177
- public static let semanticCoreFelipeTestColor = UIColor(red: 0.012, green: 0.102, blue: 0.188, alpha: 1) /** this is a test for the token pipeline */
178
- public static let semanticCoreNpmTest = UIColor(red: 0.690, green: 0.820, blue: 0.949, alpha: 1) /** this is a test for the token pipeline */
179
- public static let /**
180
- * Primary color for headings and display typography. Ensures clear hierarchy and optimal readability on main surfaces. Adapds it´s color based on the brand mode for brand recognition.
181
- * Behavior: Dynamicdark text in Light mode, light text in Dark mode.
182
- */
183
- semanticHeadingHeadlineColorPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
184
- public static let /**
185
- * Fixed white heading color used on dark or colored backgrounds (e.g., hero sections, banners) that remain constant across modes.
186
- * Behavior: Constant — remains white in both Light and Dark mode.
187
- */
188
- semanticHeadingHeadlineColorWhiteConst = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
189
- public static let /**
190
- * Used for kicker text placed on bright or light colored backgrounds. Ensures balanced contrast without harsh visual dominance.
191
- * Behavior: Constant remains semi-transparent black across both modes.
192
- */
193
- semanticHeadingKickerTextColorOnBrightBg = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.7)
194
- public static let /**
195
- * Applied to kicker or meta text on dark colored backgrounds to maintain high legibility.
196
- * Behavior: Constant always uses semi-transparent white for consistent readability.
197
- */
198
- semanticHeadingKickerTextColorOnDarkBg = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.8)
199
- public static let /**
200
- * Specialized kicker color for use on red or brand-colored backgrounds (e.g., red kicker bg within teaser cards).
201
- * Behavior: Constantremains consistent across light and darkmode.
202
- */
203
- semanticHeadingKickerTextColorOnRed = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
204
- public static let /**
205
- * Used for kicker text and category labels placed directly on standard surface backgrounds.
206
- * Behavior: Dynamic adjusts between red for Light and a neutral tone in Dark modes.
207
- */
208
- semanticHeadingKickerTextColorOnSurface = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
209
- public static let /**
210
- * Used for icons displayed on dark backgrounds that don´t change colors, ensuring sufficient contrast and legibility.
211
- * Behavior: Constant always uses a neutral bright value.
212
- */
213
- semanticIconIconColorConstantOnDark = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
214
- public static let /**
215
- * Inverse icon color for use on contrasting backgrounds (e.g., light icons on dark surfaces or dark icons on bright surfaces).
216
- * Behavior: Dynamic — switches between light and dark.
217
- */
218
- semanticIconIconColorInverse = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
219
- public static let semanticIconIconColorPrimary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Primary icon color on primary surfaces. */
220
- public static let /**
221
- * Used for icons that must remain visually consistent regardless of mode (e.g., icons that are on surfaces that don't change color).
222
- * Identical tone in both Light and Dark mode.
223
- */
224
- semanticIconIconColorPrimaryConstant = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
225
- public static let semanticIconIconColorSecondaryConstant = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Secondary icon tone for less prominent actions or supportive iconography (e.g., secondary buttons, tool icons). Remains unchanged across modes. */
226
- public static let /**
227
- * Represents success or confirmation icons (e.g., checkmarks, completion indicators).
228
- * Behavior: Constant same success green tone across Light and Dark mode.
229
- */
230
- semanticIconIconColorSuccess = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1)
231
- public static let /**
232
- * Disabled label tone indicating inactive or unavailable states in UI elements.
233
- * Behavior: Dynamic lighter gray in Light mode, darker neutral in Dark mode.
234
- */
235
- semanticLabelLabelColorDisabled = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
236
- public static let /**
237
- * Primary label color used for labels, badges, or tag text on light backgrounds. Ensures strong readability and visual hierarchy.
238
- * Behavior: Dynamic dark neutral in Light mode, light neutral in Dark mode.
239
- */
240
- semanticLabelLabelColorPrimary = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
241
- public static let /**
242
- * Used when primary label color should remain unchanged across modes in static UI areas.
243
- * Behavior: Constant identical tone in both Light and Dark mode.
244
- */
245
- semanticLabelLabelColorPrimaryConstant = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
246
- public static let /**
247
- * Inverse version of the primary label color, used on dark or colored backgrounds.
248
- * Behavior: Dynamic switches between light and dark.
249
- */
250
- semanticLabelLabelColorPrimaryInverse = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
251
- public static let /**
252
- * Fixed inverse label tone applied where white or bright text must always appear, regardless of theme.
253
- * Behavior: Constant remains bright neutral in both Light and Dark mode.
254
- */
255
- semanticLabelLabelColorPrimaryInverseConstant = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
256
- public static let /**
257
- * Secondary label tone used for less prominent text such as secondary badges or supporting labels.
258
- * Behavior: Dynamic adapts between mid-grays for Light and Dark surfaces.
259
- */
260
- semanticLabelLabelColorSecondary = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
261
- public static let /**
262
- * Tertiary label tone for subtle, low-emphasis UI text such as placeholder text or tertiary badges.
263
- * Behavior: Constant identical tone across both modes for stable hierarchy.
264
- */
265
- semanticLabelLabelColorTertiary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
266
- public static let semanticLayerOpacityLayerOpacity00 = 0
267
- public static let semanticLayerOpacityLayerOpacity05 = 5
268
- public static let semanticLayerOpacityLayerOpacity10 = 10
269
- public static let semanticLayerOpacityLayerOpacity100 = 100
270
- public static let semanticLayerOpacityLayerOpacity20 = 20
271
- public static let semanticLayerOpacityLayerOpacity30 = 30
272
- public static let semanticLayerOpacityLayerOpacity40 = 40
273
- public static let semanticLayerOpacityLayerOpacity50 = 50
274
- public static let semanticLayerOpacityLayerOpacity60 = 60
275
- public static let semanticLayerOpacityLayerOpacity70 = 70
276
- public static let semanticLayerOpacityLayerOpacity80 = 80
277
- public static let semanticLayerOpacityLayerOpacity90 = 90
278
- public static let semanticOverlayOverlayScrimBlack = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.7) /** A semi-transparent black overlay used to dim background content when modals, drawers, or dialogs are active. Identical opacity and tone in both Light and Dark mode to ensure consistent overlay depth. */
279
- public static let /**
280
- * A semi-transparent white overlay used to brighten or fade background layers, often applied behind bottom sheets or temporary panels.
281
- * Behavior: Constant same opacity level across modes to preserve uniform layering behavior.
282
- */
283
- semanticOverlayOverlayScrimWhite = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.7)
284
- public static let /**
285
- * Used to represent the active or pressed state of primary actions such as tabs or links.
286
- * Behavior: Constant identical value across modes for consistent interaction feedback.
287
- */
288
- semanticStateColorPrimaryActive = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1)
289
- public static let /**
290
- * Defines the disabled color for primary components (e.g., disabled primary buttons, inputs). Reduces emphasis and contrast to signal inactivity.
291
- * Behavior: Dynamic slightly lighter in Light mode and darker in Dark mode to remain visually accessible.
292
- */
293
- semanticStateColorPrimaryDisabled = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
294
- public static let /**
295
- * Defines the active state color for secondary actions (e.g., secondary buttons, tabs, or toggles).
296
- * Behavior: Dynamic light gray in Light mode and bright gray in Dark mode to maintain perceptual balance.
297
- */
298
- semanticStateColorSecondaryActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1)
299
- public static let /**
300
- * Inverse variant of the secondary active state, applied on dark backgrounds or inverse layouts.
301
- * Behavior: Dynamic switches between bright and dark tones depending on the background.
302
- */
303
- semanticStateColorSecondaryActiveInverse = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
304
- public static let /**
305
- * Used for disabled secondary elements, ensuring reduced visual prominence while maintaining legibility.
306
- * Behavior: Dynamic adapts neutral tones based on theme brightness.
307
- */
308
- semanticStateColorSecondaryDisabled = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1)
309
- public static let /**
310
- * Represents active or pressed states for tertiary elements (e.g., link highlights, icons, or subtle interactive surfaces).
311
- * Behavior: Constant uses the same green success tone across Light and Dark mode.
312
- */
313
- semanticStateColorTertiaryActive = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1)
314
- public static let /**
315
- * Represents disabled states for tertiary levels, maintaining subtle visibility without drawing attention.
316
- * Behavior: Dynamic adjusts between gray tones for Light and Dark mode consistency.
317
- */
318
- semanticStateColorTertiaryDisabled = UIColor(red: 0.400, green: 0.420, blue: 0.439, alpha: 1)
319
- public static let /**
320
- * Primary surface color used for main backgrounds and large layout areas (e.g., page background, primary containers).
321
- * Behavior: Dynamic adapts between light and dark surface tokens to maintain legibility and hierarchy.
322
- */
323
- semanticSurfaceSurfaceColorPrimary = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
324
- public static let /**
325
- * A fixed dark surface tone used for dark overlays or nested dark sections inside light layouts.
326
- * Behavior: Constant identical across Light and Dark mode.
327
- */
328
- semanticSurfaceSurfaceColorPrimaryConstantDark = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
329
- public static let /**
330
- * A fixed light surface tone used when a consistent light background is required (e.g., light panels within dark layouts).
331
- * Behavior: Constant remains the same in both modes.
332
- */
333
- semanticSurfaceSurfaceColorPrimaryConstantLight = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
334
- public static let semanticSurfaceSurfaceColorPrimaryGradientStop = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 0) /** Defines the end stops for primary surface gradients, creating visual depth or elevation. Used next to sliders buttons and slider container edges for fading out content. Behavior: Dynamic — light gradients in Light mode, dark gradients in Dark mode. */
335
- public static let /**
336
- * Inverse of the primary surface, used when Light and Dark surfaces are swapped (e.g., inverse cards or elevated sections).
337
- * Behavior: Dynamic switches between dark and light values depending on mode.
338
- */
339
- semanticSurfaceSurfaceColorPrimaryInverse = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
340
- public static let semanticSurfaceSurfaceColorQuartenary = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1) /** HIghtest elevation surface color, typically used for grouping or background accents to differentiate themselves from all previous surface color options. Uses corresponding light/dark tones for consistent layering. */
341
- public static let /**
342
- * Inverse of the quartenary surface, used for background reversals in mixed-layout areas.
343
- * Behavior: Dynamic inverts between dark and light tones depending on mode.
344
- */
345
- semanticSurfaceSurfaceColorQuartenaryInverse = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
346
- public static let /**
347
- * Used for secondary surface layers such as cards, panels, or nested containers that need to differentiate themselves from the primary surface. .
348
- * Behavior: Dynamic adapts brightness level based on mode for appropriate depth contrast.
349
- */
350
- semanticSurfaceSurfaceColorSecondary = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 1)
351
- public static let /**
352
- * Used for secondary surface gradients or subtle depth layers across backgrounds.
353
- * Behavior: Dynamic adapts to mode brightness for smooth gradient transitions.
354
- */
355
- semanticSurfaceSurfaceColorSecondaryGradientStop = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 0)
356
- public static let /**
357
- * Success-related background used for positive notifications, confirmation surfaces, or success banners.
358
- * Behavior: Constant remains the same across Light and Dark mode to ensure brand alignment.
359
- */
360
- semanticSurfaceSurfaceColorSuccess = UIColor(red: 0.812, green: 0.961, blue: 0.890, alpha: 1)
361
- public static let /**
362
- * Tertiary background layer for inner containers, grouped content, or subtle elevation steps that need to differentiate themselves from the primary and secondary surfaces.
363
- * Behavior: Dynamic switches between light and dark tertiary tones.
364
- */
365
- semanticSurfaceSurfaceColorTertiary = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1)
366
- public static let /**
367
- * Represents tertiary-level gradient background.
368
- * Currently used on skeletons.
369
- */
370
- semanticSurfaceSurfaceColorTertiaryGradientStop = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 0)
371
- public static let /**
372
- * Inverse tertiary background, applied when Light and Dark surfaces are reversed (e.g., dark-on-light cards).
373
- * Behavior: Dynamic swaps values between modes for contrast preservation.
374
- */
375
- semanticSurfaceSurfaceColorTertiaryInverse = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
376
- public static let semanticTextTextColorAccent = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Accent text color used for links, interactive text, or highlighted key words. Changes from a red in light mode to a white in dark mode. */
377
- public static let /**
378
- * Applies to text elements requiring fixed brand color usage (e.g., permanent links, brand slogans on constant backgrounds).
379
- * Behavior: Constant — maintains identical red tone across Light and Dark mode.
380
- */
381
- semanticTextTextColorAccentConstant = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1)
382
- public static let /**
383
- * Used for strong warnings, errors, or destructive action labels.
384
- * Behavior: Constant — red color remains unchanged between Light and Dark mode for visibility and recognition.
385
- */
386
- semanticTextTextColorAttentionHigh = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1)
387
- public static let /**
388
- * Represents medium attention states, often used in warnings or pending states.
389
- * Behavior: Constant — same orange tone across Light and Dark mode.
390
- */
391
- semanticTextTextColorAttentionMedium = UIColor(red: 0.988, green: 0.510, blue: 0.149, alpha: 1)
392
- public static let /**
393
- * Muted text tone for subtle information, timestamps, or inactive text elements.
394
- * Behavior: Dynamic — adjusts between mid-gray in Light mode and lighter gray in Dark mode.
395
- */
396
- semanticTextTextColorMuted = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1)
397
- public static let /**
398
- * Used for text displayed on dark surfaces to ensure maximum legibility and contrast.
399
- * Behavior: Constant — always light neutral to guarantee accessibility on dark backgrounds.
400
- */
401
- semanticTextTextColorOnDarkSurface = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
402
- public static let /**
403
- * Main text color used for body copy and all primary textual content. Ensures optimal readability and contrast on standard surfaces.
404
- * Behavior: Dynamic — switches between dark text on light backgrounds and light text on dark backgrounds.
405
- */
406
- semanticTextTextColorPrimary = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
407
- public static let /**
408
- * Used when primary text color must remain fixed regardless of mode (e.g., on light constant backgrounds).
409
- * Behavior: Constant — same tone across Light and Dark mode.
410
- */
411
- semanticTextTextColorPrimaryConstant = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
412
- public static let /**
413
- * Inverse text color used on opposing surfaces (e.g., white text on red or dark backgrounds).
414
- * Behavior: Dynamic — alternates between light and dark mode.
415
- */
416
- semanticTextTextColorPrimaryInverse = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1)
417
- public static let /**
418
- * Fixed inverse tone for text that always appears on dark surfaces (e.g., hero headlines or persistent dark cards).
419
- * Behavior: Constant — unchanged across modes.
420
- */
421
- semanticTextTextColorPrimaryInverseConstant = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1)
422
- public static let /**
423
- * Secondary text color used for supportive information, subtitles, and less prominent text.
424
- * Behavior: Dynamic — adapts between neutral tones to maintain proper contrast per theme. In 2025 css it is called figure meta.
425
- */
426
- semanticTextTextColorSecondary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
427
- public static let /**
428
- * Used for positive or success-related messages (e.g., “Saved”, “Success”, or confirmation text) on success surface colors.
429
- * Behavior: Constant — green tone remains consistent across both modes.
430
- */
431
- semanticTextTextColorSuccessConstant = UIColor(red: 0.000, green: 0.431, blue: 0.239, alpha: 1)
432
- }
11
+ public class ColorAdvertorialDark {
12
+ /** Used as the main brand color for key interactive elements such as primary buttons, active states, and prominent highlights. It remains constant across Light and Dark Mode. */
13
+ public static let SemanticCoreCoreColorPrimary = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
14
+ /** Defines the secondary brand tone. This variable changes across Light and Dark Mode. */
15
+ public static let SemanticCoreCoreColorSecondary = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
16
+ /** Represents tertiary brand accents. This variable changes across Light and Dark Mode. */
17
+ public static let SemanticCoreCoreColorTertiary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
18
+ /** Use this on elements that must maintain the white color even in dark mode. */
19
+ public static let SemanticCoreCoreColorSecondaryConstant = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
20
+ /** Use this on elements that need to maintain the dark color across themes and color modes. */
21
+ public static let SemanticCoreCoreColorTertiaryConstant = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
22
+ /** this is a test for the token pipeline */
23
+ public static let SemanticCoreCoreColorTertiaryVvPipeTEST = UIColor(red: 0.690, green: 0.820, blue: 0.949, alpha: 1.000)
24
+ /** this is a test for the token pipeline */
25
+ public static let SemanticCoreNpmTest = UIColor(red: 0.690, green: 0.820, blue: 0.949, alpha: 1.000)
26
+ /** this is a test for the token pipeline */
27
+ public static let SemanticCoreFelipeTestColor = UIColor(red: 0.012, green: 0.102, blue: 0.188, alpha: 1.000)
28
+ /** Primary accent color used to emphasize interactive or highlight elements such as links, selection states, or focus indicators. Adapts in Darkmode to a fully white tone. */
29
+ public static let SemanticAttentionAccentColorPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
30
+ /** Used for accent highlights that must remain visually consistent across themes (e.g., brand identifiers, logos, or fixed emphasis areas). Color value does not change between Light and Dark mode. */
31
+ public static let SemanticAttentionAccentColorPrimaryConstant = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
32
+ /** Primary success color used to indicate positive states, confirmations, or completed actions (e.g., success banners, icons, or badges). Remains the same across modes to ensure recognizability and consistency. */
33
+ public static let SemanticAttentionAttentionColorSuccessPrimary = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1.000)
34
+ /** Secondary success tone used for secondary states. Maintains the same color in both Light and Dark mode for clarity. */
35
+ public static let SemanticAttentionAttentionColorSuccessSecondary = UIColor(red: 0.000, green: 0.431, blue: 0.239, alpha: 1.000)
36
+ /** Very low-contrast background tone used for information or system-neutral surfaces, often for tooltips or quiet information highlights. Dynamic — light neutral in Light mode and dark neutral in Dark mode. */
37
+ public static let SemanticAttentionAttentionColorExtraLow = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
38
+ /** Low-level warning or attention tone, typically used for informational or cautionary messages. Same yellow tone across Light and Dark to maintain recognition. */
39
+ public static let SemanticAttentionAttentionColorLow = UIColor(red: 1.000, green: 0.749, blue: 0.000, alpha: 1.000)
40
+ /** Medium-level attention tone representing stronger caution or intermediate alert states. Commonly applied in warning messages. Constant — identical in both modes. */
41
+ public static let SemanticAttentionAttentionColorMedium = UIColor(red: 0.988, green: 0.510, blue: 0.149, alpha: 1.000)
42
+ /** High-level attention color used for errors, destructive actions, and critical alerts (e.g., delete actions, error states). Remains red in both Light and Dark mode for immediate recognition. */
43
+ public static let SemanticAttentionAttentionColorHigh = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
44
+ /** Used for subtle dividers and low-emphasis borders in neutral areas (e.g., card outlines, input containers).
45
+ Dynamic light gray in Light mode, dark gray in Dark mode. */
46
+ public static let SemanticBorderBorderColorLowContrast = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
47
+ /** Applies to UI elements that must visually remain the same regardless of theme (e.g., brand containers, static illustrations). Identical tone across Light and Dark mode. */
48
+ public static let SemanticBorderBorderColorLowContrastConstant = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
49
+ /** Medium-emphasis border color for standard outlines, input fields, or separators that require visible yet non-dominant contrast.
50
+ Behavior: Dynamic adjusts to maintain legibility in Light and Dark themes. */
51
+ public static let SemanticBorderBorderColorMediumContrast = UIColor(red: 0.400, green: 0.420, blue: 0.439, alpha: 1.000)
52
+ /** High-emphasis border color for clear delineation between surfaces (e.g., focus rings, high-contrast UI zones).
53
+ Behavior: Dynamic light surfaces use a darker neutral, dark surfaces a light neutral tone. */
54
+ public static let SemanticBorderBorderColorHighContrast = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
55
+ /** Used for success states and validation borders (e.g., input success outlines or confirmation frames).
56
+ Behavior: Constant same success tone across modes for consistent feedback semantics. */
57
+ public static let SemanticBorderBorderColorSuccess = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1.000)
58
+ /** Defines border color for warning and error-related components, typically used for input validation or caution zones.
59
+ Behavior: Constant retains the same red warning tone in both Light and Dark modes. */
60
+ public static let SemanticBorderBorderColorWarning = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
61
+ /** Applied to disabled states of primary elements (e.g., buttons, inputs) to visually reduce emphasis and indicate inactivity. */
62
+ public static let SemanticBorderBorderColorPrimaryDisabled = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
63
+ /** Used for secondary component borders in a disabled state (e.g., secondary buttons, inactive input outlines). */
64
+ public static let SemanticBorderBorderColorSecondaryDisabled = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
65
+ /** Primary icon color on primary surfaces. */
66
+ public static let SemanticIconIconColorPrimary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
67
+ /** Used for icons that must remain visually consistent regardless of mode (e.g., icons that are on surfaces that don't change color).
68
+ Identical tone in both Light and Dark mode. */
69
+ public static let SemanticIconIconColorPrimaryConstant = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
70
+ /** Inverse icon color for use on contrasting backgrounds (e.g., light icons on dark surfaces or dark icons on bright surfaces).
71
+ Behavior: Dynamic switches between light and dark. */
72
+ public static let SemanticIconIconColorInverse = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
73
+ /** Secondary icon tone for less prominent actions or supportive iconography (e.g., secondary buttons, tool icons). Remains unchanged across modes. */
74
+ public static let SemanticIconIconColorSecondaryConstant = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
75
+ /** Used for icons displayed on dark backgrounds that don´t change colors, ensuring sufficient contrast and legibility.
76
+ Behavior: Constant always uses a neutral bright value. */
77
+ public static let SemanticIconIconColorConstantOnDark = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
78
+ /** Represents success or confirmation icons (e.g., checkmarks, completion indicators).
79
+ Behavior: Constant same success green tone across Light and Dark mode. */
80
+ public static let SemanticIconIconColorSuccess = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1.000)
81
+ /** A semi-transparent black overlay used to dim background content when modals, drawers, or dialogs are active. Identical opacity and tone in both Light and Dark mode to ensure consistent overlay depth. */
82
+ public static let SemanticOverlayOverlayScrimBlack = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.700)
83
+ /** A semi-transparent white overlay used to brighten or fade background layers, often applied behind bottom sheets or temporary panels.
84
+ Behavior: Constant same opacity level across modes to preserve uniform layering behavior. */
85
+ public static let SemanticOverlayOverlayScrimWhite = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.700)
86
+ /** Used to represent the active or pressed state of primary actions such as tabs or links.
87
+ Behavior: Constant identical value across modes for consistent interaction feedback. */
88
+ public static let SemanticStateColorPrimaryActive = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
89
+ /** Defines the active state color for secondary actions (e.g., secondary buttons, tabs, or toggles).
90
+ Behavior: Dynamic light gray in Light mode and bright gray in Dark mode to maintain perceptual balance. */
91
+ public static let SemanticStateColorSecondaryActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
92
+ /** Inverse variant of the secondary active state, applied on dark backgrounds or inverse layouts.
93
+ Behavior: Dynamic switches between bright and dark tones depending on the background. */
94
+ public static let SemanticStateColorSecondaryActiveInverse = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
95
+ /** Represents active or pressed states for tertiary elements (e.g., link highlights, icons, or subtle interactive surfaces).
96
+ Behavior: Constant uses the same green success tone across Light and Dark mode. */
97
+ public static let SemanticStateColorTertiaryActive = UIColor(red: 0.000, green: 0.761, blue: 0.451, alpha: 1.000)
98
+ /** Defines the disabled color for primary components (e.g., disabled primary buttons, inputs). Reduces emphasis and contrast to signal inactivity.
99
+ Behavior: Dynamic slightly lighter in Light mode and darker in Dark mode to remain visually accessible. */
100
+ public static let SemanticStateColorPrimaryDisabled = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
101
+ /** Used for disabled secondary elements, ensuring reduced visual prominence while maintaining legibility.
102
+ Behavior: Dynamic adapts neutral tones based on theme brightness. */
103
+ public static let SemanticStateColorSecondaryDisabled = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
104
+ /** Represents disabled states for tertiary levels, maintaining subtle visibility without drawing attention.
105
+ Behavior: Dynamic adjusts between gray tones for Light and Dark mode consistency. */
106
+ public static let SemanticStateColorTertiaryDisabled = UIColor(red: 0.400, green: 0.420, blue: 0.439, alpha: 1.000)
107
+ /** Primary surface color used for main backgrounds and large layout areas (e.g., page background, primary containers).
108
+ Behavior: Dynamic adapts between light and dark surface tokens to maintain legibility and hierarchy. */
109
+ public static let SemanticSurfaceSurfaceColorPrimary = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
110
+ /** Inverse of the primary surface, used when Light and Dark surfaces are swapped (e.g., inverse cards or elevated sections).
111
+ Behavior: Dynamic switches between dark and light values depending on mode. */
112
+ public static let SemanticSurfaceSurfaceColorPrimaryInverse = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
113
+ /** A fixed light surface tone used when a consistent light background is required (e.g., light panels within dark layouts).
114
+ Behavior: Constant remains the same in both modes. */
115
+ public static let SemanticSurfaceSurfaceColorPrimaryConstantLight = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
116
+ /** A fixed dark surface tone used for dark overlays or nested dark sections inside light layouts.
117
+ Behavior: Constant identical across Light and Dark mode. */
118
+ public static let SemanticSurfaceSurfaceColorPrimaryConstantDark = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
119
+ /** Used for secondary surface layers such as cards, panels, or nested containers that need to differentiate themselves from the primary surface. .
120
+ Behavior: Dynamic adapts brightness level based on mode for appropriate depth contrast. */
121
+ public static let SemanticSurfaceSurfaceColorSecondary = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 1.000)
122
+ /** Tertiary background layer for inner containers, grouped content, or subtle elevation steps that need to differentiate themselves from the primary and secondary surfaces.
123
+ Behavior: Dynamic switches between light and dark tertiary tones. */
124
+ public static let SemanticSurfaceSurfaceColorTertiary = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
125
+ /** Inverse tertiary background, applied when Light and Dark surfaces are reversed (e.g., dark-on-light cards).
126
+ Behavior: Dynamic swaps values between modes for contrast preservation. */
127
+ public static let SemanticSurfaceSurfaceColorTertiaryInverse = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
128
+ /** HIghtest elevation surface color, typically used for grouping or background accents to differentiate themselves from all previous surface color options. Uses corresponding light/dark tones for consistent layering. */
129
+ public static let SemanticSurfaceSurfaceColorQuartenary = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
130
+ /** Inverse of the quartenary surface, used for background reversals in mixed-layout areas.
131
+ Behavior: Dynamic inverts between dark and light tones depending on mode. */
132
+ public static let SemanticSurfaceSurfaceColorQuartenaryInverse = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
133
+ /** Success-related background used for positive notifications, confirmation surfaces, or success banners.
134
+ Behavior: Constant remains the same across Light and Dark mode to ensure brand alignment. */
135
+ public static let SemanticSurfaceSurfaceColorSuccess = UIColor(red: 0.812, green: 0.961, blue: 0.890, alpha: 1.000)
136
+ /** Defines the end stops for primary surface gradients, creating visual depth or elevation. Used next to sliders buttons and slider container edges for fading out content. Behavior: Dynamic light gradients in Light mode, dark gradients in Dark mode. */
137
+ public static let SemanticSurfaceSurfaceColorPrimaryGradientStop = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 0.000)
138
+ /** Used for secondary surface gradients or subtle depth layers across backgrounds.
139
+ Behavior: Dynamic adapts to mode brightness for smooth gradient transitions. */
140
+ public static let SemanticSurfaceSurfaceColorSecondaryGradientStop = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 0.000)
141
+ /** Represents tertiary-level gradient background.
142
+ Currently used on skeletons. */
143
+ public static let SemanticSurfaceSurfaceColorTertiaryGradientStop = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 0.000)
144
+ /** Primary color for headings and display typography. Ensures clear hierarchy and optimal readability on main surfaces. Adapds it´s color based on the brand mode for brand recognition.
145
+ Behavior: Dynamic — dark text in Light mode, light text in Dark mode. */
146
+ public static let SemanticHeadingHeadlineColorPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
147
+ /** Fixed white heading color used on dark or colored backgrounds (e.g., hero sections, banners) that remain constant across modes.
148
+ Behavior: Constant remains white in both Light and Dark mode. */
149
+ public static let SemanticHeadingHeadlineColorWhiteConst = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
150
+ /** Used for kicker text and category labels placed directly on standard surface backgrounds.
151
+ Behavior: Dynamic — adjusts between red for Light and a neutral tone in Dark modes. */
152
+ public static let SemanticHeadingKickerTextColorOnSurface = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
153
+ /** Specialized kicker color for use on red or brand-colored backgrounds (e.g., red kicker bg within teaser cards).
154
+ Behavior: Constant remains consistent across light and darkmode. */
155
+ public static let SemanticHeadingKickerTextColorOnRed = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
156
+ /** Applied to kicker or meta text on dark colored backgrounds to maintain high legibility.
157
+ Behavior: Constant — always uses semi-transparent white for consistent readability. */
158
+ public static let SemanticHeadingKickerTextColorOnDarkBg = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.800)
159
+ /** Used for kicker text placed on bright or light colored backgrounds. Ensures balanced contrast without harsh visual dominance.
160
+ Behavior: Constant remains semi-transparent black across both modes. */
161
+ public static let SemanticHeadingKickerTextColorOnBrightBg = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.700)
162
+ /** Main text color used for body copy and all primary textual content. Ensures optimal readability and contrast on standard surfaces.
163
+ Behavior: Dynamicswitches between dark text on light backgrounds and light text on dark backgrounds. */
164
+ public static let SemanticTextTextColorPrimary = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
165
+ /** Used when primary text color must remain fixed regardless of mode (e.g., on light constant backgrounds).
166
+ Behavior: Constant same tone across Light and Dark mode. */
167
+ public static let SemanticTextTextColorPrimaryConstant = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
168
+ /** Inverse text color used on opposing surfaces (e.g., white text on red or dark backgrounds).
169
+ Behavior: Dynamic — alternates between light and dark mode. */
170
+ public static let SemanticTextTextColorPrimaryInverse = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
171
+ /** Fixed inverse tone for text that always appears on dark surfaces (e.g., hero headlines or persistent dark cards).
172
+ Behavior: Constant unchanged across modes. */
173
+ public static let SemanticTextTextColorPrimaryInverseConstant = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
174
+ /** Secondary text color used for supportive information, subtitles, and less prominent text.
175
+ Behavior: Dynamic adapts between neutral tones to maintain proper contrast per theme. In 2025 css it is called figure meta. */
176
+ public static let SemanticTextTextColorSecondary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
177
+ /** Muted text tone for subtle information, timestamps, or inactive text elements.
178
+ Behavior: Dynamic adjusts between mid-gray in Light mode and lighter gray in Dark mode. */
179
+ public static let SemanticTextTextColorMuted = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
180
+ /** Used for text displayed on dark surfaces to ensure maximum legibility and contrast.
181
+ Behavior: Constantalways light neutral to guarantee accessibility on dark backgrounds. */
182
+ public static let SemanticTextTextColorOnDarkSurface = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
183
+ /** Accent text color used for links, interactive text, or highlighted key words. Changes from a red in light mode to a white in dark mode. */
184
+ public static let SemanticTextTextColorAccent = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
185
+ /** Applies to text elements requiring fixed brand color usage (e.g., permanent links, brand slogans on constant backgrounds).
186
+ Behavior: Constant — maintains identical red tone across Light and Dark mode. */
187
+ public static let SemanticTextTextColorAccentConstant = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
188
+ /** Used for positive or success-related messages (e.g., “Saved”, “Success”, or confirmation text) on success surface colors.
189
+ Behavior: Constant green tone remains consistent across both modes. */
190
+ public static let SemanticTextTextColorSuccessConstant = UIColor(red: 0.000, green: 0.431, blue: 0.239, alpha: 1.000)
191
+ /** Used for strong warnings, errors, or destructive action labels.
192
+ Behavior: Constant — red color remains unchanged between Light and Dark mode for visibility and recognition. */
193
+ public static let SemanticTextTextColorAttentionHigh = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
194
+ /** Represents medium attention states, often used in warnings or pending states.
195
+ Behavior: Constant same orange tone across Light and Dark mode. */
196
+ public static let SemanticTextTextColorAttentionMedium = UIColor(red: 0.988, green: 0.510, blue: 0.149, alpha: 1.000)
197
+ /** Primary label color used for labels, badges, or tag text on light backgrounds. Ensures strong readability and visual hierarchy.
198
+ Behavior: Dynamic dark neutral in Light mode, light neutral in Dark mode. */
199
+ public static let SemanticLabelLabelColorPrimary = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
200
+ /** Inverse version of the primary label color, used on dark or colored backgrounds.
201
+ Behavior: Dynamicswitches between light and dark. */
202
+ public static let SemanticLabelLabelColorPrimaryInverse = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
203
+ /** Used when primary label color should remain unchanged across modes in static UI areas.
204
+ Behavior: Constant identical tone in both Light and Dark mode. */
205
+ public static let SemanticLabelLabelColorPrimaryConstant = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
206
+ /** Fixed inverse label tone applied where white or bright text must always appear, regardless of theme.
207
+ Behavior: Constant — remains bright neutral in both Light and Dark mode. */
208
+ public static let SemanticLabelLabelColorPrimaryInverseConstant = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
209
+ /** Secondary label tone used for less prominent text such as secondary badges or supporting labels.
210
+ Behavior: Dynamic adapts between mid-grays for Light and Dark surfaces. */
211
+ public static let SemanticLabelLabelColorSecondary = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
212
+ /** Tertiary label tone for subtle, low-emphasis UI text such as placeholder text or tertiary badges.
213
+ Behavior: Constant identical tone across both modes for stable hierarchy. */
214
+ public static let SemanticLabelLabelColorTertiary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
215
+ /** Disabled label tone indicating inactive or unavailable states in UI elements.
216
+ Behavior: Dynamic — lighter gray in Light mode, darker neutral in Dark mode. */
217
+ public static let SemanticLabelLabelColorDisabled = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
218
+ public static let SemanticLayerOpacityLayerOpacity00 = 0
219
+ public static let SemanticLayerOpacityLayerOpacity05 = 5
220
+ public static let SemanticLayerOpacityLayerOpacity10 = 10
221
+ public static let SemanticLayerOpacityLayerOpacity20 = 20
222
+ public static let SemanticLayerOpacityLayerOpacity30 = 30
223
+ public static let SemanticLayerOpacityLayerOpacity40 = 40
224
+ public static let SemanticLayerOpacityLayerOpacity50 = 50
225
+ public static let SemanticLayerOpacityLayerOpacity60 = 60
226
+ public static let SemanticLayerOpacityLayerOpacity70 = 70
227
+ public static let SemanticLayerOpacityLayerOpacity80 = 80
228
+ public static let SemanticLayerOpacityLayerOpacity90 = 90
229
+ public static let SemanticLayerOpacityLayerOpacity100 = 100
230
+ /** 09-2025 css --article-author-name-color */
231
+ public static let ComponentAvatarAvatarLabelColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
232
+ /** 09-2025 css --article-author-name-color */
233
+ public static let ComponentAvatarAvatarLabelColorHover = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
234
+ /** On marketing offer surfaces this variable is usually not used. The alertSurfaceConstant variables should be used. This token changes color between light and dark modes. L:100 / D:025 */
235
+ public static let ComponentAlertAlertSurfaceColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
236
+ /** On marketing offer surfaces this variable is used. */
237
+ public static let ComponentAlertAlertSurfaceColorConstant = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
238
+ /** Use this token on breadcrumbs that are in their default idle state. This token changes color between light and dark modes. L:035 / D:096 */
239
+ public static let ComponentBreadcrumbBreadcrumbTextColorIdle = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
240
+ /** Use this token on breadcrumbs that the user's pointer is hovering on or clicked on. This token changes color between light and dark modes. L:015 / D:100 */
241
+ public static let ComponentBreadcrumbBreadcrumbTextColorHover = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
242
+ public static let ComponentBreakingNewsBreakingNewsTopTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1.000)
243
+ public static let ComponentBreakingNewsBreakingNewsBottomTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1.000)
244
+ public static let ComponentBreakingNewsBreakingNewsTitleSurfaceColor = UIColor(red: 0.988, green: 0.510, blue: 0.149, alpha: 1.000)
245
+ public static let ComponentBreakingNewsBreakingNewsSurfaceColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
246
+ public static let ComponentBreakingNewsBreakingNewsTextContentColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
247
+ public static let ComponentButtonPrimaryButtonPrimaryLabelColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
248
+ /** Use this variable on the neutral color primary button. Tone changes between light and dark mode. Light mode Bild & SpoBi: Tone 015 ; Dark mode Bild & SpoBi: Tone 100 */
249
+ public static let ComponentButtonPrimaryButtonPrimaryNeutralBgColorIdle = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
250
+ public static let ComponentButtonPrimaryButtonPrimaryNeutralBgColorHover = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
251
+ public static let ComponentButtonPrimaryButtonPrimaryBrandBgColorIdle = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 1.000)
252
+ public static let ComponentButtonPrimaryButtonPrimaryBrandBgColorHover = UIColor(red: 0.690, green: 0.000, blue: 0.012, alpha: 1.000)
253
+ public static let ComponentButtonPrimaryButtonPrimarySuccessColorIdle = UIColor(red: 0.090, green: 0.600, blue: 0.361, alpha: 1.000)
254
+ public static let ComponentButtonPrimaryButtonPrimarySuccessColorHover = UIColor(red: 0.000, green: 0.431, blue: 0.239, alpha: 1.000)
255
+ public static let ComponentButtonSecondaryButtonSecondaryLabelColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
256
+ public static let ComponentButtonSecondaryButtonSecondaryBgColorIdle = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
257
+ public static let ComponentButtonSecondaryButtonSecondaryBgColorHover = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 0.500)
258
+ public static let ComponentButtonTertiaryButtonTertiaryLabelColor = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
259
+ public static let ComponentButtonTertiaryButtonTertiaryBorderColorIdle = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
260
+ public static let ComponentButtonTertiaryButtonTertiaryBorderColorHover = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
261
+ public static let ComponentButtonTertiaryButtonTertiarySuccessBgColorHover = UIColor(red: 0.000, green: 0.612, blue: 0.349, alpha: 0.500)
262
+ public static let ComponentButtonTertiaryButtonTertiarySuccessBorderColor = UIColor(red: 0.090, green: 0.600, blue: 0.361, alpha: 1.000)
263
+ public static let ComponentButtonGhostButtonGhostBgColorHover = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 0.500)
264
+ public static let ComponentButtonButtonLiveTickerLoadNewSurfaceColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
265
+ public static let ComponentButtonButtonLiveTickerLoadNewLabelColor = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
266
+ public static let ComponentCardCardSurfaceBgColor = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 1.000)
267
+ public static let ComponentChipsChipsBgColorIdle = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
268
+ public static let ComponentChipsChipsBgColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
269
+ public static let ComponentChipsChipsBgColorHover = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
270
+ public static let ComponentChipsChipsLabelColorIdle = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
271
+ public static let ComponentChipsChipsLabelColorHover = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
272
+ public static let ComponentDropdownDropdownBgColorIdle = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
273
+ public static let ComponentDropdownDropdownBgColorHover = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
274
+ public static let ComponentEmptiesEmptiesLogoColor = UIColor(red: 0.169, green: 0.188, blue: 0.220, alpha: 1.000)
275
+ public static let ComponentEmptiesEmptiesBgColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
276
+ public static let ComponentFoldoutFoldoutLabelColorIdle = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
277
+ public static let ComponentFoldoutFoldoutLabelColorActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
278
+ public static let ComponentGalleryAppImageLightboxGalleryBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 1.000)
279
+ public static let ComponentHeyHeyDrawerSurfaceColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
280
+ public static let ComponentHeyHeyFavInputFieldSurfaceColor = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
281
+ public static let ComponentHeyHeyIconUtilColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
282
+ /** This is the most used color for separators across Bild products. */
283
+ public static let ComponentHeyHeySeparatorColor = UIColor(red: 0.400, green: 0.420, blue: 0.439, alpha: 1.000)
284
+ public static let ComponentHeyHeyTextColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
285
+ public static let ComponentInputFieldInputFieldBorderColorIdle = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
286
+ public static let ComponentInputFieldInputFieldBorderColorActive = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
287
+ public static let ComponentInputFieldInputFieldBorderColorDark = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
288
+ public static let ComponentInputFieldInputFieldBorderColorDarkActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
289
+ public static let ComponentInputFieldInputFieldBgColorDarkLowContrast = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
290
+ public static let ComponentInputFieldInputFieldBgColorDarkMediumContrast = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
291
+ public static let ComponentInputFieldInputFieldBgColorDarkHighContrast = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
292
+ public static let ComponentKickerStandardKickerBgColorOnSurface = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
293
+ public static let ComponentKickerPartnerKickerBzBgColor = UIColor(red: 0.890, green: 0.000, blue: 0.110, alpha: 1.000)
294
+ public static let ComponentKickerPartnerKickerFitbookBgColor = UIColor(red: 1.000, green: 0.588, blue: 0.722, alpha: 1.000)
295
+ public static let ComponentKickerPartnerKickerPetbookBgColor = UIColor(red: 0.729, green: 0.859, blue: 0.569, alpha: 1.000)
296
+ public static let ComponentKickerPartnerKickerMyhomebookBgColor = UIColor(red: 0.400, green: 0.800, blue: 0.800, alpha: 1.000)
297
+ public static let ComponentKickerPartnerKickerTravelbookBgColor = UIColor(red: 0.561, green: 0.941, blue: 0.929, alpha: 1.000)
298
+ public static let ComponentKickerPartnerKickerTechbookBgColor = UIColor(red: 0.580, green: 0.890, blue: 1.000, alpha: 1.000)
299
+ public static let ComponentKickerPartnerKickerKaufberaterBgColor = UIColor(red: 0.329, green: 0.278, blue: 0.431, alpha: 1.000)
300
+ public static let ComponentKickerPartnerKickerCobiBgColor = UIColor(red: 0.859, green: 0.141, blue: 0.110, alpha: 1.000)
301
+ public static let ComponentKickerPartnerKickerAubiBgColor = UIColor(red: 0.941, green: 0.000, blue: 0.000, alpha: 1.000)
302
+ public static let ComponentKickerPartnerKickerSpobiBgColor = UIColor(red: 0.090, green: 0.271, blue: 0.510, alpha: 1.000)
303
+ public static let ComponentMediaplayerVidPlayerControlsAutoplayButtonBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.200)
304
+ /** This variable is used for hover states of video player control buttons. */
305
+ public static let ComponentMediaplayerVidPlayerControlButtonsBgHoverColor = UIColor(red: 0.871, green: 0.000, blue: 0.000, alpha: 0.800)
306
+ public static let ComponentMediaplayerVidPlayerControlButtonsBgColorHover = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.200)
307
+ public static let ComponentMediaplayerVidPlayerControlButtonsBgColorPressed = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.050)
308
+ public static let ComponentMediaplayerVidPlayerOverlayScrimColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.500)
309
+ public static let ComponentMediaplayerAudioPlayerPlayButtonBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.300)
310
+ public static let ComponentMediaplayerVidPlayerTooltipBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.700)
311
+ public static let ComponentMediaplayerVidPlayerProgressBarPreloadBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.300)
312
+ public static let ComponentMediaplayerVidPlayerUnmuteButtonBgColor = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.200)
313
+ public static let ComponentMediaplayerVidPlayerUnmuteButtonBgColorHover = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.350)
314
+ public static let ComponentMenuMenuSurfaceColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
315
+ /** Used on a thin part at the top of header in navigation menu. */
316
+ public static let ComponentMenuMenuScrolledSurfaceGradientColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 0.950)
317
+ public static let ComponentMenuMenuLinkLaneSurfaceColor = UIColor(red: 0.141, green: 0.149, blue: 0.161, alpha: 1.000)
318
+ public static let ComponentMenuMenuLinkLaneLabelColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
319
+ public static let ComponentMenuMenuLinkLaneLabelColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
320
+ public static let ComponentMenuAppTopBarSurfaceColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
321
+ public static let ComponentMenuAppTopBarIconColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
322
+ public static let ComponentMenuAppTopBarTextColorPrimary = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
323
+ public static let ComponentMenuAppTobBarTabNavBottomBorder = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
324
+ public static let ComponentMenuAppTobBarTabNavBottomBorderActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
325
+ public static let ComponentMenuItemMenuItemLabelColorPrimary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
326
+ public static let ComponentMenuItemMenuItemLabelColorPrimaryActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
327
+ /** The variable can be used on secondary menus that many times show up on dedicated home pages specific to a topic. The menu labels are often times using the color white across color modes. */
328
+ public static let ComponentMenuItemMenuItemLabelColorSecondary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
329
+ public static let ComponentMenuItemMenuItemBorderColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
330
+ /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
331
+ public static let ComponentPartnerLinksPartnerLinksBgColorIdle = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
332
+ /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
333
+ public static let ComponentPartnerLinksPartnerLinksBgColorActive = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
334
+ /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
335
+ public static let ComponentPartnerLinksPartnerLinksBorderColorIdle = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
336
+ /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
337
+ public static let ComponentPartnerLinksPartnerLinksBorderColorActive = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
338
+ /** !do not use! these variables have been deprecated and multitext link buttons are now classified as partner buttons. */
339
+ public static let ComponentPartnerLinksPartnerLinksContainerBorderColor = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
340
+ public static let ComponentNewstickerNewsTickerTimestampColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
341
+ public static let ComponentNewstickerNewsTickerBadgeIconsColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
342
+ public static let ComponentPaginationPaginationElementColorDefault = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
343
+ public static let ComponentPaginationPaginationElementColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
344
+ /** Use this on gallery slider pagination elements. This can also be applied to hover states of those elements. */
345
+ public static let ComponentPaginationGalleryPaginationElementActiveOpacity = 100
346
+ /** Used as the background surface color scroll bars. Found on components that vertically or horizontally stack elements. */
347
+ public static let ComponentPaginationScrollBarTrackBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.100)
348
+ /** Use on the scroll bar interactive element which shows where the scroll view is positioned inside the full extent of the scrolling space. */
349
+ public static let ComponentPaginationScrollBarThumbBgColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
350
+ /** Checkboxes and Radio buttons use this variable for their border. */
351
+ public static let ComponentSelectionSelectionBorderColor = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
352
+ /** When users hover on gallery slider buttons the opacity changes to 90%. */
353
+ public static let ComponentSliderSliderButtonOpacity = 90
354
+ /** This variable is used on audio player slider bars. It references a pure white with 35% opacity. */
355
+ public static let ComponentSliderSliderTrackBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.350)
356
+ public static let ComponentSocialShareButtonSocialShareButtonLabelColorDefault = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
357
+ public static let ComponentSocialShareButtonSocialShareButtonLabelColorActive = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
358
+ public static let ComponentSocialShareButtonSocialShareButtonBgColorDefault = UIColor(red: 0.290, green: 0.322, blue: 0.349, alpha: 1.000)
359
+ public static let ComponentSocialShareButtonSocialShareButtonBgColorActive = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
360
+ public static let ComponentSubheaderSubheadersColor = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
361
+ public static let ComponentTabTabBgColorHover = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
362
+ public static let ComponentTabTabLabelColorActive = UIColor(red: 0.949, green: 0.961, blue: 0.961, alpha: 1.000)
363
+ public static let ComponentTabTabLabelColorDefault = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
364
+ public static let ComponentTabAppBottomTabBarBgColor = UIColor(red: 0.200, green: 0.239, blue: 0.251, alpha: 1.000)
365
+ /** When users hover over graphical teasers the image reduces opacity to 80%. */
366
+ public static let ComponentTeaserTeaserHoverOpacity = 80
367
+ public static let ComponentTeaserTeaserTitleBackgroundGradientStart = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.700)
368
+ public static let ComponentTeaserTeaserTitleBackgroundGradientStop = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.000)
369
+ public static let ComponentTextLinkTextLinkColorPrimary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
370
+ public static let ComponentTextLinkTextLinkColorSecondary = UIColor(red: 0.812, green: 0.831, blue: 0.851, alpha: 1.000)
371
+ public static let ComponentTextLinkTextLinkColorSecondaryActive = UIColor(red: 0.910, green: 0.929, blue: 0.941, alpha: 1.000)
372
+ public static let Component_DSysDocDsDocSpacingItemBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.200)
373
+ public static let Component_DSysDocDsDocSpacingItemBorderColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 0.800)
374
+ /** This variable is only for use in Figma's Design System File. It is automating some of the content in documentation pages. */
375
+ public static let Component_DSysDoc_DSysDocs_labelTextSurfaceColorPrimaryPrimitiveName = "BILD010"
376
+ /** This is currently for use in this design system's documentation texts. It is a text string made for being used in light and dark mode documentation texts. */
377
+ public static let Component_DSysDoc_DSysDocs_labelTextColorMode = "(Dark Mode)"
378
+ }