@marioschmidt/design-system-tokens 1.0.19 → 1.0.20

package/dist/ios/brands/bild/density/DensityCompact.swift

@@ -9,12 +9,20 @@
 import UIKit
 
 public class DensityCompact {
-    public static let componentButtonButtonContentGapSpace = CGFloat(96.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentButtonButtonInlineSpace = CGFloat(256.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentButtonButtonLabelFontSize = CGFloat(240.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across devices: 15 - 17 - 19 */
-    public static let componentButtonButtonStackSpace = CGFloat(96.00) /** This variable is in the SpaceScaling collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentInputfieldInputFieldHeightSize = CGFloat(576.00)
-    public static let componentInputfieldInputFieldInlineSpace = CGFloat(256.00)
-    public static let componentInputfieldInputFieldLabelFontSize = CGFloat(256.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across scaling options: compact 15 - default 17 - spacious 19 */
-    public static let componentInputfieldInputFieldStackSpace = CGFloat(96.00)
-}
+    // MARK: - Component - Button
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonContentGapSpace = "6px"
+    /** This variable is in the SpaceScaling collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonStackSpace = "6px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across devices: 15 - 17 - 19 */
+    public static let ButtonLabelFontSize = "15px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonInlineSpace = "16px"
+
+    // MARK: - Component - Inputfield
+    public static let InputFieldInlineSpace = "16px"
+    public static let InputFieldStackSpace = "6px"
+    public static let InputFieldHeightSize = "36px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across scaling options: compact 15 - default 17 - spacious 19 */
+    public static let InputFieldLabelFontSize = "16px"
+}

package/dist/ios/brands/bild/density/DensityDefault.swift

@@ -9,12 +9,20 @@
 import UIKit
 
 public class DensityDefault {
-    public static let componentButtonButtonContentGapSpace = CGFloat(128.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentButtonButtonInlineSpace = CGFloat(320.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentButtonButtonLabelFontSize = CGFloat(272.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across devices: 15 - 17 - 19 */
-    public static let componentButtonButtonStackSpace = CGFloat(128.00) /** This variable is in the SpaceScaling collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentInputfieldInputFieldHeightSize = CGFloat(640.00)
-    public static let componentInputfieldInputFieldInlineSpace = CGFloat(256.00)
-    public static let componentInputfieldInputFieldLabelFontSize = CGFloat(272.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across scaling options: compact 15 - default 17 - spacious 19 */
-    public static let componentInputfieldInputFieldStackSpace = CGFloat(128.00)
-}
+    // MARK: - Component - Button
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonContentGapSpace = "8px"
+    /** This variable is in the SpaceScaling collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonStackSpace = "8px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across devices: 15 - 17 - 19 */
+    public static let ButtonLabelFontSize = "17px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonInlineSpace = "20px"
+
+    // MARK: - Component - Inputfield
+    public static let InputFieldInlineSpace = "16px"
+    public static let InputFieldStackSpace = "8px"
+    public static let InputFieldHeightSize = "40px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across scaling options: compact 15 - default 17 - spacious 19 */
+    public static let InputFieldLabelFontSize = "17px"
+}

package/dist/ios/brands/bild/density/DensitySpacious.swift

@@ -9,12 +9,20 @@
 import UIKit
 
 public class DensitySpacious {
-    public static let componentButtonButtonContentGapSpace = CGFloat(128.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentButtonButtonInlineSpace = CGFloat(384.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentButtonButtonLabelFontSize = CGFloat(304.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across devices: 15 - 17 - 19 */
-    public static let componentButtonButtonStackSpace = CGFloat(192.00) /** This variable is in the SpaceScaling collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
-    public static let componentInputfieldInputFieldHeightSize = CGFloat(768.00)
-    public static let componentInputfieldInputFieldInlineSpace = CGFloat(256.00)
-    public static let componentInputfieldInputFieldLabelFontSize = CGFloat(304.00) /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across scaling options: compact 15 - default 17 - spacious 19 */
-    public static let componentInputfieldInputFieldStackSpace = CGFloat(192.00)
-}
+    // MARK: - Component - Button
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonContentGapSpace = "8px"
+    /** This variable is in the SpaceScaling collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonStackSpace = "12px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across devices: 15 - 17 - 19 */
+    public static let ButtonLabelFontSize = "19px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling space could work across different content scaling / size / contrast themes. */
+    public static let ButtonInlineSpace = "24px"
+
+    // MARK: - Component - Inputfield
+    public static let InputFieldInlineSpace = "16px"
+    public static let InputFieldStackSpace = "12px"
+    public static let InputFieldHeightSize = "48px"
+    /** This variable is in the SpaceScaling Collection. It was made to experiment with how scaling size could work across different content scaling / size / contrast themes. Font size across scaling options: compact 15 - default 17 - spacious 19 */
+    public static let InputFieldLabelFontSize = "19px"
+}

package/dist/ios/brands/bild/overrides/Brandcolormapping.swift

@@ -9,72 +9,145 @@
 import UIKit
 
 public class Brandcolormapping {
-    public static let componentAvatarAvatarLabelColor = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** 09-2025 css --article-author-name-color // Bild: 015; SpoBi: 045 */
-    public static let componentAvatarAvatarLabelColorDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** 09-2025 css --article-author-name-color // Bild: 100; SpoBi: 093 */
-    public static let componentAvatarAvatarLabelColorHover = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** This variable is used for decorating the avatar text's underline color. Bild: 046; SpoBi: 029 */
-    public static let componentBreakingNewsBreakingNewsBottomTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1) /** This variable is used for the color of the "News" word in the breaking news horizontal animated headlines strip. Bild: 010 ; SpoBi: 100 */
-    public static let componentBreakingNewsBreakingNewsSurfaceColor = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** This variable is used on the breaking news strip that has horizontally animated headlines. Bild: 015 ; SpoBi: 081 */
-    public static let componentBreakingNewsBreakingNewsSurfaceColorDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1) /** This variable is for the background color of the horizontally animated strip with headlines for breaking news on dark mode.  Bild: 093 ; SpoBi: 081 */
-    public static let componentBreakingNewsBreakingNewsTextContentColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** This variable is used on the text for headlines in the horizontally animated breaking news strip. Bild: 100 ; SpoBi: 015 */
-    public static let componentBreakingNewsBreakingNewsTextContentColorDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** This variable is used on the text for headlines in the horizontally animated breaking news strip on dark mode. Bild&SpoBi: 015 */
-    public static let componentBreakingNewsBreakingNewsTitleSurfaceColor = UIColor(red: 0.992, green: 0.510, blue: 0.153, alpha: 1) /** This variable is used for the background color of the "Breaking News" title. Bild: 067 ; SpoBi: 016 */
-    public static let componentBreakingNewsBreakingNewsTopTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1) /** This variable is used for the color of the "breaking" word in the "breaking news" horizontally animated headlines strip. Bild: 010 ; SpoBi: 081 */
-    public static let componentButtonPrimaryBrandButtonPrimaryBgColorHover = UIColor(red: 0.686, green: 0.000, blue: 0.008, alpha: 1) /** Bild: 035 ; SpoBi: 016 */
-    public static let componentButtonPrimaryBrandButtonPrimaryBgColorHoverDark = UIColor(red: 0.686, green: 0.000, blue: 0.008, alpha: 1) /** This variable stores colors for the hover state of primary buttons for two brands in dark mode. Bild: 035 ; SpoBi: 029 */
-    public static let componentButtonPrimaryBrandButtonPrimaryBgColorIdle = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** Bild: 046 ; SpoBi: 029 */
-    public static let componentButtonPrimaryBrandButtonPrimaryBgColorIdleDark = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** This variable controls the primary button idle color for two brands in dark mode. Bild: 046 ; SpoBi: 038 */
-    public static let componentButtonPrimaryNeutralButtonPrimaryBgColorHover = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1) /** Bild & SpoBi: Tone 035 */
-    public static let componentButtonPrimaryNeutralButtonPrimaryBgColorHoverDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1) /** Bild: 093 ; SpoBi: 081 */
-    public static let componentButtonPrimaryNeutralButtonPrimaryBgColorIdle = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** Bild & SpoBi: Tone 015 */
-    public static let componentButtonPrimaryNeutralButtonPrimaryBgColorIdleDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Bild & SpoBi: Tone 100 */
-    public static let componentChipColorActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1)
-    public static let componentMenuAppBottomTabBarBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
-    public static let componentMenuAppBottomTabBarBgDark = UIColor(red: 0.204, green: 0.235, blue: 0.255, alpha: 1)
-    public static let componentMenuAppTobBarTabNavBottomBorder = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1)
-    public static let componentMenuAppTobBarTabNavBottomBorderActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1)
-    public static let componentMenuAppTobBarTabNavBottomBorderActiveDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
-    public static let componentMenuAppTobBarTabNavBottomBorderDark = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1)
-    public static let componentMenuAppTopBarBgColorDark = UIColor(red: 0.204, green: 0.235, blue: 0.255, alpha: 1)
-    public static let componentMenuAppTopBarIconColor = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1)
-    public static let componentMenuAppTopBarIconColorDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
-    public static let componentMenuAppTopBarSurfaceColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
-    public static let componentMenuAppTopBarTextColor = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1)
-    public static let componentMenuAppTopBarTextColorDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1)
-    public static let componentMenuMenuLinkColorBorderActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1)
-    public static let componentMenuMenuLinkColorBorderActiveDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1)
-    public static let componentMenuMenuLinkLaneLabelColor = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1) /** This variable is used for making possible the default color difference between the Bild and SportBild link lane labels inside the menu component. */
-    public static let componentMenuMenuLinkLaneLabelColorActive = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** This variable is used for making possible the active color difference between the Bild and SportBild link lane labels inside the menu component. */
-    public static let componentMenuMenuLinkLaneLabelColorDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1)
-    public static let componentMenuMenuLinkLaneSurfaceColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** This variable is used for making possible the default color difference between the Bild and SportBild link lanes inside the menu component. */
-    public static let componentMenuMenuLinkLaneSurfaceColorDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** This variable is used for making possible the default color difference between the Bild and SportBild link lanes inside the menu component on Dark mode. */
-    public static let componentTeaserTeaserTitleBackgroundGradientStart = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.699999988079071)
-    public static let componentTeaserTeaserTitleBackgroundGradientStop = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)
-    public static let globalAttentionAccentColorPrimary = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** Bild: Tone 046 ; SpoBi: 016 This variable is used on small UI elements such as the background color for kickers. */
-    public static let globalAttentionAccentColorPrimaryDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Bild: 100 ; SpoBi: 098 */
-    public static let globalCoreCoreColorPrimary = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** Bild: 046; SpoBi: 016 current css calls this variable main tenant color */
-    public static let globalCoreCoreColorSecondary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Bild&SpoBi Tone 100 */
-    public static let globalCoreCoreColorSecondaryDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** Bild: 015 ; SpoBi: 010 */
-    public static let globalCoreCoreColorTertiary = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** Bild: 015 ; SpoBi: 010 */
-    public static let globalCoreCoreColorTertiaryDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Bild&SpoBi: 100 */
-    public static let globalStateColorPrimaryActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** Bild: 046 ; SpoBi: 029 */
-    public static let globalStateColorPrimaryActiveDark = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** Bild: 046 ; SpoBi: 098 */
-    public static let globalSurfaceSurfaceColorPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Bild: 100 ; SpoBi: 100 */
-    public static let globalSurfaceSurfaceColorPrimaryDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** Bild: 015 ; SpoBi: 010 */
-    public static let globalSurfaceSurfaceColorQuartenary = UIColor(red: 0.808, green: 0.831, blue: 0.855, alpha: 1) /** Bild: 085 ; SpoBi: 085 */
-    public static let globalSurfaceSurfaceColorQuartenaryDark = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1) /** Bild: 035 ; SpoBi: 035 */
-    public static let globalSurfaceSurfaceColorSecondary = UIColor(red: 0.949, green: 0.957, blue: 0.961, alpha: 1) /** Bild: 096 ; SpoBi: 098 */
-    public static let globalSurfaceSurfaceColorSecondaryDark = UIColor(red: 0.173, green: 0.192, blue: 0.220, alpha: 1) /** Bild: 020 ; SpoBi: 016 */
-    public static let globalSurfaceSurfaceColorTertiary = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1) /** Bild: 093 ; SpoBi: 081 */
-    public static let globalSurfaceSurfaceColorTertiaryDark = UIColor(red: 0.204, green: 0.235, blue: 0.255, alpha: 1) /** Bild: 025 ; SpoBi: 029 */
-    public static let globalTextHeadlineColorPrimary = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** Bild: 015 ; SpoBi: 016 */
-    public static let globalTextHeadlineColorPrimaryDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** Bild&SpoBi: Tone 100 */
-    public static let globalTextKickerBgColorOnSurface = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** Use this variable for the color immediately behind the bounding box of the kicker text element. Bild: 046 ; SpoBi: 029 */
-    public static let globalTextKickerBgColorOnSurfaceDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Use this variable for the dark mode color of the background immediately around the kicker text element. Bild: 060 ; SpoBi: 060 */
-    public static let globalTextKickerTextColorOnBg = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1) /** This variable is used on kicker texts that are on top of a color that is different from the outer color of the overall user interface. Bild & SpoBi: Tone 100 */
-    public static let globalTextKickerTextColorOnSurface = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1) /** This variable is used for the color of kicker texts that are not no top of a different color of the overall user interface. Bild: 046 ; SpoBi: 060 */
-    public static let globalTextKickerTextColorOnSurfaceDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Use this variable for kicker texts that are directly on top of the color of the overall user interface. Bild & SpoBi tone 060. */
-    public static let globalTextTextColorPrimary = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1) /** Bild & SpoBi: Tone 015 */
-    public static let globalTextTextColorPrimaryDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1) /** Bild & SpoBi: Tone 093 */
-    public static let globalTextTextColorSecondary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Bild & SpoBi: Tone 060 */
-    public static let globalTextTextColorSecondaryDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1) /** Bild & SpoBi: Tone 060 */
-}
+    // MARK: - Component
+    public static let ChipColorActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+
+    // MARK: - Component - Avatar
+    /** 09-2025 css --article-author-name-color // Bild: 015; SpoBi: 045 */
+    public static let AvatarLabelColor = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** 09-2025 css --article-author-name-color // Bild: 100; SpoBi: 093 */
+    public static let AvatarLabelColorDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** This variable is used for decorating the avatar text's underline color. Bild: 046; SpoBi: 029 */
+    public static let AvatarLabelColorHover = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+
+    // MARK: - Component - BreakingNews
+    /** This variable is used on the text for headlines in the horizontally animated breaking news strip. Bild: 100 ; SpoBi: 015 */
+    public static let BreakingNewsTextContentColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** This variable is used on the breaking news strip that has horizontally animated headlines. Bild: 015 ; SpoBi: 081 */
+    public static let BreakingNewsSurfaceColor = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** This variable is used for the background color of the "Breaking News" title. Bild: 067 ; SpoBi: 016 */
+    public static let BreakingNewsTitleSurfaceColor = UIColor(red: 0.992, green: 0.510, blue: 0.153, alpha: 1.000)
+    /** This variable is used for the color of the "breaking" word in the "breaking news" horizontally animated headlines strip. Bild: 010 ; SpoBi: 081 */
+    public static let BreakingNewsTopTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1.000)
+    /** This variable is for the background color of the horizontally animated strip with headlines for breaking news on dark mode.  Bild: 093 ; SpoBi: 081 */
+    public static let BreakingNewsSurfaceColorDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1.000)
+    /** This variable is used on the text for headlines in the horizontally animated breaking news strip on dark mode. Bild&SpoBi: 015 */
+    public static let BreakingNewsTextContentColorDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** This variable is used for the color of the "News" word in the breaking news horizontal animated headlines strip. Bild: 010 ; SpoBi: 100 */
+    public static let BreakingNewsBottomTitleTextColor = UIColor(red: 0.110, green: 0.110, blue: 0.110, alpha: 1.000)
+
+    // MARK: - Component - Button - PrimaryBrand
+    /** Bild: 046 ; SpoBi: 029 */
+    public static let PrimaryBrandButtonPrimaryBgColorIdle = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** This variable controls the primary button idle color for two brands in dark mode. Bild: 046 ; SpoBi: 038 */
+    public static let PrimaryBrandButtonPrimaryBgColorIdleDark = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** Bild: 035 ; SpoBi: 016 */
+    public static let PrimaryBrandButtonPrimaryBgColorHover = UIColor(red: 0.686, green: 0.000, blue: 0.008, alpha: 1.000)
+    /** This variable stores colors for the hover state of primary buttons for two brands in dark mode. Bild: 035 ; SpoBi: 029 */
+    public static let PrimaryBrandButtonPrimaryBgColorHoverDark = UIColor(red: 0.686, green: 0.000, blue: 0.008, alpha: 1.000)
+
+    // MARK: - Component - Button - PrimaryNeutral
+    /** Bild & SpoBi: Tone 015 */
+    public static let PrimaryNeutralButtonPrimaryBgColorIdle = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** Bild & SpoBi: Tone 035 */
+    public static let PrimaryNeutralButtonPrimaryBgColorHover = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1.000)
+    /** Bild & SpoBi: Tone 100 */
+    public static let PrimaryNeutralButtonPrimaryBgColorIdleDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** Bild: 093 ; SpoBi: 081 */
+    public static let PrimaryNeutralButtonPrimaryBgColorHoverDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1.000)
+
+    // MARK: - Component - Menu
+    /** This variable is used for making possible the default color difference between the Bild and SportBild link lanes inside the menu component. */
+    public static let MenuLinkLaneSurfaceColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** This variable is used for making possible the default color difference between the Bild and SportBild link lane labels inside the menu component. */
+    public static let MenuLinkLaneLabelColor = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1.000)
+    public static let MenuLinkLaneLabelColorDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
+    /** This variable is used for making possible the default color difference between the Bild and SportBild link lanes inside the menu component on Dark mode. */
+    public static let MenuLinkLaneSurfaceColorDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    public static let MenuLinkColorBorderActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    public static let MenuLinkColorBorderActiveDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** This variable is used for making possible the active color difference between the Bild and SportBild link lane labels inside the menu component. */
+    public static let MenuLinkLaneLabelColorActive = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    public static let AppTopBarSurfaceColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    public static let AppTopBarBgColorDark = UIColor(red: 0.204, green: 0.235, blue: 0.255, alpha: 1.000)
+    public static let AppBottomTabBarBgColor = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    public static let AppBottomTabBarBgDark = UIColor(red: 0.204, green: 0.235, blue: 0.255, alpha: 1.000)
+    public static let AppTopBarIconColor = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1.000)
+    public static let AppTopBarIconColorDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
+    public static let AppTopBarTextColor = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    public static let AppTopBarTextColorDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1.000)
+    public static let AppTobBarTabNavBottomBorder = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1.000)
+    public static let AppTobBarTabNavBottomBorderDark = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1.000)
+    public static let AppTobBarTabNavBottomBorderActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    public static let AppTobBarTabNavBottomBorderActiveDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+
+    // MARK: - Component - Teaser
+    public static let TeaserTitleBackgroundGradientStart = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.700)
+    public static let TeaserTitleBackgroundGradientStop = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.000)
+
+    // MARK: - Global - Attention
+    /** Bild: Tone 046 ; SpoBi: 016 This variable is used on small UI elements such as the background color for kickers. */
+    public static let AccentColorPrimary = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** Bild: 100 ; SpoBi: 098 */
+    public static let AccentColorPrimaryDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+
+    // MARK: - Global - Core
+    /** Bild: 046; SpoBi: 016 current css calls this variable main tenant color */
+    public static let CoreColorPrimary = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** Bild&SpoBi Tone 100 */
+    public static let CoreColorSecondary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** Bild: 015 ; SpoBi: 010 */
+    public static let CoreColorSecondaryDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** Bild: 015 ; SpoBi: 010 */
+    public static let CoreColorTertiary = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** Bild&SpoBi: 100 */
+    public static let CoreColorTertiaryDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+
+    // MARK: - Global - State
+    /** Bild: 046 ; SpoBi: 029 */
+    public static let ColorPrimaryActive = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** Bild: 046 ; SpoBi: 098 */
+    public static let ColorPrimaryActiveDark = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+
+    // MARK: - Global - Surface
+    /** Bild: 100 ; SpoBi: 100 */
+    public static let SurfaceColorPrimary = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** Bild: 015 ; SpoBi: 010 */
+    public static let SurfaceColorPrimaryDark = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** Bild: 096 ; SpoBi: 098 */
+    public static let SurfaceColorSecondary = UIColor(red: 0.949, green: 0.957, blue: 0.961, alpha: 1.000)
+    /** Bild: 020 ; SpoBi: 016 */
+    public static let SurfaceColorSecondaryDark = UIColor(red: 0.173, green: 0.192, blue: 0.220, alpha: 1.000)
+    /** Bild: 093 ; SpoBi: 081 */
+    public static let SurfaceColorTertiary = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1.000)
+    /** Bild: 025 ; SpoBi: 029 */
+    public static let SurfaceColorTertiaryDark = UIColor(red: 0.204, green: 0.235, blue: 0.255, alpha: 1.000)
+    /** Bild: 085 ; SpoBi: 085 */
+    public static let SurfaceColorQuartenary = UIColor(red: 0.808, green: 0.831, blue: 0.855, alpha: 1.000)
+    /** Bild: 035 ; SpoBi: 035 */
+    public static let SurfaceColorQuartenaryDark = UIColor(red: 0.294, green: 0.322, blue: 0.353, alpha: 1.000)
+
+    // MARK: - Global - Text
+    /** Bild & SpoBi: Tone 015 */
+    public static let TextColorPrimary = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** Bild & SpoBi: Tone 093 */
+    public static let TextColorPrimaryDark = UIColor(red: 0.914, green: 0.925, blue: 0.937, alpha: 1.000)
+    /** Bild: 015 ; SpoBi: 016 */
+    public static let HeadlineColorPrimary = UIColor(red: 0.137, green: 0.149, blue: 0.161, alpha: 1.000)
+    /** Bild&SpoBi: Tone 100 */
+    public static let HeadlineColorPrimaryDark = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** This variable is used on kicker texts that are on top of a color that is different from the outer color of the overall user interface. Bild & SpoBi: Tone 100 */
+    public static let KickerTextColorOnBg = UIColor(red: 1.000, green: 1.000, blue: 1.000, alpha: 1.000)
+    /** This variable is used for the color of kicker texts that are not no top of a different color of the overall user interface. Bild: 046 ; SpoBi: 060 */
+    public static let KickerTextColorOnSurface = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** Use this variable for kicker texts that are directly on top of the color of the overall user interface. Bild & SpoBi tone 060. */
+    public static let KickerTextColorOnSurfaceDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
+    /** Bild & SpoBi: Tone 060 */
+    public static let TextColorSecondary = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
+    /** Bild & SpoBi: Tone 060 */
+    public static let TextColorSecondaryDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
+    /** Use this variable for the color immediately behind the bounding box of the kicker text element. Bild: 046 ; SpoBi: 029 */
+    public static let KickerBgColorOnSurface = UIColor(red: 0.867, green: 0.000, blue: 0.000, alpha: 1.000)
+    /** Use this variable for the dark mode color of the background immediately around the kicker text element. Bild: 060 ; SpoBi: 060 */
+    public static let KickerBgColorOnSurfaceDark = UIColor(red: 0.549, green: 0.569, blue: 0.588, alpha: 1.000)
+}