@synergy-design-system/metadata 1.0.0 → 3.0.1

package/data/layers/full/tokens/js/index.d.ts

@@ -0,0 +1,2224 @@
+/**
+ * @synergy-design-system/tokens version 3.12.1
+ * SICK Global UX Foundation
+ */
+
+/**
+ * Maps to the css variable `--syn-alert-error-color-background`
+ */
+export const SynAlertErrorColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-alert-error-color-border`
+ */
+export const SynAlertErrorColorBorder: string;
+
+/**
+ * Maps to the css variable `--syn-alert-error-color-icon`
+ */
+export const SynAlertErrorColorIcon: string;
+
+/**
+ * Maps to the css variable `--syn-alert-error-color-indicator`
+ */
+export const SynAlertErrorColorIndicator: string;
+
+/**
+ * Maps to the css variable `--syn-alert-informative-color-background`
+ */
+export const SynAlertInformativeColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-alert-informative-color-border`
+ */
+export const SynAlertInformativeColorBorder: string;
+
+/**
+ * Maps to the css variable `--syn-alert-informative-color-icon`
+ */
+export const SynAlertInformativeColorIcon: string;
+
+/**
+ * Maps to the css variable `--syn-alert-informative-color-indicator`
+ */
+export const SynAlertInformativeColorIndicator: string;
+
+/**
+ * Maps to the css variable `--syn-alert-neutral-color-background`
+ */
+export const SynAlertNeutralColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-alert-neutral-color-border`
+ */
+export const SynAlertNeutralColorBorder: string;
+
+/**
+ * Maps to the css variable `--syn-alert-neutral-color-icon`
+ */
+export const SynAlertNeutralColorIcon: string;
+
+/**
+ * Maps to the css variable `--syn-alert-neutral-color-indicator`
+ */
+export const SynAlertNeutralColorIndicator: string;
+
+/**
+ * Maps to the css variable `--syn-alert-success-color-background`
+ */
+export const SynAlertSuccessColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-alert-success-color-border`
+ */
+export const SynAlertSuccessColorBorder: string;
+
+/**
+ * Maps to the css variable `--syn-alert-success-color-icon`
+ */
+export const SynAlertSuccessColorIcon: string;
+
+/**
+ * Maps to the css variable `--syn-alert-success-color-indicator`
+ */
+export const SynAlertSuccessColorIndicator: string;
+
+/**
+ * Maps to the css variable `--syn-alert-warning-color-background`
+ */
+export const SynAlertWarningColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-alert-warning-color-border`
+ */
+export const SynAlertWarningColorBorder: string;
+
+/**
+ * Maps to the css variable `--syn-alert-warning-color-icon`
+ */
+export const SynAlertWarningColorIcon: string;
+
+/**
+ * Maps to the css variable `--syn-alert-warning-color-indicator`
+ */
+export const SynAlertWarningColorIndicator: string;
+
+/**
+ * Maps to the css variable `--syn-badge-error-color-background`
+ */
+export const SynBadgeErrorColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-badge-error-color-text`
+ */
+export const SynBadgeErrorColorText: string;
+
+/**
+ * Maps to the css variable `--syn-badge-informative-color-background`
+ */
+export const SynBadgeInformativeColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-badge-informative-color-text`
+ */
+export const SynBadgeInformativeColorText: string;
+
+/**
+ * Maps to the css variable `--syn-badge-neutral-color-background`
+ */
+export const SynBadgeNeutralColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-badge-neutral-color-text`
+ */
+export const SynBadgeNeutralColorText: string;
+
+/**
+ * Maps to the css variable `--syn-badge-success-color-background`
+ */
+export const SynBadgeSuccessColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-badge-success-color-text`
+ */
+export const SynBadgeSuccessColorText: string;
+
+/**
+ * Maps to the css variable `--syn-badge-warning-color-background`
+ */
+export const SynBadgeWarningColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-badge-warning-color-text`
+ */
+export const SynBadgeWarningColorText: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-circle`
+ */
+export const SynBorderRadiusCircle: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-large`
+ */
+export const SynBorderRadiusLarge: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-medium`
+ */
+export const SynBorderRadiusMedium: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-none`
+ */
+export const SynBorderRadiusNone: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-pill`
+ */
+export const SynBorderRadiusPill: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-small`
+ */
+export const SynBorderRadiusSmall: string;
+
+/**
+ * Maps to the css variable `--syn-border-radius-x-large`
+ */
+export const SynBorderRadiusXLarge: string;
+
+/**
+ * Maps to the css variable `--syn-border-width-large`
+ */
+export const SynBorderWidthLarge: string;
+
+/**
+ * Maps to the css variable `--syn-border-width-medium`
+ */
+export const SynBorderWidthMedium: string;
+
+/**
+ * Maps to the css variable `--syn-border-width-none`
+ */
+export const SynBorderWidthNone: string;
+
+/**
+ * Maps to the css variable `--syn-border-width-small`
+ */
+export const SynBorderWidthSmall: string;
+
+/**
+ * Maps to the css variable `--syn-border-width-x-large`
+ */
+export const SynBorderWidthXLarge: string;
+
+/**
+ * Maps to the css variable `--syn-breadcrumb-color`
+ */
+export const SynBreadcrumbColor: string;
+
+/**
+ * Maps to the css variable `--syn-button-border-radius-large`
+ */
+export const SynButtonBorderRadiusLarge: string;
+
+/**
+ * Maps to the css variable `--syn-button-border-radius-medium`
+ */
+export const SynButtonBorderRadiusMedium: string;
+
+/**
+ * Maps to the css variable `--syn-button-border-radius-small`
+ */
+export const SynButtonBorderRadiusSmall: string;
+
+/**
+ * Maps to the css variable `--syn-button-color`
+ */
+export const SynButtonColor: string;
+
+/**
+ * Maps to the css variable `--syn-button-color-active`
+ */
+export const SynButtonColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-button-color-hover`
+ */
+export const SynButtonColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-button-filled-color-text`
+ */
+export const SynButtonFilledColorText: string;
+
+/**
+ * Maps to the css variable `--syn-button-filled-color-text-active`
+ */
+export const SynButtonFilledColorTextActive: string;
+
+/**
+ * Maps to the css variable `--syn-button-filled-color-text-hover`
+ */
+export const SynButtonFilledColorTextHover: string;
+
+/**
+ * Maps to the css variable `--syn-button-font-size-large`
+ */
+export const SynButtonFontSizeLarge: string;
+
+/**
+ * Maps to the css variable `--syn-button-font-size-medium`
+ */
+export const SynButtonFontSizeMedium: string;
+
+/**
+ * Maps to the css variable `--syn-button-font-size-small`
+ */
+export const SynButtonFontSizeSmall: string;
+
+/**
+ * Maps to the css variable `--syn-button-outline-color-active`
+ */
+export const SynButtonOutlineColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-button-outline-color-hover`
+ */
+export const SynButtonOutlineColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-button-outline-color-text`
+ */
+export const SynButtonOutlineColorText: string;
+
+/**
+ * Maps to the css variable `--syn-button-outline-color-text-active`
+ */
+export const SynButtonOutlineColorTextActive: string;
+
+/**
+ * Maps to the css variable `--syn-button-outline-color-text-hover`
+ */
+export const SynButtonOutlineColorTextHover: string;
+
+/**
+ * Maps to the css variable `--syn-button-text-color-text`
+ */
+export const SynButtonTextColorText: string;
+
+/**
+ * Maps to the css variable `--syn-button-text-color-text-active`
+ */
+export const SynButtonTextColorTextActive: string;
+
+/**
+ * Maps to the css variable `--syn-button-text-color-text-hover`
+ */
+export const SynButtonTextColorTextHover: string;
+
+/**
+ * Maps to the css variable `--syn-checkbox-border-radius`
+ */
+export const SynCheckboxBorderRadius: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-50`
+ */
+export const SynColorAccent50: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-100`
+ */
+export const SynColorAccent100: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-200`
+ */
+export const SynColorAccent200: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-300`
+ */
+export const SynColorAccent300: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-400`
+ */
+export const SynColorAccent400: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-500`
+ */
+export const SynColorAccent500: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-600`
+ */
+export const SynColorAccent600: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-700`
+ */
+export const SynColorAccent700: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-800`
+ */
+export const SynColorAccent800: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-900`
+ */
+export const SynColorAccent900: string;
+
+/**
+ * Maps to the css variable `--syn-color-accent-950`
+ */
+export const SynColorAccent950: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-50`
+ */
+export const SynColorCritical50: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-100`
+ */
+export const SynColorCritical100: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-200`
+ */
+export const SynColorCritical200: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-300`
+ */
+export const SynColorCritical300: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-400`
+ */
+export const SynColorCritical400: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-500`
+ */
+export const SynColorCritical500: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-600`
+ */
+export const SynColorCritical600: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-700`
+ */
+export const SynColorCritical700: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-800`
+ */
+export const SynColorCritical800: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-900`
+ */
+export const SynColorCritical900: string;
+
+/**
+ * Maps to the css variable `--syn-color-critical-950`
+ */
+export const SynColorCritical950: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-50`
+ */
+export const SynColorDataMagenta50: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-100`
+ */
+export const SynColorDataMagenta100: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-200`
+ */
+export const SynColorDataMagenta200: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-300`
+ */
+export const SynColorDataMagenta300: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-400`
+ */
+export const SynColorDataMagenta400: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-500`
+ */
+export const SynColorDataMagenta500: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-600`
+ */
+export const SynColorDataMagenta600: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-700`
+ */
+export const SynColorDataMagenta700: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-800`
+ */
+export const SynColorDataMagenta800: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-900`
+ */
+export const SynColorDataMagenta900: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-magenta-950`
+ */
+export const SynColorDataMagenta950: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-50`
+ */
+export const SynColorDataPurple50: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-100`
+ */
+export const SynColorDataPurple100: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-200`
+ */
+export const SynColorDataPurple200: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-300`
+ */
+export const SynColorDataPurple300: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-400`
+ */
+export const SynColorDataPurple400: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-500`
+ */
+export const SynColorDataPurple500: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-600`
+ */
+export const SynColorDataPurple600: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-700`
+ */
+export const SynColorDataPurple700: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-800`
+ */
+export const SynColorDataPurple800: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-900`
+ */
+export const SynColorDataPurple900: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-purple-950`
+ */
+export const SynColorDataPurple950: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-50`
+ */
+export const SynColorDataTeal50: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-100`
+ */
+export const SynColorDataTeal100: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-200`
+ */
+export const SynColorDataTeal200: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-300`
+ */
+export const SynColorDataTeal300: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-400`
+ */
+export const SynColorDataTeal400: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-500`
+ */
+export const SynColorDataTeal500: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-600`
+ */
+export const SynColorDataTeal600: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-700`
+ */
+export const SynColorDataTeal700: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-800`
+ */
+export const SynColorDataTeal800: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-900`
+ */
+export const SynColorDataTeal900: string;
+
+/**
+ * Maps to the css variable `--syn-color-data-teal-950`
+ */
+export const SynColorDataTeal950: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-50`
+ */
+export const SynColorError50: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-100`
+ */
+export const SynColorError100: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-200`
+ */
+export const SynColorError200: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-300`
+ */
+export const SynColorError300: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-400`
+ */
+export const SynColorError400: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-500`
+ */
+export const SynColorError500: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-600`
+ */
+export const SynColorError600: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-700`
+ */
+export const SynColorError700: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-800`
+ */
+export const SynColorError800: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-900`
+ */
+export const SynColorError900: string;
+
+/**
+ * Maps to the css variable `--syn-color-error-950`
+ */
+export const SynColorError950: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-50`
+ */
+export const SynColorInfo50: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-100`
+ */
+export const SynColorInfo100: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-200`
+ */
+export const SynColorInfo200: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-300`
+ */
+export const SynColorInfo300: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-400`
+ */
+export const SynColorInfo400: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-500`
+ */
+export const SynColorInfo500: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-600`
+ */
+export const SynColorInfo600: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-700`
+ */
+export const SynColorInfo700: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-800`
+ */
+export const SynColorInfo800: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-900`
+ */
+export const SynColorInfo900: string;
+
+/**
+ * Maps to the css variable `--syn-color-info-950`
+ */
+export const SynColorInfo950: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-50`
+ */
+export const SynColorMuted50: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-100`
+ */
+export const SynColorMuted100: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-200`
+ */
+export const SynColorMuted200: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-300`
+ */
+export const SynColorMuted300: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-400`
+ */
+export const SynColorMuted400: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-500`
+ */
+export const SynColorMuted500: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-600`
+ */
+export const SynColorMuted600: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-700`
+ */
+export const SynColorMuted700: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-800`
+ */
+export const SynColorMuted800: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-900`
+ */
+export const SynColorMuted900: string;
+
+/**
+ * Maps to the css variable `--syn-color-muted-950`
+ */
+export const SynColorMuted950: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-0`
+ */
+export const SynColorNeutral0: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-50`
+ */
+export const SynColorNeutral50: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-100`
+ */
+export const SynColorNeutral100: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-200`
+ */
+export const SynColorNeutral200: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-300`
+ */
+export const SynColorNeutral300: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-400`
+ */
+export const SynColorNeutral400: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-500`
+ */
+export const SynColorNeutral500: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-600`
+ */
+export const SynColorNeutral600: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-700`
+ */
+export const SynColorNeutral700: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-800`
+ */
+export const SynColorNeutral800: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-900`
+ */
+export const SynColorNeutral900: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-950`
+ */
+export const SynColorNeutral950: string;
+
+/**
+ * Maps to the css variable `--syn-color-neutral-1000`
+ */
+export const SynColorNeutral1000: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-50`
+ */
+export const SynColorPrimary50: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-100`
+ */
+export const SynColorPrimary100: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-200`
+ */
+export const SynColorPrimary200: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-300`
+ */
+export const SynColorPrimary300: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-400`
+ */
+export const SynColorPrimary400: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-500`
+ */
+export const SynColorPrimary500: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-600`
+ */
+export const SynColorPrimary600: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-700`
+ */
+export const SynColorPrimary700: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-800`
+ */
+export const SynColorPrimary800: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-900`
+ */
+export const SynColorPrimary900: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-950`
+ */
+export const SynColorPrimary950: string;
+
+/**
+ * Maps to the css variable `--syn-color-primary-1000`
+ */
+export const SynColorPrimary1000: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-50`
+ */
+export const SynColorSuccess50: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-100`
+ */
+export const SynColorSuccess100: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-200`
+ */
+export const SynColorSuccess200: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-300`
+ */
+export const SynColorSuccess300: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-400`
+ */
+export const SynColorSuccess400: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-500`
+ */
+export const SynColorSuccess500: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-600`
+ */
+export const SynColorSuccess600: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-700`
+ */
+export const SynColorSuccess700: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-800`
+ */
+export const SynColorSuccess800: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-900`
+ */
+export const SynColorSuccess900: string;
+
+/**
+ * Maps to the css variable `--syn-color-success-950`
+ */
+export const SynColorSuccess950: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-50`
+ */
+export const SynColorWarning50: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-100`
+ */
+export const SynColorWarning100: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-200`
+ */
+export const SynColorWarning200: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-300`
+ */
+export const SynColorWarning300: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-400`
+ */
+export const SynColorWarning400: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-500`
+ */
+export const SynColorWarning500: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-600`
+ */
+export const SynColorWarning600: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-700`
+ */
+export const SynColorWarning700: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-800`
+ */
+export const SynColorWarning800: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-900`
+ */
+export const SynColorWarning900: string;
+
+/**
+ * Maps to the css variable `--syn-color-warning-950`
+ */
+export const SynColorWarning950: string;
+
+/**
+ * Maps to the css variable `--syn-details-open-rotation`
+ */
+export const SynDetailsOpenRotation: string;
+
+/**
+ * Maps to the css variable `--syn-dimension-base`
+ */
+export const SynDimensionBase: string;
+
+/**
+ * Maps to the css variable `--syn-duration-extra-fast`
+ */
+export const SynDurationExtraFast: string;
+
+/**
+ * Maps to the css variable `--syn-duration-extra-slow`
+ */
+export const SynDurationExtraSlow: string;
+
+/**
+ * Maps to the css variable `--syn-duration-fast`
+ */
+export const SynDurationFast: string;
+
+/**
+ * Maps to the css variable `--syn-duration-normal`
+ */
+export const SynDurationNormal: string;
+
+/**
+ * Maps to the css variable `--syn-duration-slow`
+ */
+export const SynDurationSlow: string;
+
+/**
+ * Maps to the css variable `--syn-focus-ring-border-radius`
+ */
+export const SynFocusRingBorderRadius: string;
+
+/**
+ * Maps to the css variable `--syn-focus-ring-color`
+ */
+export const SynFocusRingColor: string;
+
+/**
+ * Maps to the css variable `--syn-focus-ring-offset`
+ */
+export const SynFocusRingOffset: string;
+
+/**
+ * Maps to the css variable `--syn-focus-ring-style`
+ */
+export const SynFocusRingStyle: string;
+
+/**
+ * Maps to the css variable `--syn-focus-ring-width`
+ */
+export const SynFocusRingWidth: string;
+
+/**
+ * Maps to the css variable `--syn-font-mono`
+ */
+export const SynFontMono: string;
+
+/**
+ * Maps to the css variable `--syn-font-sans`
+ */
+export const SynFontSans: string;
+
+/**
+ * Maps to the css variable `--syn-font-sans-fallback`
+ */
+export const SynFontSansFallback: string;
+
+/**
+ * Maps to the css variable `--syn-font-serif`
+ */
+export const SynFontSerif: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-2x-large`
+ */
+export const SynFontSize2xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-2x-small`
+ */
+export const SynFontSize2xSmall: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-3x-large`
+ */
+export const SynFontSize3xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-4x-large`
+ */
+export const SynFontSize4xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-large`
+ */
+export const SynFontSizeLarge: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-medium`
+ */
+export const SynFontSizeMedium: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-small`
+ */
+export const SynFontSizeSmall: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-x-large`
+ */
+export const SynFontSizeXLarge: string;
+
+/**
+ * Maps to the css variable `--syn-font-size-x-small`
+ */
+export const SynFontSizeXSmall: string;
+
+/**
+ * Maps to the css variable `--syn-font-weight-bold`
+ */
+export const SynFontWeightBold: string;
+
+/**
+ * Maps to the css variable `--syn-font-weight-light`
+ */
+export const SynFontWeightLight: string;
+
+/**
+ * Maps to the css variable `--syn-font-weight-normal`
+ */
+export const SynFontWeightNormal: string;
+
+/**
+ * Maps to the css variable `--syn-font-weight-semibold`
+ */
+export const SynFontWeightSemibold: string;
+
+/**
+ * Maps to the css variable `--syn-header-border-color`
+ */
+export const SynHeaderBorderColor: string;
+
+/**
+ * Maps to the css variable `--syn-icon-button-focus-ring-border-radius`
+ */
+export const SynIconButtonFocusRingBorderRadius: string;
+
+/**
+ * Maps to the css variable `--syn-input-background-color`
+ */
+export const SynInputBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-background-color-disabled`
+ */
+export const SynInputBackgroundColorDisabled: string;
+
+/**
+ * Maps to the css variable `--syn-input-background-color-focus`
+ */
+export const SynInputBackgroundColorFocus: string;
+
+/**
+ * Maps to the css variable `--syn-input-background-color-hover`
+ */
+export const SynInputBackgroundColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color`
+ */
+export const SynInputBorderColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color-active`
+ */
+export const SynInputBorderColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color-disabled`
+ */
+export const SynInputBorderColorDisabled: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color-focus`
+ */
+export const SynInputBorderColorFocus: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color-focus-error`
+ */
+export const SynInputBorderColorFocusError: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color-hover`
+ */
+export const SynInputBorderColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-color-offset`
+ */
+export const SynInputBorderColorOffset: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-radius-large`
+ */
+export const SynInputBorderRadiusLarge: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-radius-medium`
+ */
+export const SynInputBorderRadiusMedium: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-radius-small`
+ */
+export const SynInputBorderRadiusSmall: string;
+
+/**
+ * Maps to the css variable `--syn-input-border-width`
+ */
+export const SynInputBorderWidth: string;
+
+/**
+ * Maps to the css variable `--syn-input-color`
+ */
+export const SynInputColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-color-disabled`
+ */
+export const SynInputColorDisabled: string;
+
+/**
+ * Maps to the css variable `--syn-input-color-focus`
+ */
+export const SynInputColorFocus: string;
+
+/**
+ * Maps to the css variable `--syn-input-color-hover`
+ */
+export const SynInputColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-disabled-opacity`
+ */
+export const SynInputDisabledOpacity: string;
+
+/**
+ * Maps to the css variable `--syn-input-focus-ring-color`
+ */
+export const SynInputFocusRingColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-focus-ring-error`
+ */
+export const SynInputFocusRingError: string;
+
+/**
+ * Maps to the css variable `--syn-input-focus-ring-offset`
+ */
+export const SynInputFocusRingOffset: string;
+
+/**
+ * Maps to the css variable `--syn-input-font-family`
+ */
+export const SynInputFontFamily: string;
+
+/**
+ * Maps to the css variable `--syn-input-font-size-large`
+ */
+export const SynInputFontSizeLarge: string;
+
+/**
+ * Maps to the css variable `--syn-input-font-size-medium`
+ */
+export const SynInputFontSizeMedium: string;
+
+/**
+ * Maps to the css variable `--syn-input-font-size-small`
+ */
+export const SynInputFontSizeSmall: string;
+
+/**
+ * Maps to the css variable `--syn-input-font-weight`
+ */
+export const SynInputFontWeight: string;
+
+/**
+ * Maps to the css variable `--syn-input-height-large`
+ */
+export const SynInputHeightLarge: string;
+
+/**
+ * Maps to the css variable `--syn-input-height-medium`
+ */
+export const SynInputHeightMedium: string;
+
+/**
+ * Maps to the css variable `--syn-input-height-small`
+ */
+export const SynInputHeightSmall: string;
+
+/**
+ * Maps to the css variable `--syn-input-help-text-color`
+ */
+export const SynInputHelpTextColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-help-text-color-error`
+ */
+export const SynInputHelpTextColorError: string;
+
+/**
+ * Maps to the css variable `--syn-input-help-text-font-size-large`
+ */
+export const SynInputHelpTextFontSizeLarge: string;
+
+/**
+ * Maps to the css variable `--syn-input-help-text-font-size-medium`
+ */
+export const SynInputHelpTextFontSizeMedium: string;
+
+/**
+ * Maps to the css variable `--syn-input-help-text-font-size-small`
+ */
+export const SynInputHelpTextFontSizeSmall: string;
+
+/**
+ * Maps to the css variable `--syn-input-icon-color`
+ */
+export const SynInputIconColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-icon-color-hover`
+ */
+export const SynInputIconColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-icon-icon-clearable-color`
+ */
+export const SynInputIconIconClearableColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-icon-icon-clearable-color-active`
+ */
+export const SynInputIconIconClearableColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-input-icon-icon-clearable-color-hover`
+ */
+export const SynInputIconIconClearableColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-label-color`
+ */
+export const SynInputLabelColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-label-font-size-large`
+ */
+export const SynInputLabelFontSizeLarge: string;
+
+/**
+ * Maps to the css variable `--syn-input-label-font-size-medium`
+ */
+export const SynInputLabelFontSizeMedium: string;
+
+/**
+ * Maps to the css variable `--syn-input-label-font-size-small`
+ */
+export const SynInputLabelFontSizeSmall: string;
+
+/**
+ * Maps to the css variable `--syn-input-letter-spacing`
+ */
+export const SynInputLetterSpacing: string;
+
+/**
+ * Maps to the css variable `--syn-input-placeholder-color`
+ */
+export const SynInputPlaceholderColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-placeholder-color-disabled`
+ */
+export const SynInputPlaceholderColorDisabled: string;
+
+/**
+ * Maps to the css variable `--syn-input-readonly-color-hover`
+ */
+export const SynInputReadonlyColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-readonly-background-color`
+ */
+export const SynInputReadonlyBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-readonly-background-color-disabled`
+ */
+export const SynInputReadonlyBackgroundColorDisabled: string;
+
+/**
+ * Maps to the css variable `--syn-input-readonly-background-color-focus`
+ */
+export const SynInputReadonlyBackgroundColorFocus: string;
+
+/**
+ * Maps to the css variable `--syn-input-readonly-background-color-hover`
+ */
+export const SynInputReadonlyBackgroundColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-input-required-content`
+ */
+export const SynInputRequiredContent: string;
+
+/**
+ * Maps to the css variable `--syn-input-required-content-color`
+ */
+export const SynInputRequiredContentColor: string;
+
+/**
+ * Maps to the css variable `--syn-input-required-content-offset`
+ */
+export const SynInputRequiredContentOffset: string;
+
+/**
+ * Maps to the css variable `--syn-input-spacing-large`
+ */
+export const SynInputSpacingLarge: string;
+
+/**
+ * Maps to the css variable `--syn-input-spacing-medium`
+ */
+export const SynInputSpacingMedium: string;
+
+/**
+ * Maps to the css variable `--syn-input-spacing-small`
+ */
+export const SynInputSpacingSmall: string;
+
+/**
+ * Maps to the css variable `--syn-input-width`
+ */
+export const SynInputWidth: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-background-color-active`
+ */
+export const SynInteractiveBackgroundColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-background-color-hover`
+ */
+export const SynInteractiveBackgroundColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-emphasis-color`
+ */
+export const SynInteractiveEmphasisColor: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-emphasis-color-active`
+ */
+export const SynInteractiveEmphasisColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-emphasis-color-hover`
+ */
+export const SynInteractiveEmphasisColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-quiet-color`
+ */
+export const SynInteractiveQuietColor: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-quiet-color-active`
+ */
+export const SynInteractiveQuietColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-interactive-quiet-color-hover`
+ */
+export const SynInteractiveQuietColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-letter-spacing-dense`
+ */
+export const SynLetterSpacingDense: string;
+
+/**
+ * Maps to the css variable `--syn-letter-spacing-denser`
+ */
+export const SynLetterSpacingDenser: string;
+
+/**
+ * Maps to the css variable `--syn-letter-spacing-loose`
+ */
+export const SynLetterSpacingLoose: string;
+
+/**
+ * Maps to the css variable `--syn-letter-spacing-looser`
+ */
+export const SynLetterSpacingLooser: string;
+
+/**
+ * Maps to the css variable `--syn-letter-spacing-normal`
+ */
+export const SynLetterSpacingNormal: string;
+
+/**
+ * Maps to the css variable `--syn-line-height-dense`
+ */
+export const SynLineHeightDense: string;
+
+/**
+ * Maps to the css variable `--syn-line-height-denser`
+ */
+export const SynLineHeightDenser: string;
+
+/**
+ * Maps to the css variable `--syn-line-height-loose`
+ */
+export const SynLineHeightLoose: string;
+
+/**
+ * Maps to the css variable `--syn-line-height-looser`
+ */
+export const SynLineHeightLooser: string;
+
+/**
+ * Maps to the css variable `--syn-line-height-normal`
+ */
+export const SynLineHeightNormal: string;
+
+/**
+ * Maps to the css variable `--syn-link-color`
+ */
+export const SynLinkColor: string;
+
+/**
+ * Maps to the css variable `--syn-link-color-active`
+ */
+export const SynLinkColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-link-color-hover`
+ */
+export const SynLinkColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-link-quiet-color`
+ */
+export const SynLinkQuietColor: string;
+
+/**
+ * Maps to the css variable `--syn-link-quiet-color-active`
+ */
+export const SynLinkQuietColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-link-quiet-color-hover`
+ */
+export const SynLinkQuietColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-link-underline-outline`
+ */
+export const SynLinkUnderlineOutline: string;
+
+/**
+ * Maps to the css variable `--syn-logo-color`
+ */
+export const SynLogoColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-color-border`
+ */
+export const SynNamurColorBorder: string;
+
+/**
+ * Maps to the css variable `--syn-namur-critical-color`
+ */
+export const SynNamurCriticalColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-critical-color-background`
+ */
+export const SynNamurCriticalColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-namur-error-color`
+ */
+export const SynNamurErrorColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-error-color-background`
+ */
+export const SynNamurErrorColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-namur-icon-color`
+ */
+export const SynNamurIconColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-info-color`
+ */
+export const SynNamurInfoColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-info-color-background`
+ */
+export const SynNamurInfoColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-namur-neutral-color`
+ */
+export const SynNamurNeutralColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-neutral-color-background`
+ */
+export const SynNamurNeutralColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-namur-success-color`
+ */
+export const SynNamurSuccessColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-success-color-background`
+ */
+export const SynNamurSuccessColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-namur-warning-color`
+ */
+export const SynNamurWarningColor: string;
+
+/**
+ * Maps to the css variable `--syn-namur-warning-color-background`
+ */
+export const SynNamurWarningColorBackground: string;
+
+/**
+ * Maps to the css variable `--syn-opacity-50`
+ */
+export const SynOpacity50: string;
+
+/**
+ * Maps to the css variable `--syn-option-background-color-active`
+ */
+export const SynOptionBackgroundColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-option-background-color-hover`
+ */
+export const SynOptionBackgroundColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-option-check-color`
+ */
+export const SynOptionCheckColor: string;
+
+/**
+ * Maps to the css variable `--syn-option-check-color-active`
+ */
+export const SynOptionCheckColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-option-check-color-hover`
+ */
+export const SynOptionCheckColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-option-color`
+ */
+export const SynOptionColor: string;
+
+/**
+ * Maps to the css variable `--syn-option-color-active`
+ */
+export const SynOptionColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-option-color-hover`
+ */
+export const SynOptionColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-option-icon-color`
+ */
+export const SynOptionIconColor: string;
+
+/**
+ * Maps to the css variable `--syn-option-icon-color-active`
+ */
+export const SynOptionIconColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-option-icon-color-hover`
+ */
+export const SynOptionIconColorHover: string;
+
+/**
+ * Maps to the css variable `--syn-overlay-background-blur`
+ */
+export const SynOverlayBackgroundBlur: string;
+
+/**
+ * Maps to the css variable `--syn-overlay-background-color`
+ */
+export const SynOverlayBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-page-background`
+ */
+export const SynPageBackground: string;
+
+/**
+ * Maps to the css variable `--syn-page-background-color`
+ */
+export const SynPageBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-page-background-color-muted`
+ */
+export const SynPageBackgroundColorMuted: string;
+
+/**
+ * Maps to the css variable `--syn-panel-background-color`
+ */
+export const SynPanelBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-panel-border-color`
+ */
+export const SynPanelBorderColor: string;
+
+/**
+ * Maps to the css variable `--syn-panel-border-radius`
+ */
+export const SynPanelBorderRadius: string;
+
+/**
+ * Maps to the css variable `--syn-panel-border-width`
+ */
+export const SynPanelBorderWidth: string;
+
+/**
+ * Maps to the css variable `--syn-progress-indicator-color`
+ */
+export const SynProgressIndicatorColor: string;
+
+/**
+ * Maps to the css variable `--syn-progress-track-color`
+ */
+export const SynProgressTrackColor: string;
+
+/**
+ * Maps to the css variable `--syn-range-color-inactive`
+ */
+export const SynRangeColorInactive: string;
+
+/**
+ * Maps to the css variable `--syn-range-error-color`
+ */
+export const SynRangeErrorColor: string;
+
+/**
+ * Maps to the css variable `--syn-range-tick-color`
+ */
+export const SynRangeTickColor: string;
+
+/**
+ * Maps to the css variable `--syn-range-track-color-active`
+ */
+export const SynRangeTrackColorActive: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-background-color`
+ */
+export const SynReadonlyBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-border-color`
+ */
+export const SynReadonlyBorderColor: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-color-text`
+ */
+export const SynReadonlyColorText: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-icon-color`
+ */
+export const SynReadonlyIconColor: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-icon-color-clearable`
+ */
+export const SynReadonlyIconColorClearable: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-icon-color-expand`
+ */
+export const SynReadonlyIconColorExpand: string;
+
+/**
+ * Maps to the css variable `--syn-readonly-indicator-color`
+ */
+export const SynReadonlyIndicatorColor: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-medium`
+ */
+export const SynShadowMedium: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-large`
+ */
+export const SynShadowLarge: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-x-large`
+ */
+export const SynShadowXLarge: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-overflow-down`
+ */
+export const SynShadowOverflowDown: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-overflow-up`
+ */
+export const SynShadowOverflowUp: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-overflow-left`
+ */
+export const SynShadowOverflowLeft: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-overflow-right`
+ */
+export const SynShadowOverflowRight: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-x-small`
+ */
+export const SynShadowXSmall: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-small`
+ */
+export const SynShadowSmall: string;
+
+/**
+ * Maps to the css variable `--syn-shadow-sticky-down`
+ */
+export const SynShadowStickyDown: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-1-5x-large`
+ */
+export const SynSpacing15xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-2x-large`
+ */
+export const SynSpacing2xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-2x-small`
+ */
+export const SynSpacing2xSmall: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-3x-large`
+ */
+export const SynSpacing3xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-3x-small`
+ */
+export const SynSpacing3xSmall: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-4x-large`
+ */
+export const SynSpacing4xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-4x-small`
+ */
+export const SynSpacing4xSmall: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-5x-large`
+ */
+export const SynSpacing5xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-large`
+ */
+export const SynSpacingLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-medium`
+ */
+export const SynSpacingMedium: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-medium-large`
+ */
+export const SynSpacingMediumLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-small`
+ */
+export const SynSpacingSmall: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-x-large`
+ */
+export const SynSpacingXLarge: string;
+
+/**
+ * Maps to the css variable `--syn-spacing-x-small`
+ */
+export const SynSpacingXSmall: string;
+
+/**
+ * Maps to the css variable `--syn-spinner-opacity`
+ */
+export const SynSpinnerOpacity: string;
+
+/**
+ * Maps to the css variable `--syn-switch-height-large`
+ */
+export const SynSwitchHeightLarge: string;
+
+/**
+ * Maps to the css variable `--syn-switch-height-medium`
+ */
+export const SynSwitchHeightMedium: string;
+
+/**
+ * Maps to the css variable `--syn-switch-height-small`
+ */
+export const SynSwitchHeightSmall: string;
+
+/**
+ * Maps to the css variable `--syn-switch-width-large`
+ */
+export const SynSwitchWidthLarge: string;
+
+/**
+ * Maps to the css variable `--syn-switch-width-medium`
+ */
+export const SynSwitchWidthMedium: string;
+
+/**
+ * Maps to the css variable `--syn-switch-width-small`
+ */
+export const SynSwitchWidthSmall: string;
+
+/**
+ * Maps to the css variable `--syn-table-background-color`
+ */
+export const SynTableBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-table-background-color-alternating`
+ */
+export const SynTableBackgroundColorAlternating: string;
+
+/**
+ * Maps to the css variable `--syn-table-background-color-header`
+ */
+export const SynTableBackgroundColorHeader: string;
+
+/**
+ * Maps to the css variable `--syn-table-border-color`
+ */
+export const SynTableBorderColor: string;
+
+/**
+ * Maps to the css variable `--syn-table-shadow-end`
+ */
+export const SynTableShadowEnd: string;
+
+/**
+ * Maps to the css variable `--syn-table-shadow-start`
+ */
+export const SynTableShadowStart: string;
+
+/**
+ * Maps to the css variable `--syn-text-decoration-default`
+ */
+export const SynTextDecorationDefault: string;
+
+/**
+ * Maps to the css variable `--syn-text-decoration-underline`
+ */
+export const SynTextDecorationUnderline: string;
+
+/**
+ * Maps to the css variable `--syn-toggle-size-large`
+ */
+export const SynToggleSizeLarge: string;
+
+/**
+ * Maps to the css variable `--syn-toggle-size-medium`
+ */
+export const SynToggleSizeMedium: string;
+
+/**
+ * Maps to the css variable `--syn-toggle-size-small`
+ */
+export const SynToggleSizeSmall: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-arrow-size`
+ */
+export const SynTooltipArrowSize: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-background-color`
+ */
+export const SynTooltipBackgroundColor: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-border-radius`
+ */
+export const SynTooltipBorderRadius: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-color`
+ */
+export const SynTooltipColor: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-font-family`
+ */
+export const SynTooltipFontFamily: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-font-size`
+ */
+export const SynTooltipFontSize: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-font-weight`
+ */
+export const SynTooltipFontWeight: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-line-height`
+ */
+export const SynTooltipLineHeight: string;
+
+/**
+ * Maps to the css variable `--syn-tooltip-padding`
+ */
+export const SynTooltipPadding: string;
+
+/**
+ * Maps to the css variable `--syn-transition-fast`
+ */
+export const SynTransitionFast: string;
+
+/**
+ * Maps to the css variable `--syn-transition-medium`
+ */
+export const SynTransitionMedium: string;
+
+/**
+ * Maps to the css variable `--syn-transition-slow`
+ */
+export const SynTransitionSlow: string;
+
+/**
+ * Maps to the css variable `--syn-transition-x-fast`
+ */
+export const SynTransitionXFast: string;
+
+/**
+ * Maps to the css variable `--syn-transition-x-slow`
+ */
+export const SynTransitionXSlow: string;
+
+/**
+ * Maps to the css variable `--syn-typography-color-text`
+ */
+export const SynTypographyColorText: string;
+
+/**
+ * Maps to the css variable `--syn-typography-color-text-inverted`
+ */
+export const SynTypographyColorTextInverted: string;
+
+/**
+ * Maps to the css variable `--syn-z-index-dialog`
+ */
+export const SynZIndexDialog: string;
+
+/**
+ * Maps to the css variable `--syn-z-index-drawer`
+ */
+export const SynZIndexDrawer: string;
+
+/**
+ * Maps to the css variable `--syn-z-index-dropdown`
+ */
+export const SynZIndexDropdown: string;
+
+/**
+ * Maps to the css variable `--syn-z-index-toast`
+ */
+export const SynZIndexToast: string;
+
+/**
+ * Maps to the css variable `--syn-z-index-tooltip`
+ */
+export const SynZIndexTooltip: string;
+
+/**
+ * Maps to the css variable `--syn-body-x-small-regular`
+ */
+export const SynBodyXSmallRegular: string;
+
+/**
+ * Maps to the css variable `--syn-body-x-small-semibold`
+ */
+export const SynBodyXSmallSemibold: string;
+
+/**
+ * Maps to the css variable `--syn-body-x-small-bold`
+ */
+export const SynBodyXSmallBold: string;
+
+/**
+ * Maps to the css variable `--syn-body-small-regular`
+ */
+export const SynBodySmallRegular: string;
+
+/**
+ * Maps to the css variable `--syn-body-small-semibold`
+ */
+export const SynBodySmallSemibold: string;
+
+/**
+ * Maps to the css variable `--syn-body-small-bold`
+ */
+export const SynBodySmallBold: string;
+
+/**
+ * Maps to the css variable `--syn-body-medium-regular`
+ */
+export const SynBodyMediumRegular: string;
+
+/**
+ * Maps to the css variable `--syn-body-medium-semibold`
+ */
+export const SynBodyMediumSemibold: string;
+
+/**
+ * Maps to the css variable `--syn-body-medium-bold`
+ */
+export const SynBodyMediumBold: string;
+
+/**
+ * Maps to the css variable `--syn-body-large-regular`
+ */
+export const SynBodyLargeRegular: string;
+
+/**
+ * Maps to the css variable `--syn-body-large-semibold`
+ */
+export const SynBodyLargeSemibold: string;
+
+/**
+ * Maps to the css variable `--syn-body-large-bold`
+ */
+export const SynBodyLargeBold: string;
+
+/**
+ * Maps to the css variable `--syn-heading-large`
+ */
+export const SynHeadingLarge: string;
+
+/**
+ * Maps to the css variable `--syn-heading-x-large`
+ */
+export const SynHeadingXLarge: string;
+
+/**
+ * Maps to the css variable `--syn-heading-2x-large`
+ */
+export const SynHeading2xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-heading-3x-large`
+ */
+export const SynHeading3xLarge: string;
+
+/**
+ * Maps to the css variable `--syn-focus-ring`
+ */
+export const SynFocusRing: string;