// This file is autogenerated. Please do not edit it.

import type { IStreamTokens } from '../StreamTokens.types';

export const foundations: IStreamTokens['foundations'] = {
  colors: {
    baseTransparent0: 'rgba(255, 255, 255, 0)',
    baseTransparentWhite10: 'rgba(255, 255, 255, 0.1)',
    baseTransparentWhite20: 'rgba(255, 255, 255, 0.2)',
    baseTransparentWhite30: 'rgba(255, 255, 255, 0.3)',
    baseTransparentWhite70: 'rgba(255, 255, 255, 0.7)',
    baseTransparentBlack5: 'rgba(0, 0, 0, 0.05)',
    baseTransparentBlack10: 'rgba(0, 0, 0, 0.1)',
    baseTransparentBlack70: 'rgba(0, 0, 0, 0.7)',
    baseBlack: '#000000',
    baseWhite: '#ffffff',
    slate50: '#f6f8fa',
    slate100: '#ebeef1',
    slate150: '#d5dbe1',
    slate200: '#c0c8d2',
    slate300: '#a3acba',
    slate400: '#87909f',
    slate500: '#687385',
    slate600: '#545969',
    slate700: '#414552',
    slate800: '#30313d',
    slate900: '#1a1b25',
    neutral50: '#f8f8f8',
    neutral100: '#efefef',
    neutral150: '#d8d8d8',
    neutral200: '#c4c4c4',
    neutral300: '#ababab',
    neutral400: '#8f8f8f',
    neutral500: '#6a6a6a',
    neutral600: '#565656',
    neutral700: '#464646',
    neutral800: '#323232',
    neutral900: '#1c1c1c',
    blue50: '#f3f7ff',
    blue100: '#e3edff',
    blue150: '#c3d9ff',
    blue200: '#a5c5ff',
    blue300: '#78a8ff',
    blue400: '#4586ff',
    blue500: '#005fff',
    blue600: '#1b53bd',
    blue700: '#19418d',
    blue800: '#142f63',
    blue900: '#091a3b',
    cyan50: '#f1fbfc',
    cyan100: '#d1f3f6',
    cyan150: '#a9e4ea',
    cyan200: '#72d7e0',
    cyan300: '#45bcc7',
    cyan400: '#1e9ea9',
    cyan500: '#248088',
    cyan600: '#006970',
    cyan700: '#065056',
    cyan800: '#003a3f',
    cyan900: '#002124',
    green50: '#e1ffee',
    green100: '#bdfcdb',
    green150: '#8febbd',
    green200: '#59dea3',
    green300: '#00c384',
    green400: '#00a46e',
    green500: '#277e59',
    green600: '#006643',
    green700: '#004f33',
    green800: '#003a25',
    green900: '#002213',
    purple50: '#f7f8ff',
    purple100: '#ecedff',
    purple150: '#d4d7ff',
    purple200: '#c1c5ff',
    purple300: '#a1a3ff',
    purple400: '#8482fc',
    purple500: '#644af9',
    purple600: '#553bd8',
    purple700: '#4032a1',
    purple800: '#2e2576',
    purple900: '#1a114d',
    yellow50: '#fef9da',
    yellow100: '#fcedb9',
    yellow150: '#fcd579',
    yellow200: '#f6bf57',
    yellow300: '#fa922b',
    yellow400: '#f26d10',
    yellow500: '#c84801',
    yellow600: '#a82c00',
    yellow700: '#842106',
    yellow800: '#5f1a05',
    yellow900: '#331302',
    red50: '#fff5fa',
    red100: '#ffe7f2',
    red150: '#ffccdf',
    red200: '#ffb1cd',
    red300: '#fe87a1',
    red400: '#fc526a',
    red500: '#d90d10',
    red600: '#b3093c',
    red700: '#890d37',
    red800: '#68052b',
    red900: '#3e021a',
    violet50: '#fef4ff',
    violet100: '#fbe8fe',
    violet150: '#f7cffc',
    violet200: '#eeb5f4',
    violet300: '#e68bec',
    violet400: '#d75fe7',
    violet500: '#b716ca',
    violet600: '#9d00ae',
    violet700: '#7c0089',
    violet800: '#5c0066',
    violet900: '#36003d',
    lime50: '#f1fde8',
    lime100: '#d4ffb0',
    lime150: '#b1ee79',
    lime200: '#9cda5d',
    lime300: '#78c100',
    lime400: '#639e11',
    lime500: '#4b7a0a',
    lime600: '#3e6213',
    lime700: '#355315',
    lime800: '#203a00',
    lime900: '#112100',
  },
  layout: {
    size2: 2,
    size4: 4,
    size6: 6,
    size8: 8,
    size12: 12,
    size16: 16,
    size20: 20,
    size24: 24,
    size32: 32,
    size40: 40,
    size48: 48,
    size64: 64,
    size28: 28,
    size80: 80,
    size128: 128,
    size240: 240,
    size320: 320,
    size480: 480,
    size560: 560,
    size640: 640,
    size760: 760,
    size144: 144,
    size208: 208,
    size56: 56,
  },
  radius: {
    radius0: 0,
    radius2: 2,
    radius4: 4,
    radius6: 6,
    radius8: 8,
    radius12: 12,
    radius16: 16,
    radius20: 20,
    radius24: 24,
    radius32: 32,
    radiusFull: 9999,
  },
  spacing: {
    space0: 0,
    space2: 2,
    space4: 4,
    space8: 8,
    space12: 12,
    space16: 16,
    space20: 20,
    space24: 24,
    space32: 32,
    space40: 40,
    space48: 48,
    space64: 64,
    space80: 80,
  },
  stroke: {
    w100: 1,
    w150: 1.5,
    w200: 2,
    w300: 3,
    w400: 4,
    w120: 1.2,
  },
  typography: {
    fontFamilyGeist: '"Geist"',
    fontFamilyGeistMono: '"Geist Mono"',
    fontFamilySfPro: '"SF Pro"',
    fontFamilySfMono: '"SF Mono"',
    fontFamilyRoboto: '"Roboto"',
    fontFamilyRobotoMono: '"Roboto Mono"',
    fontWeightW400: '400',
    fontWeightW500: '500',
    fontWeightW600: '600',
    fontWeightW700: '700',
    fontSizeSize8: 8,
    fontSizeSize10: 10,
    fontSizeSize11: 11,
    fontSizeSize12: 12,
    fontSizeSize13: 13,
    fontSizeSize14: 14,
    fontSizeSize16: 16,
    fontSizeSize15: 15,
    fontSizeSize17: 17,
    fontSizeSize18: 18,
    fontSizeSize20: 20,
    fontSizeSize22: 22,
    fontSizeSize24: 24,
    fontSizeSize28: 28,
    fontSizeSize32: 32,
    fontSizeSize40: 40,
    fontSizeSize48: 48,
    fontSizeSize64: 64,
    lineHeightLineHeight8: 8,
    lineHeightLineHeight10: 10,
    lineHeightLineHeight12: 12,
    lineHeightLineHeight13: 13,
    lineHeightLineHeight14: 14,
    lineHeightLineHeight15: 15,
    lineHeightLineHeight16: 16,
    lineHeightLineHeight17: 17,
    lineHeightLineHeight18: 18,
    lineHeightLineHeight20: 20,
    lineHeightLineHeight24: 24,
    lineHeightLineHeight28: 28,
    lineHeightLineHeight32: 32,
    lineHeightLineHeight40: 40,
    lineHeightLineHeight48: 48,
  },
};

export const primitives: IStreamTokens['primitives'] = {
  darkElevation1: {
    elevation: 2,
    shadowColor: 'rgba(0,0,0,0.28)',
    shadowOffset: {
      width: 0,
      height: 1.4878048780487807,
    },
    shadowOpacity: 0.42400000000000004,
    shadowRadius: 3.6926829268292685,
  },
  darkElevation2: {
    elevation: 3,
    shadowColor: 'rgba(0,0,0,0.30)',
    shadowOffset: {
      width: 0,
      height: 2,
    },
    shadowOpacity: 0.44000000000000006,
    shadowRadius: 5.630769230769231,
  },
  darkElevation3: {
    elevation: 6,
    shadowColor: 'rgba(0,0,0,0.32)',
    shadowOffset: {
      width: 0,
      height: 3.488372093023256,
    },
    shadowOpacity: 0.4696,
    shadowRadius: 11.079069767441862,
  },
  darkElevation4: {
    elevation: 8,
    shadowColor: 'rgba(0,0,0,0.36)',
    shadowOffset: {
      width: 0,
      height: 5.384615384615384,
    },
    shadowOpacity: 0.5136000000000001,
    shadowRadius: 16.892307692307693,
  },
  lightElevation1: {
    elevation: 1,
    shadowColor: 'rgba(0,0,0,0.2)',
    shadowOffset: {
      width: 0,
      height: 1,
    },
    shadowOpacity: 0.29599999999999993,
    shadowRadius: 2.8285714285714287,
  },
  lightElevation2: {
    elevation: 3,
    shadowColor: 'rgba(0,0,0,0.22)',
    shadowOffset: {
      width: 0,
      height: 2,
    },
    shadowOpacity: 0.3136,
    shadowRadius: 5.68,
  },
  lightElevation3: {
    elevation: 6,
    shadowColor: 'rgba(0,0,0,0.24)',
    shadowOffset: {
      width: 0,
      height: 3.5,
    },
    shadowOpacity: 0.36160000000000003,
    shadowRadius: 11.100000000000001,
  },
  lightElevation4: {
    elevation: 8,
    shadowColor: 'rgba(0,0,0,0.28)',
    shadowOffset: {
      width: 0,
      height: 5.4,
    },
    shadowOpacity: 0.40959999999999996,
    shadowRadius: 16.919999999999998,
  },
  radius2xl: foundations.radius.radius20,
  radius3xl: foundations.radius.radius24,
  radius4xl: foundations.radius.radius32,
  radiusLg: foundations.radius.radius12,
  radiusMax: foundations.radius.radiusFull,
  radiusMd: foundations.radius.radius8,
  radiusNone: foundations.radius.radius0,
  radiusSm: foundations.radius.radius6,
  radiusXl: foundations.radius.radius16,
  radiusXs: foundations.radius.radius4,
  radiusXxs: foundations.radius.radius2,
  spacing2xl: foundations.spacing.space32,
  spacing3xl: foundations.spacing.space40,
  spacingLg: foundations.spacing.space20,
  spacingMd: foundations.spacing.space16,
  spacingNone: foundations.spacing.space0,
  spacingSm: foundations.spacing.space12,
  spacingXl: foundations.spacing.space24,
  spacingXs: foundations.spacing.space8,
  spacingXxs: foundations.spacing.space4,
  spacingXxxs: foundations.spacing.space2,
  typographyFontFamilyMono: foundations.typography.fontFamilyRobotoMono,
  typographyFontFamilySans: foundations.typography.fontFamilyRoboto,
  typographyFontSize2xl: foundations.typography.fontSizeSize24,
  typographyFontSizeLg: foundations.typography.fontSizeSize18,
  typographyFontSizeMd: foundations.typography.fontSizeSize16,
  typographyFontSizeMicro: foundations.typography.fontSizeSize8,
  typographyFontSizeSm: foundations.typography.fontSizeSize14,
  typographyFontSizeXl: foundations.typography.fontSizeSize20,
  typographyFontSizeXs: foundations.typography.fontSizeSize12,
  typographyFontSizeXxs: foundations.typography.fontSizeSize10,
  typographyFontWeightBold: 700,
  typographyFontWeightMedium: 500,
  typographyFontWeightRegular: 400,
  typographyFontWeightSemiBold: 600,
  typographyLineHeightNormal: foundations.typography.lineHeightLineHeight20,
  typographyLineHeightRelaxed: foundations.typography.lineHeightLineHeight24,
  typographyLineHeightTight: foundations.typography.lineHeightLineHeight16,
} as const;

export const components: IStreamTokens['components'] = {
  buttonHitTargetMinHeight: foundations.layout.size48,
  buttonHitTargetMinWidth: foundations.layout.size48,
  buttonPaddingXIconOnlyLg: 14,
  buttonPaddingXIconOnlyMd: 10,
  buttonPaddingXIconOnlySm: 6,
  buttonPaddingXIconOnlyXs: 4,
  buttonPaddingXWithLabelLg: 16,
  buttonPaddingXWithLabelMd: 16,
  buttonPaddingXWithLabelSm: 16,
  buttonPaddingXWithLabelXs: 12,
  buttonPaddingYLg: 14,
  buttonPaddingYMd: 10,
  buttonPaddingYSm: 6,
  buttonPaddingYXs: 4,
  buttonRadiusFull: foundations.radius.radiusFull,
  buttonRadiusLg: foundations.radius.radiusFull,
  buttonRadiusMd: foundations.radius.radiusFull,
  buttonRadiusSm: foundations.radius.radiusFull,
  buttonVisualHeightLg: foundations.layout.size48,
  buttonVisualHeightMd: foundations.layout.size40,
  buttonVisualHeightSm: foundations.layout.size32,
  buttonVisualHeightXs: foundations.layout.size24,
  composerRadiusFixed: primitives.radius3xl,
  composerRadiusFloating: primitives.radius3xl,
  deviceRadius: primitives.radius4xl,
  deviceSafeAreaBottom: foundations.spacing.space40,
  deviceSafeAreaTop: 52,
  emoji2xl: foundations.typography.fontSizeSize64,
  emojiLg: foundations.typography.fontSizeSize32,
  emojiMd: foundations.typography.fontSizeSize24,
  emojiSm: primitives.typographyFontSizeMd,
  emojiXl: foundations.typography.fontSizeSize48,
  iconSizeLg: foundations.layout.size32,
  iconSizeMd: foundations.layout.size20,
  iconSizeSm: foundations.layout.size16,
  iconSizeXs: foundations.layout.size12,
  iconStrokeDefault: foundations.stroke.w150,
  iconStrokeEmphasis: foundations.stroke.w200,
  iconStrokeSubtle: foundations.stroke.w120,
  messageBubbleRadiusAttachment: primitives.radiusLg,
  messageBubbleRadiusAttachmentInline: primitives.radiusMd,
  messageBubbleRadiusGroupBottom: primitives.radius2xl,
  messageBubbleRadiusGroupMiddle: primitives.radius2xl,
  messageBubbleRadiusGroupTop: primitives.radius2xl,
  messageBubbleRadiusTail: primitives.radiusNone,
} as const;

export const semantics: IStreamTokens['semantics'] = {
  accentError: foundations.colors.red400,
  accentNeutral: '$chrome500',
  accentPrimary: '$brand400',
  accentSuccess: foundations.colors.green300,
  accentWarning: foundations.colors.yellow300,
  avatarBgDefault: '$avatarPaletteBg1',
  avatarBgPlaceholder: '$chrome150',
  avatarPaletteBg1: foundations.colors.blue600,
  avatarPaletteBg2: foundations.colors.cyan600,
  avatarPaletteBg3: foundations.colors.green600,
  avatarPaletteBg4: foundations.colors.purple600,
  avatarPaletteBg5: foundations.colors.yellow600,
  avatarPaletteText1: foundations.colors.blue100,
  avatarPaletteText2: foundations.colors.cyan100,
  avatarPaletteText3: foundations.colors.green100,
  avatarPaletteText4: foundations.colors.purple100,
  avatarPaletteText5: foundations.colors.yellow100,
  avatarPresenceBgOffline: '$accentNeutral',
  avatarPresenceBgOnline: '$accentSuccess',
  avatarPresenceBorder: '$borderCoreOnInverse',
  avatarTextDefault: '$avatarPaletteText1',
  avatarTextPlaceholder: '$chrome500',
  backgroundCoreApp: '$chrome0',
  backgroundCoreElevation0: '$chrome0',
  backgroundCoreElevation1: '$chrome50',
  backgroundCoreElevation2: '$chrome100',
  backgroundCoreElevation3: '$chrome200',
  backgroundCoreHighlight: foundations.colors.yellow800,
  backgroundCoreInverse: '$chrome1000',
  backgroundCoreOnAccent: '$chrome1000',
  backgroundCoreOverlayDark: 'rgba(0, 0, 0, 0.5)',
  backgroundCoreOverlayLight: 'rgba(0, 0, 0, 0.75)',
  backgroundCoreScrim: 'rgba(0, 0, 0, 0.75)',
  backgroundCoreSurfaceCard: '$chrome100',
  backgroundCoreSurfaceDefault: '$chrome100',
  backgroundCoreSurfaceStrong: '$chrome150',
  backgroundCoreSurfaceSubtle: '$chrome50',
  backgroundUtilityDisabled: '$chrome100',
  backgroundUtilityHover: 'rgba(255, 255, 255, 0.15)',
  backgroundUtilityPressed: 'rgba(255, 255, 255, 0.2)',
  backgroundUtilitySelected: 'rgba(255, 255, 255, 0.25)',
  badgeBgDefault: '$backgroundCoreElevation3',
  badgeBgError: '$accentError',
  badgeBgInverse: '$chrome1000',
  badgeBgNeutral: '$accentNeutral',
  badgeBgOverlay: 'rgba(0, 0, 0, 0.75)',
  badgeBgPrimary: '$accentPrimary',
  badgeBorder: '$borderCoreOnInverse',
  badgeText: '$textPrimary',
  badgeTextOnAccent: '$textOnAccent',
  badgeTextOnInverse: '$textOnInverse',
  borderCoreDefault: '$chrome200',
  borderCoreInverse: '$chrome0',
  borderCoreOnAccent: '$chrome1000',
  borderCoreOnInverse: '$chrome0',
  borderCoreOnSurface: '$chrome300',
  borderCoreOpacityStrong: 'rgba(255, 255, 255, 0.25)',
  borderCoreOpacitySubtle: 'rgba(255, 255, 255, 0.2)',
  borderCoreStrong: '$chrome300',
  borderCoreSubtle: '$chrome100',
  borderUtilityActive: '$accentPrimary',
  borderUtilityDisabled: '$chrome100',
  borderUtilityDisabledOnSurface: '$chrome150',
  borderUtilityError: '$accentError',
  borderUtilityFocused: '$brand150',
  borderUtilityHover: 'rgba(255, 255, 255, 0.1)',
  borderUtilityPressed: 'rgba(255, 255, 255, 0.2)',
  borderUtilitySelected: 'rgba(255, 255, 255, 0.15)',
  borderUtilitySuccess: '$accentSuccess',
  borderUtilityWarning: '$accentWarning',
  brand50: foundations.colors.blue900,
  brand100: foundations.colors.blue800,
  brand150: foundations.colors.blue700,
  brand200: foundations.colors.blue600,
  brand300: foundations.colors.blue500,
  brand400: foundations.colors.blue400,
  brand500: foundations.colors.blue300,
  brand600: foundations.colors.blue200,
  brand700: foundations.colors.blue150,
  brand800: foundations.colors.blue100,
  brand900: foundations.colors.blue50,
  buttonDestructiveBg: '$accentError',
  buttonDestructiveBgLiquidGlass: '$backgroundCoreElevation0',
  buttonDestructiveBorder: '$accentError',
  buttonDestructiveBorderOnDark: '$textOnInverse',
  buttonDestructiveText: '$accentError',
  buttonDestructiveTextOnAccent: '$textOnAccent',
  buttonDestructiveTextOnDark: '$textOnInverse',
  buttonPrimaryBg: '$accentPrimary',
  buttonPrimaryBgLiquidGlass: foundations.colors.baseTransparent0,
  buttonPrimaryBorder: '$brand200',
  buttonPrimaryBorderOnDark: '$borderCoreOnInverse',
  buttonPrimaryText: '$accentPrimary',
  buttonPrimaryTextOnAccent: '$textOnAccent',
  buttonPrimaryTextOnDark: '$textOnInverse',
  buttonSecondaryBg: '$backgroundCoreSurfaceDefault',
  buttonSecondaryBgLiquidGlass: '$backgroundCoreElevation0',
  buttonSecondaryBorder: '$borderCoreDefault',
  buttonSecondaryBorderOnDark: '$borderCoreOnInverse',
  buttonSecondaryText: '$textPrimary',
  buttonSecondaryTextOnAccent: '$textPrimary',
  buttonSecondaryTextOnDark: '$textOnInverse',
  chatBgAttachmentIncoming: '$backgroundCoreSurfaceStrong',
  chatBgAttachmentOutgoing: '$brand150',
  chatBgIncoming: '$backgroundCoreSurfaceDefault',
  chatBgOutgoing: '$brand100',
  chatBorderIncoming: '$borderCoreSubtle',
  chatBorderOnChatIncoming: '$borderCoreStrong',
  chatBorderOnChatOutgoing: '$brand300',
  chatBorderOutgoing: '$brand100',
  chatPollProgressFillIncoming: '$controlProgressBarFill',
  chatPollProgressFillOutgoing: '$accentPrimary',
  chatPollProgressTrackIncoming: '$controlProgressBarTrack',
  chatPollProgressTrackOutgoing: '$brand200',
  chatReplyIndicatorIncoming: '$chrome400',
  chatReplyIndicatorOutgoing: '$brand400',
  chatTextIncoming: '$textPrimary',
  chatTextLink: '$textLink',
  chatTextMention: '$textLink',
  chatTextOutgoing: '$brand900',
  chatTextReaction: '$textSecondary',
  chatTextRead: '$accentPrimary',
  chatTextSystem: '$textSecondary',
  chatTextTimestamp: '$textTertiary',
  chatTextTypingIndicator: '$chatTextIncoming',
  chatTextUsername: '$textSecondary',
  chatThreadConnectorIncoming: '$borderCoreDefault',
  chatThreadConnectorOutgoing: '$brand150',
  chatWaveformBar: '$borderCoreOpacityStrong',
  chatWaveformBarPlaying: '$accentPrimary',
  chrome0: foundations.colors.baseBlack,
  chrome50: foundations.colors.neutral900,
  chrome100: foundations.colors.neutral800,
  chrome150: foundations.colors.neutral700,
  chrome200: foundations.colors.neutral600,
  chrome300: foundations.colors.neutral500,
  chrome400: foundations.colors.neutral400,
  chrome500: foundations.colors.neutral300,
  chrome600: foundations.colors.neutral200,
  chrome700: foundations.colors.neutral150,
  chrome800: foundations.colors.neutral100,
  chrome900: foundations.colors.neutral50,
  chrome1000: foundations.colors.baseWhite,
  controlCheckboxBg: foundations.colors.baseTransparent0,
  controlCheckboxBgSelected: '$accentPrimary',
  controlCheckboxBorder: '$borderCoreDefault',
  controlCheckboxIcon: '$textOnAccent',
  controlChipBorder: '$borderCoreDefault',
  controlChipText: '$textPrimary',
  controlPlaybackThumbBgActive: '$accentPrimary',
  controlPlaybackThumbBgDefault: '$backgroundCoreOnAccent',
  controlPlaybackThumbBorderActive: '$borderCoreOnAccent',
  controlPlaybackThumbBorderDefault: '$borderCoreOpacityStrong',
  controlPlaybackToggleBorder: '$borderCoreDefault',
  controlPlaybackToggleText: '$textPrimary',
  controlPlayButtonBg: 'rgba(0, 0, 0, 0.75)',
  controlPlayButtonIcon: '$textOnAccent',
  controlProgressBarFill: '$accentNeutral',
  controlProgressBarTrack: '$backgroundCoreSurfaceStrong',
  controlRadioButtonBg: foundations.colors.baseTransparent0,
  controlRadioButtonBgSelected: '$accentPrimary',
  controlRadioButtonBorder: '$borderCoreDefault',
  controlRadioButtonIndicator: '$textOnAccent',
  controlRadioCheckBg: foundations.colors.baseTransparent0,
  controlRadioCheckBgSelected: '$accentPrimary',
  controlRadioCheckBorder: '$borderCoreDefault',
  controlRadioCheckIcon: '$textOnAccent',
  controlRemoveControlBg: '$backgroundCoreInverse',
  controlRemoveControlBorder: '$borderCoreOnInverse',
  controlRemoveControlIcon: '$textOnInverse',
  controlToggleSwitchBg: '$accentNeutral',
  controlToggleSwitchBgDisabled: '$backgroundUtilityDisabled',
  controlToggleSwitchBgSelected: '$accentPrimary',
  controlToggleSwitchKnob: '$backgroundCoreOnAccent',
  inputSendIcon: '$accentPrimary',
  inputSendIconDisabled: '$textDisabled',
  inputTextDefault: '$textPrimary',
  inputTextDisabled: '$textDisabled',
  inputTextIcon: '$textTertiary',
  inputTextPlaceholder: '$textTertiary',
  presenceBgOffline: '$accentNeutral',
  presenceBgOnline: '$accentSuccess',
  presenceBorder: '$borderCoreInverse',
  reactionBg: '$backgroundCoreElevation3',
  reactionBorder: '$borderCoreDefault',
  reactionEmoji: '$textPrimary',
  reactionText: '$textPrimary',
  skeletonLoadingBase: foundations.colors.baseTransparent0,
  skeletonLoadingHighlight: '$backgroundCoreOverlayLight',
  systemBgBlur: 'rgba(0, 0, 0, 0.01)',
  systemCaret: '$accentPrimary',
  systemScrollbar: 'rgba(255, 255, 255, 0.5)',
  systemText: '$chrome1000',
  textDisabled: '$chrome300',
  textLink: '$brand600',
  textOnAccent: '$chrome1000',
  textOnInverse: '$chrome0',
  textPrimary: '$chrome900',
  textSecondary: '$chrome700',
  textTertiary: '$chrome500',
} as const;