@synergy-design-system/tokens
Version:
Design tokens for Synergy, the SICK Design System
474 lines (472 loc) • 38.7 kB
JavaScript
/**
* @synergy-design-system/tokens version 3.22.2
* SICK Global UX Foundation
*/
export const ResolvedTokens = {
SynAlertCriticalColorBackground: { dark: '#cc6b02', light: '#ffbf32' },
SynAlertCriticalColorBorder: { dark: '#cc6b02', light: '#ffbf32' },
SynAlertCriticalColorIcon: { dark: '#00051a', light: '#0d0d0d' },
SynAlertCriticalColorIndicator: { dark: '#cc6b02', light: '#ffbf32' },
SynAlertCriticalColorText: { dark: '#00051a', light: '#0d0d0d' },
SynAlertErrorColorBackground: { dark: '#941013', light: '#ffa0a2' },
SynAlertErrorColorBorder: { dark: '#941013', light: '#ffa0a2' },
SynAlertErrorColorIcon: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertErrorColorIndicator: { dark: '#941013', light: '#ffa0a2' },
SynAlertErrorColorText: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertInformativeColorBackground: { dark: '#02628a', light: '#a6e9ff' },
SynAlertInformativeColorBorder: { dark: '#02628a', light: '#a6e9ff' },
SynAlertInformativeColorIcon: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertInformativeColorIndicator: { dark: '#02628a', light: '#a6e9ff' },
SynAlertInformativeColorText: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertNeutralColorBackground: { dark: '#262f55', light: '#d5ccc5' },
SynAlertNeutralColorBorder: { dark: '#262f55', light: '#d5ccc5' },
SynAlertNeutralColorIcon: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertNeutralColorIndicator: { dark: '#262f55', light: '#d5ccc5' },
SynAlertNeutralColorText: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertSuccessColorBackground: { dark: '#026524', light: '#84eca7' },
SynAlertSuccessColorBorder: { dark: '#026524', light: '#84eca7' },
SynAlertSuccessColorIcon: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertSuccessColorIndicator: { dark: '#026524', light: '#84eca7' },
SynAlertSuccessColorText: { dark: '#e9ebf1', light: '#0d0d0d' },
SynAlertWarningColorBackground: { dark: '#f2c500', light: '#ffe67c' },
SynAlertWarningColorBorder: { dark: '#f2c500', light: '#ffe67c' },
SynAlertWarningColorIcon: { dark: '#00051a', light: '#0d0d0d' },
SynAlertWarningColorIndicator: { dark: '#f2c500', light: '#ffe67c' },
SynAlertWarningColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBadgeCriticalColorBackground: { dark: '#ff9100', light: '#ff9100' },
SynBadgeCriticalColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBadgeErrorColorBackground: { dark: '#ff696d', light: '#ff696d' },
SynBadgeErrorColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBadgeInformativeColorBackground: { dark: '#26c9ff', light: '#26c9ff' },
SynBadgeInformativeColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBadgeNeutralColorBackground: { dark: '#5f678e', light: '#d5ccc5' },
SynBadgeNeutralColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBadgeSuccessColorBackground: { dark: '#4fc275', light: '#4fc275' },
SynBadgeSuccessColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBadgeWarningColorBackground: { dark: '#f2c500', light: '#f2c500' },
SynBadgeWarningColorText: { dark: '#00051a', light: '#0d0d0d' },
SynBody2xSmallRegular: { dark: "400 11px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 11px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyLargeBold: { dark: "600 20px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 20px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyLargeRegular: { dark: "400 20px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 20px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyLargeSemibold: { dark: "600 20px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 20px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyMediumBold: { dark: "600 16px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 16px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyMediumRegular: { dark: "400 16px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 16px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyMediumSemibold: { dark: "600 16px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 16px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodySmallBold: { dark: "600 14px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 14px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodySmallRegular: { dark: "400 14px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 14px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodySmallSemibold: { dark: "600 14px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 14px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyXSmallBold: { dark: "600 12px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 12px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyXSmallRegular: { dark: "400 12px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 12px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBodyXSmallSemibold: { dark: "600 12px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 12px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynBorderRadiusCircle: { dark: '9999px', light: '9999px' },
SynBorderRadiusLarge: { dark: '8px', light: '8px' },
SynBorderRadiusMedium: { dark: '8px', light: '8px' },
SynBorderRadiusNone: { dark: '0px', light: '0px' },
SynBorderRadiusPill: { dark: '9999px', light: '9999px' },
SynBorderRadiusSmall: { dark: '4px', light: '4px' },
SynBorderRadiusXLarge: { dark: '16px', light: '16px' },
SynBorderWidthLarge: { dark: '3px', light: '3px' },
SynBorderWidthMedium: { dark: '2px', light: '2px' },
SynBorderWidthNone: { dark: '0px', light: '0px' },
SynBorderWidthSmall: { dark: '1px', light: '1px' },
SynBorderWidthXLarge: { dark: '4px', light: '4px' },
SynBreadcrumbColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynButtonBorderRadiusLarge: { dark: '9999px', light: '9999px' },
SynButtonBorderRadiusMedium: { dark: '9999px', light: '9999px' },
SynButtonBorderRadiusSmall: { dark: '9999px', light: '9999px' },
SynButtonColor: { dark: '#e9ebf1', light: '#005aff' },
SynButtonColorActive: { dark: '#c8ccdb', light: '#000a37' },
SynButtonColorHover: { dark: '#e9ebf1', light: '#0e275d' },
SynButtonFilledColorText: { dark: '#066fff', light: '#ffffff' },
SynButtonFilledColorTextActive: { dark: '#00051a', light: '#ffffff' },
SynButtonFilledColorTextHover: { dark: '#00051a', light: '#ffffff' },
SynButtonFontSizeLarge: { dark: '20px', light: '20px' },
SynButtonFontSizeMedium: { dark: '16px', light: '16px' },
SynButtonFontSizeSmall: { dark: '14px', light: '14px' },
SynButtonOutlineColorActive: { dark: '#c8ccdb', light: '#000a37' },
SynButtonOutlineColorHover: { dark: '#e9ebf1', light: '#0e275d' },
SynButtonOutlineColorText: { dark: '#e9ebf1', light: '#0d0d0d' },
SynButtonOutlineColorTextActive: { dark: '#00051a', light: '#ffffff' },
SynButtonOutlineColorTextHover: { dark: '#00051a', light: '#ffffff' },
SynButtonTextColorText: { dark: '#e9ebf1', light: '#005aff' },
SynButtonTextColorTextActive: { dark: '#3183fe', light: '#000a37' },
SynButtonTextColorTextHover: { dark: '#066fff', light: '#0e275d' },
SynCheckboxBorderRadius: { dark: '4px', light: '4px' },
SynColorAccent50: { dark: '#092518', light: '#e9f8ed' },
SynColorAccent100: { dark: '#155033', light: '#d2f0dc' },
SynColorAccent200: { dark: '#18643e', light: '#bbe8c8' },
SynColorAccent300: { dark: '#1e7d4c', light: '#a5e1b9' },
SynColorAccent400: { dark: '#2d9c60', light: '#83d2a3' },
SynColorAccent500: { dark: '#4fb87c', light: '#4fb87c' },
SynColorAccent600: { dark: '#83d2a3', light: '#2d9c60' },
SynColorAccent700: { dark: '#a5e1b9', light: '#1e7d4c' },
SynColorAccent800: { dark: '#bbe8c8', light: '#18643e' },
SynColorAccent900: { dark: '#d2f0dc', light: '#155033' },
SynColorAccent950: { dark: '#e9f8ed', light: '#092518' },
SynColorCritical50: { dark: '#462104', light: '#fffbec' },
SynColorCritical100: { dark: '#82450c', light: '#fff7d3' },
SynColorCritical200: { dark: '#a1520b', light: '#ffeba5' },
SynColorCritical300: { dark: '#cc6b02', light: '#ffdb6d' },
SynColorCritical400: { dark: '#ff9100', light: '#ffbf32' },
SynColorCritical500: { dark: '#ffa80a', light: '#ffa80a' },
SynColorCritical600: { dark: '#ffbf32', light: '#ff9100' },
SynColorCritical700: { dark: '#ffdb6d', light: '#cc6b02' },
SynColorCritical800: { dark: '#ffeba5', light: '#a1520b' },
SynColorCritical900: { dark: '#fff7d3', light: '#82450c' },
SynColorCritical950: { dark: '#fffbec', light: '#462104' },
SynColorDataMagenta50: { dark: '#51062c', light: '#fdf2f9' },
SynColorDataMagenta100: { dark: '#85164f', light: '#fce7f5' },
SynColorDataMagenta200: { dark: '#a0145b', light: '#fcceed' },
SynColorDataMagenta300: { dark: '#c1156e', light: '#fba6dd' },
SynColorDataMagenta400: { dark: '#e13393', light: '#f76fc5' },
SynColorDataMagenta500: { dark: '#ef45ab', light: '#ef45ab' },
SynColorDataMagenta600: { dark: '#f76fc5', light: '#e13393' },
SynColorDataMagenta700: { dark: '#fba6dd', light: '#c1156e' },
SynColorDataMagenta800: { dark: '#fcceed', light: '#a0145b' },
SynColorDataMagenta900: { dark: '#fce7f5', light: '#85164f' },
SynColorDataMagenta950: { dark: '#fdf2f9', light: '#51062c' },
SynColorDataPurple50: { dark: '#3c0151', light: '#faf3ff' },
SynColorDataPurple100: { dark: '#5e1679', light: '#f6e7ff' },
SynColorDataPurple200: { dark: '#6f1395', light: '#ebceff' },
SynColorDataPurple300: { dark: '#8515b6', light: '#e0a7ff' },
SynColorDataPurple400: { dark: '#9d1edb', light: '#c457ff' },
SynColorDataPurple500: { dark: '#b73ef7', light: '#b73ef7' },
SynColorDataPurple600: { dark: '#c457ff', light: '#9d1edb' },
SynColorDataPurple700: { dark: '#e0a7ff', light: '#8515b6' },
SynColorDataPurple800: { dark: '#ebceff', light: '#6f1395' },
SynColorDataPurple900: { dark: '#f6e7ff', light: '#5e1679' },
SynColorDataPurple950: { dark: '#faf3ff', light: '#3c0151' },
SynColorDataTeal50: { dark: '#002f33', light: '#effefc' },
SynColorDataTeal100: { dark: '#0d5354', light: '#c7fff9' },
SynColorDataTeal200: { dark: '#0a6365', light: '#90fff3' },
SynColorDataTeal300: { dark: '#057f80', light: '#51f7ec' },
SynColorDataTeal400: { dark: '#009797', light: '#1de4dd' },
SynColorDataTeal500: { dark: '#04c8c3', light: '#04c8c3' },
SynColorDataTeal600: { dark: '#1de4dd', light: '#009797' },
SynColorDataTeal700: { dark: '#51f7ec', light: '#057f80' },
SynColorDataTeal800: { dark: '#90fff3', light: '#0a6365' },
SynColorDataTeal900: { dark: '#c7fff9', light: '#0d5354' },
SynColorDataTeal950: { dark: '#effefc', light: '#002f33' },
SynColorError50: { dark: '#450709', light: '#fff1f1' },
SynColorError100: { dark: '#6c0c0e', light: '#ffe3e4' },
SynColorError200: { dark: '#941013', light: '#ffcfd1' },
SynColorError300: { dark: '#bc1519', light: '#ffa0a2' },
SynColorError400: { dark: '#e6191e', light: '#ff696d' },
SynColorError500: { dark: '#f93a3f', light: '#f93a3f' },
SynColorError600: { dark: '#ff696d', light: '#e6191e' },
SynColorError700: { dark: '#ffa0a2', light: '#bc1519' },
SynColorError800: { dark: '#ffcfd1', light: '#941013' },
SynColorError900: { dark: '#ffe3e4', light: '#6c0c0e' },
SynColorError950: { dark: '#fff1f1', light: '#450709' },
SynColorInfo50: { dark: '#06334b', light: '#effaff' },
SynColorInfo100: { dark: '#085172', light: '#dff4ff' },
SynColorInfo200: { dark: '#02628a', light: '#a6e9ff' },
SynColorInfo300: { dark: '#0075a7', light: '#78ddff' },
SynColorInfo400: { dark: '#0092ce', light: '#26c9ff' },
SynColorInfo500: { dark: '#06b6f1', light: '#06b6f1' },
SynColorInfo600: { dark: '#26c9ff', light: '#0092ce' },
SynColorInfo700: { dark: '#78ddff', light: '#0075a7' },
SynColorInfo800: { dark: '#a6e9ff', light: '#02628a' },
SynColorInfo900: { dark: '#dff4ff', light: '#085172' },
SynColorInfo950: { dark: '#effaff', light: '#06334b' },
SynColorMuted50: { dark: '#2a2120', light: '#f8f7f6' },
SynColorMuted100: { dark: '#50423e', light: '#f2f0ed' },
SynColorMuted200: { dark: '#614e4b', light: '#ece8e5' },
SynColorMuted300: { dark: '#765f58', light: '#e6e1dc' },
SynColorMuted400: { dark: '#8d7269', light: '#d5ccc5' },
SynColorMuted500: { dark: '#ab988c', light: '#ab988c' },
SynColorMuted600: { dark: '#d5ccc5', light: '#8d7269' },
SynColorMuted700: { dark: '#e6e1dc', light: '#765f58' },
SynColorMuted800: { dark: '#ece8e5', light: '#614e4b' },
SynColorMuted900: { dark: '#f2f0ed', light: '#50423e' },
SynColorMuted950: { dark: '#f8f7f6', light: '#2a2120' },
SynColorNeutral0: { dark: '#000206', light: '#ffffff' },
SynColorNeutral50: { dark: '#00051a', light: '#f2f2f2' },
SynColorNeutral100: { dark: '#000a37', light: '#e7e7e7' },
SynColorNeutral200: { dark: '#0e1633', light: '#cccccc' },
SynColorNeutral300: { dark: '#262f55', light: '#b2b2b2' },
SynColorNeutral400: { dark: '#404769', light: '#999999' },
SynColorNeutral500: { dark: '#4d5473', light: '#868686' },
SynColorNeutral600: { dark: '#5f678e', light: '#666666' },
SynColorNeutral700: { dark: '#777ea4', light: '#565656' },
SynColorNeutral800: { dark: '#9298b6', light: '#333333' },
SynColorNeutral900: { dark: '#adb2c8', light: '#1a1a1a' },
SynColorNeutral950: { dark: '#c8ccdb', light: '#0d0d0d' },
SynColorNeutral1000: { dark: '#e9ebf1', light: '#000000' },
SynColorPrimary50: { dark: '#0e275d', light: '#eff5ff' },
SynColorPrimary100: { dark: '#0d3f9b', light: '#dae7ff' },
SynColorPrimary200: { dark: '#0845c5', light: '#ccdeff' },
SynColorPrimary300: { dark: '#005aff', light: '#91bbff' },
SynColorPrimary400: { dark: '#066fff', light: '#5e97fc' },
SynColorPrimary500: { dark: '#3183fe', light: '#3183fe' },
SynColorPrimary600: { dark: '#5e97fc', light: '#066fff' },
SynColorPrimary700: { dark: '#91bbff', light: '#005aff' },
SynColorPrimary800: { dark: '#ccdeff', light: '#0845c5' },
SynColorPrimary900: { dark: '#dae7ff', light: '#0d3f9b' },
SynColorPrimary950: { dark: '#eff5ff', light: '#0e275d' },
SynColorPrimary1000: { dark: '#eff5ff', light: '#000a37' },
SynColorSuccess50: { dark: '#003911', light: '#f0fdf4' },
SynColorSuccess100: { dark: '#026524', light: '#ddfbe6' },
SynColorSuccess200: { dark: '#00852c', light: '#bcf6cf' },
SynColorSuccess300: { dark: '#1a9945', light: '#84eca7' },
SynColorSuccess400: { dark: '#34ad5c', light: '#6ad88f' },
SynColorSuccess500: { dark: '#4fc275', light: '#4fc275' },
SynColorSuccess600: { dark: '#6ad88f', light: '#34ad5c' },
SynColorSuccess700: { dark: '#84eca7', light: '#1a9945' },
SynColorSuccess800: { dark: '#bcf6cf', light: '#00852c' },
SynColorSuccess900: { dark: '#ddfbe6', light: '#026524' },
SynColorSuccess950: { dark: '#f0fdf4', light: '#003911' },
SynColorWarning50: { dark: '#442404', light: '#fffbeb' },
SynColorWarning100: { dark: '#74450f', light: '#fff5c6' },
SynColorWarning200: { dark: '#89540a', light: '#ffe67c' },
SynColorWarning300: { dark: '#a66c02', light: '#fbdb52' },
SynColorWarning400: { dark: '#d19800', light: '#f6d029' },
SynColorWarning500: { dark: '#f2c500', light: '#f2c500' },
SynColorWarning600: { dark: '#f6d029', light: '#d19800' },
SynColorWarning700: { dark: '#fbdb52', light: '#a66c02' },
SynColorWarning800: { dark: '#ffe67c', light: '#89540a' },
SynColorWarning900: { dark: '#fff5c6', light: '#74450f' },
SynColorWarning950: { dark: '#fffbeb', light: '#442404' },
SynDetailsOpenRotation: { dark: '0deg', light: '0deg' },
SynDimensionBase: { dark: '4px', light: '4px' },
SynDurationExtraFast: { dark: '50ms', light: '50ms' },
SynDurationExtraSlow: { dark: '1000ms', light: '1000ms' },
SynDurationFast: { dark: '150ms', light: '150ms' },
SynDurationNormal: { dark: '250ms', light: '250ms' },
SynDurationSlow: { dark: '500ms', light: '500ms' },
SynFocusRing: { dark: 'solid 2px #91bbff', light: 'solid 2px #3183fe' },
SynFocusRingBorderRadius: { dark: '4px', light: '4px' },
SynFocusRingColor: { dark: '#91bbff', light: '#3183fe' },
SynFocusRingOffset: { dark: '2px', light: '2px' },
SynFocusRingStyle: { dark: 'solid', light: 'solid' },
SynFocusRingWidth: { dark: '2px', light: '2px' },
SynFontMono: { dark: "'Roboto Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace", light: "'Roboto Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace" },
SynFontSans: { dark: "'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynFontSansFallback: { dark: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif, 'apple color emoji', 'segoe ui emoji', 'segoe ui symbol'", light: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif, 'apple color emoji', 'segoe ui emoji', 'segoe ui symbol'" },
SynFontSerif: { dark: "Georgia, 'Times New Roman', serif", light: "Georgia, 'Times New Roman', serif" },
SynFontSize2xLarge: { dark: '32px', light: '32px' },
SynFontSize2xSmall: { dark: '11px', light: '11px' },
SynFontSize3xLarge: { dark: '40px', light: '40px' },
SynFontSize4xLarge: { dark: '52px', light: '52px' },
SynFontSizeLarge: { dark: '20px', light: '20px' },
SynFontSizeMedium: { dark: '16px', light: '16px' },
SynFontSizeSmall: { dark: '14px', light: '14px' },
SynFontSizeXLarge: { dark: '24px', light: '24px' },
SynFontSizeXSmall: { dark: '12px', light: '12px' },
SynFontWeightBold: { dark: '600', light: '600' },
SynFontWeightLight: { dark: '400', light: '400' },
SynFontWeightNormal: { dark: '400', light: '400' },
SynFontWeightSemibold: { dark: '600', light: '600' },
SynHeaderBorderColor: { dark: '#262f55', light: '#e6e1dc' },
SynHeading2xLarge: { dark: "400 34px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 34px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynHeading3xLarge: { dark: "400 40px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 40px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynHeading4xLarge: { dark: "400 52px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 52px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynHeadingLarge: { dark: "400 22px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 22px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynHeadingMedium: { dark: "600 18px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "600 18px/1.4 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynHeadingXLarge: { dark: "400 28px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "400 28px/1.2 'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynIconButtonFocusRingBorderRadius: { dark: '9999px', light: '9999px' },
SynInputBackgroundColor: { dark: '#00051a', light: '#ffffff' },
SynInputBackgroundColorDisabled: { dark: '#00051a', light: '#ffffff' },
SynInputBackgroundColorFocus: { dark: '#00051a', light: '#ffffff' },
SynInputBackgroundColorHover: { dark: '#00051a', light: '#ffffff' },
SynInputBorderColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputBorderColorActive: { dark: '#3183fe', light: '#0845c5' },
SynInputBorderColorDisabled: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputBorderColorFocus: { dark: '#066fff', light: '#005aff' },
SynInputBorderColorFocusError: { dark: '#ff696d', light: '#e6191e' },
SynInputBorderColorHover: { dark: '#066fff', light: '#005aff' },
SynInputBorderColorOffset: { dark: '#00051a', light: '#ffffff' },
SynInputBorderRadiusLarge: { dark: '8px', light: '8px' },
SynInputBorderRadiusMedium: { dark: '8px', light: '8px' },
SynInputBorderRadiusSmall: { dark: '8px', light: '8px' },
SynInputBorderWidth: { dark: '1px', light: '1px' },
SynInputColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputColorDisabled: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputColorFocus: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputColorHover: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputDisabledOpacity: { dark: '0.5', light: '0.5' },
SynInputFocusRingColor: { dark: '#91bbff', light: '#3183fe' },
SynInputFocusRingError: { dark: '#ff696d', light: '#e6191e' },
SynInputFocusRingOffset: { dark: '0px', light: '0px' },
SynInputFontFamily: { dark: "'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynInputFontSizeLarge: { dark: '20px', light: '20px' },
SynInputFontSizeMedium: { dark: '16px', light: '16px' },
SynInputFontSizeSmall: { dark: '14px', light: '14px' },
SynInputFontWeight: { dark: '400', light: '400' },
SynInputHeightLarge: { dark: '64px', light: '64px' },
SynInputHeightMedium: { dark: '48px', light: '48px' },
SynInputHeightSmall: { dark: '36px', light: '36px' },
SynInputHelpTextColor: { dark: '#9298b6', light: '#565656' },
SynInputHelpTextColorError: { dark: '#ff696d', light: '#e6191e' },
SynInputHelpTextFontSizeLarge: { dark: '16px', light: '16px' },
SynInputHelpTextFontSizeMedium: { dark: '14px', light: '14px' },
SynInputHelpTextFontSizeSmall: { dark: '12px', light: '12px' },
SynInputIconColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputIconColorHover: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputIconIconClearableColor: { dark: '#5f678e', light: '#868686' },
SynInputIconIconClearableColorActive: { dark: '#adb2c8', light: '#333333' },
SynInputIconIconClearableColorHover: { dark: '#9298b6', light: '#565656' },
SynInputLabelColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputLabelFontSizeLarge: { dark: '20px', light: '20px' },
SynInputLabelFontSizeMedium: { dark: '16px', light: '16px' },
SynInputLabelFontSizeSmall: { dark: '14px', light: '14px' },
SynInputLetterSpacing: { dark: 'normal', light: 'normal' },
SynInputPlaceholderColor: { dark: '#9298b6', light: '#565656' },
SynInputPlaceholderColorDisabled: { dark: '#9298b6', light: '#565656' },
SynInputReadonlyBackgroundColor: { dark: '#262f55', light: '#e6e1dc' },
SynInputReadonlyBackgroundColorDisabled: { dark: '#262f55', light: '#e6e1dc' },
SynInputReadonlyBackgroundColorFocus: { dark: '#262f55', light: '#e6e1dc' },
SynInputReadonlyBackgroundColorHover: { dark: '#262f55', light: '#e6e1dc' },
SynInputReadonlyColorHover: { dark: '#c8ccdb', light: '#0d0d0d' },
SynInputRequiredContent: { dark: '"*"', light: '"*"' },
SynInputRequiredContentColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInputRequiredContentOffset: { dark: '-2px', light: '-2px' },
SynInputSpacingLarge: { dark: '24px', light: '24px' },
SynInputSpacingMedium: { dark: '16px', light: '16px' },
SynInputSpacingSmall: { dark: '12px', light: '12px' },
SynInputWidth: { dark: '1px', light: '1px' },
SynInteractiveBackgroundColorActive: { dark: '#262f55', light: '#e6e1dc' },
SynInteractiveBackgroundColorHover: { dark: '#000a37', light: '#f2f0ed' },
SynInteractiveEmphasisColor: { dark: '#066fff', light: '#005aff' },
SynInteractiveEmphasisColorActive: { dark: '#91bbff', light: '#000a37' },
SynInteractiveEmphasisColorHover: { dark: '#5e97fc', light: '#0e275d' },
SynInteractiveQuietColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynInteractiveQuietColorActive: { dark: '#3183fe', light: '#0845c5' },
SynInteractiveQuietColorHover: { dark: '#066fff', light: '#005aff' },
SynLetterSpacingDense: { dark: 'normal', light: 'normal' },
SynLetterSpacingDenser: { dark: 'normal', light: 'normal' },
SynLetterSpacingLoose: { dark: 'normal', light: 'normal' },
SynLetterSpacingLooser: { dark: '2px', light: '2px' },
SynLetterSpacingNormal: { dark: 'normal', light: 'normal' },
SynLineHeightDense: { dark: '1.2', light: '1.2' },
SynLineHeightDenser: { dark: '1', light: '1' },
SynLineHeightLoose: { dark: '1.8', light: '1.8' },
SynLineHeightLooser: { dark: '2.2', light: '2.2' },
SynLineHeightNormal: { dark: '1.4', light: '1.4' },
SynLinkColor: { dark: '#066fff', light: '#005aff' },
SynLinkColorActive: { dark: '#91bbff', light: '#000a37' },
SynLinkColorHover: { dark: '#5e97fc', light: '#0e275d' },
SynLinkQuietColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynLinkQuietColorActive: { dark: '#3183fe', light: '#0845c5' },
SynLinkQuietColorHover: { dark: '#066fff', light: '#005aff' },
SynLinkUnderlineOutline: { dark: '25%', light: '25%' },
SynLogoColor: { dark: '#005aff', light: '#005aff' },
SynNamurColorBorder: { dark: '#00051a', light: '#0d0d0d' },
SynNamurCriticalColor: { dark: '#ff9100', light: '#ff9100' },
SynNamurCriticalColorBackground: { dark: '#462104', light: '#fff7d3' },
SynNamurErrorColor: { dark: '#ff696d', light: '#ff696d' },
SynNamurErrorColorBackground: { dark: '#450709', light: '#ffe3e4' },
SynNamurIconColor: { dark: '#00051a', light: '#0d0d0d' },
SynNamurInfoColor: { dark: '#26c9ff', light: '#26c9ff' },
SynNamurInfoColorBackground: { dark: '#06334b', light: '#dff4ff' },
SynNamurNeutralColor: { dark: '#5f678e', light: '#d5ccc5' },
SynNamurNeutralColorBackground: { dark: '#262f55', light: '#e6e1dc' },
SynNamurSuccessColor: { dark: '#4fc275', light: '#4fc275' },
SynNamurSuccessColorBackground: { dark: '#003911', light: '#ddfbe6' },
SynNamurWarningColor: { dark: '#f2c500', light: '#f2c500' },
SynNamurWarningColorBackground: { dark: '#442404', light: '#fff5c6' },
SynOpacity50: { dark: '0.5', light: '0.5' },
SynOptionBackgroundColorActive: { dark: '#91bbff', light: '#000a37' },
SynOptionBackgroundColorHover: { dark: '#5e97fc', light: '#0e275d' },
SynOptionCheckColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynOptionCheckColorActive: { dark: '#000206', light: '#ffffff' },
SynOptionCheckColorHover: { dark: '#000206', light: '#ffffff' },
SynOptionColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynOptionColorActive: { dark: '#00051a', light: '#ffffff' },
SynOptionColorHover: { dark: '#00051a', light: '#ffffff' },
SynOptionIconColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynOptionIconColorActive: { dark: '#000206', light: '#ffffff' },
SynOptionIconColorHover: { dark: '#000206', light: '#ffffff' },
SynOverlayBackgroundBlur: { dark: '8px', light: '8px' },
SynOverlayBackgroundColor: { dark: 'rgba(0, 5, 26, 0.6)', light: 'rgba(0, 5, 26, 0.3)' },
SynPageBackground: { dark: '#000206', light: '#ffffff' },
SynPageBackgroundColor: { dark: '#000206', light: '#ffffff' },
SynPageBackgroundColorMuted: { dark: '#000206', light: '#f8f7f6' },
SynPanelBackgroundColor: { dark: '#00051a', light: '#ffffff' },
SynPanelBorderColor: { dark: '#262f55', light: '#e6e1dc' },
SynPanelBorderRadius: { dark: '8px', light: '8px' },
SynPanelBorderWidth: { dark: '1px', light: '1px' },
SynProgressIndicatorColor: { dark: '#3183fe', light: '#005aff' },
SynProgressTrackColor: { dark: '#262f55', light: '#e7e7e7' },
SynRadioButtonBorderColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynRadioButtonBorderRadiusLarge: { dark: '4px', light: '4px' },
SynRadioButtonBorderRadiusMedium: { dark: '4px', light: '4px' },
SynRadioButtonBorderRadiusSmall: { dark: '4px', light: '4px' },
SynRadioButtonSpacingSmall: { dark: '6px', light: '6px' },
SynRangeColorInactive: { dark: '#262f55', light: '#e7e7e7' },
SynRangeErrorColor: { dark: '#ff696d', light: '#e6191e' },
SynRangeTickColor: { dark: '#5f678e', light: '#868686' },
SynRangeTrackColorActive: { dark: '#066fff', light: '#005aff' },
SynReadonlyBackgroundColor: { dark: '#262f55', light: '#e6e1dc' },
SynReadonlyBorderColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynReadonlyColorText: { dark: '#4d5473', light: '#999999' },
SynReadonlyIconColor: { dark: '#4d5473', light: '#999999' },
SynReadonlyIconColorClearable: { dark: '#262f55', light: '#b2b2b2' },
SynReadonlyIconColorExpand: { dark: '#4d5473', light: '#999999' },
SynReadonlyIndicatorColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynShadowLarge: { dark: '0px 0px 3px 0px rgba(13, 13, 13, 0.12), 0px 2px 6px 0px rgba(13, 13, 13, 0.12), 0px 3px 8px 0px rgba(13, 13, 13, 0.16)', light: '0px 0px 3px 0px rgba(13, 13, 13, 0.12), 0px 2px 6px 0px rgba(13, 13, 13, 0.12), 0px 3px 8px 0px rgba(13, 13, 13, 0.16)' },
SynShadowMedium: { dark: '0px 1px 2px 0px rgba(13, 13, 13, 0.08), 0px 1px 4px 0px rgba(13, 13, 13, 0.08), 0px 2px 8px 0px rgba(13, 13, 13, 0.08)', light: '0px 1px 2px 0px rgba(13, 13, 13, 0.08), 0px 1px 4px 0px rgba(13, 13, 13, 0.08), 0px 2px 8px 0px rgba(13, 13, 13, 0.08)' },
SynShadowOverflowDown: { dark: '0px 1px 4px 0px rgba(13, 13, 13, 0.12), 0px 3px 8px 0px rgba(13, 13, 13, 0.12), 0px 4px 12px 0px rgba(13, 13, 13, 0.16)', light: '0px 1px 4px 0px rgba(13, 13, 13, 0.12), 0px 3px 8px 0px rgba(13, 13, 13, 0.12), 0px 4px 12px 0px rgba(13, 13, 13, 0.16)' },
SynShadowOverflowLeft: { dark: '-1px 0px 4px 0px rgba(13, 13, 13, 0.12), -3px 0px 8px 0px rgba(13, 13, 13, 0.12), -4px 0px 12px 0px rgba(13, 13, 13, 0.16)', light: '-1px 0px 4px 0px rgba(13, 13, 13, 0.12), -3px 0px 8px 0px rgba(13, 13, 13, 0.12), -4px 0px 12px 0px rgba(13, 13, 13, 0.16)' },
SynShadowOverflowRight: { dark: '1px 0px 4px 0px rgba(13, 13, 13, 0.12), 3px 0px 8px 0px rgba(13, 13, 13, 0.12), 4px 0px 12px 0px rgba(13, 13, 13, 0.16)', light: '1px 0px 4px 0px rgba(13, 13, 13, 0.12), 3px 0px 8px 0px rgba(13, 13, 13, 0.12), 4px 0px 12px 0px rgba(13, 13, 13, 0.16)' },
SynShadowOverflowUp: { dark: '0px -1px 4px 0px rgba(13, 13, 13, 0.12), 0px -3px 8px 0px rgba(13, 13, 13, 0.12), 0px -4px 12px 0px rgba(13, 13, 13, 0.16)', light: '0px -1px 4px 0px rgba(13, 13, 13, 0.12), 0px -3px 8px 0px rgba(13, 13, 13, 0.12), 0px -4px 12px 0px rgba(13, 13, 13, 0.16)' },
SynShadowSmall: { dark: '0px 1px 2px 0px rgba(13, 13, 13, 0.06), 0px 1px 4px 0px rgba(13, 13, 13, 0.06), 0px 2px 8px 0px rgba(13, 13, 13, 0.06)', light: '0px 1px 2px 0px rgba(13, 13, 13, 0.06), 0px 1px 4px 0px rgba(13, 13, 13, 0.06), 0px 2px 8px 0px rgba(13, 13, 13, 0.06)' },
SynShadowStickyDown: { dark: '0px 3px 8px 0px rgba(13, 13, 13, 0.16)', light: '0px 3px 8px 0px rgba(13, 13, 13, 0.16)' },
SynShadowXLarge: { dark: '0px 1px 4px 0px rgba(13, 13, 13, 0.12), 0px 8px 24px 0px rgba(13, 13, 13, 0.12), 0px 16px 48px 0px rgba(13, 13, 13, 0.16)', light: '0px 1px 4px 0px rgba(13, 13, 13, 0.12), 0px 8px 24px 0px rgba(13, 13, 13, 0.12), 0px 16px 48px 0px rgba(13, 13, 13, 0.16)' },
SynShadowXSmall: { dark: '0px 1px 2px 0px rgba(13, 13, 13, 0.04), 0px 1px 4px 0px rgba(13, 13, 13, 0.04), 0px 2px 8px 0px rgba(13, 13, 13, 0.04)', light: '0px 1px 2px 0px rgba(13, 13, 13, 0.04), 0px 1px 4px 0px rgba(13, 13, 13, 0.04), 0px 2px 8px 0px rgba(13, 13, 13, 0.04)' },
SynSpacing2xLarge: { dark: '48px', light: '48px' },
SynSpacing2xSmall: { dark: '4px', light: '4px' },
SynSpacing3xLarge: { dark: '64px', light: '64px' },
SynSpacing3xSmall: { dark: '2px', light: '2px' },
SynSpacing4xLarge: { dark: '96px', light: '96px' },
SynSpacing4xSmall: { dark: '1px', light: '1px' },
SynSpacing5xLarge: { dark: '128px', light: '128px' },
SynSpacing15xLarge: { dark: '40px', light: '40px' },
SynSpacingLarge: { dark: '24px', light: '24px' },
SynSpacingMedium: { dark: '16px', light: '16px' },
SynSpacingMediumLarge: { dark: '20px', light: '20px' },
SynSpacingSmall: { dark: '12px', light: '12px' },
SynSpacingXLarge: { dark: '32px', light: '32px' },
SynSpacingXSmall: { dark: '8px', light: '8px' },
SynSpinnerOpacity: { dark: '0.4', light: '0.16' },
SynSwitchHeightLarge: { dark: '28px', light: '28px' },
SynSwitchHeightMedium: { dark: '24px', light: '24px' },
SynSwitchHeightSmall: { dark: '20px', light: '20px' },
SynSwitchWidthLarge: { dark: '48px', light: '48px' },
SynSwitchWidthMedium: { dark: '40px', light: '40px' },
SynSwitchWidthSmall: { dark: '32px', light: '32px' },
SynTableBackgroundColor: { dark: '#00051a', light: '#ffffff' },
SynTableBackgroundColorAlternating: { dark: '#0e1633', light: '#f8f7f6' },
SynTableBackgroundColorHeader: { dark: '#262f55', light: '#f2f0ed' },
SynTableBorderColor: { dark: '#262f55', light: '#e6e1dc' },
SynTableShadowEnd: { dark: 'rgba(13, 13, 13, 0)', light: 'rgba(13, 13, 13, 0)' },
SynTableShadowStart: { dark: 'rgba(13, 13, 13, 0.8)', light: 'rgba(13, 13, 13, 0.16)' },
SynTextDecorationDefault: { dark: 'none', light: 'none' },
SynTextDecorationUnderline: { dark: 'underline', light: 'underline' },
SynToggleSizeLarge: { dark: '24px', light: '24px' },
SynToggleSizeMedium: { dark: '20px', light: '20px' },
SynToggleSizeSmall: { dark: '16px', light: '16px' },
SynTooltipArrowSize: { dark: '9px', light: '9px' },
SynTooltipBackgroundColor: { dark: '#e9ebf1', light: '#0d0d0d' },
SynTooltipBorderRadius: { dark: '4px', light: '4px' },
SynTooltipColor: { dark: '#00051a', light: '#ffffff' },
SynTooltipFontFamily: { dark: "'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'", light: "'SICK Intl', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'" },
SynTooltipFontSize: { dark: '14px', light: '14px' },
SynTooltipFontWeight: { dark: '400', light: '400' },
SynTooltipLineHeight: { dark: '1.4', light: '1.4' },
SynTooltipPadding: { dark: '12px', light: '12px' },
SynTransitionFast: { dark: '150ms', light: '150ms' },
SynTransitionMedium: { dark: '250ms', light: '250ms' },
SynTransitionSlow: { dark: '500ms', light: '500ms' },
SynTransitionXFast: { dark: '50ms', light: '50ms' },
SynTransitionXSlow: { dark: '1000ms', light: '1000ms' },
SynTypographyColorText: { dark: '#e9ebf1', light: '#0d0d0d' },
SynTypographyColorTextInverted: { dark: '#00051a', light: '#ffffff' },
SynTypographyColorTextQuiet: { dark: '#9298b6', light: '#565656' },
SynTypographyColorTextQuietInverted: { dark: '#0e1633', light: '#b2b2b2' },
SynZIndexDialog: { dark: '800', light: '800' },
SynZIndexDrawer: { dark: '700', light: '700' },
SynZIndexDropdown: { dark: '900', light: '900' },
SynZIndexToast: { dark: '950', light: '950' },
SynZIndexTooltip: { dark: '1000', light: '1000' },
};