@twilio-paste/design-tokens/dist/themes/evergreen/tokens.json

Paste Design System Tokens package with a number of different formats for Web, Mobile, and Sketch.

{
  "color-background-user": "rgb(231, 228, 249)",
  "color-background-trial": "rgb(220, 242, 234)",
  "color-background-subaccount": "rgb(255, 239, 210)",
  "color-background-primary-stronger": "rgb(31, 61, 153)",
  "color-background-destructive-stronger": "rgb(125, 40, 40)",
  "color-background-primary-weaker": "rgb(235, 240, 255)",
  "color-background-destructive-weaker": "rgb(249, 218, 218)",
  "color-background-warning": "rgb(222, 117, 72)",
  "color-background-warning-weakest": "rgb(253, 247, 244)",
  "color-background-inverse-strong": "rgb(71, 77, 102)",
  "color-background-new": "rgb(231, 228, 249)",
  "color-background-strong": "rgb(230, 232, 240)",
  "color-background-new-weakest": "rgb(250, 247, 253)",
  "color-background-destructive": "rgb(209, 67, 67)",
  "color-background-weak": "rgb(249, 250, 252)",
  "color-background-primary": "rgb(51, 102, 255)",
  "color-background-primary-weakest": "rgb(243, 246, 255)",
  "color-background-busy": "rgb(222, 117, 72)",
  "color-background-success": "rgb(82, 189, 148)",
  "color-background-destructive-weakest": "rgb(253, 244, 244)",
  "color-background-offline": "rgb(193, 196, 214)",
  "color-background-row-striped": "rgb(250, 251, 255)",
  "color-background-primary-strongest": "rgb(12, 30, 86)",
  "color-background-success-weakest": "rgb(238, 248, 244)",
  "color-background-destructive-strongest": "rgb(79, 21, 21)",
  "color-background-error-strong": "rgb(167, 54, 54)",
  "color-background-brand-strong": "rgb(3, 11, 93)",
  "color-background-brand": "rgb(71, 77, 102)",
  "color-background-error": "rgb(209, 67, 67)",
  "color-background-neutral-weakest": "rgb(244, 246, 250)",
  "color-background-available": "rgb(82, 189, 148)",
  "color-background-error-weakest": "rgb(253, 244, 244)",
  "color-background-required": "rgb(235, 86, 86)",
  "color-background-error-strongest": "rgb(49, 12, 12)",
  "color-background-decorative-40-weakest": "rgb(248, 247, 253)",
  "color-background-inverse-stronger": "rgb(105, 111, 140)",
  "color-background-decorative-30-weakest": "rgb(238, 248, 244)",
  "color-background-body": "rgb(255, 255, 255)",
  "color-background-primary-strong": "rgb(41, 82, 204)",
  "color-background-decorative-20-weakest": "rgb(243, 246, 255)",
  "color-background-destructive-strong": "rgb(167, 54, 54)",
  "color-background-destructive-weak": "rgb(244, 182, 182)",
  "color-background-decorative-10-weakest": "rgb(244, 246, 250)",
  "color-background": "rgb(244, 246, 250)",
  "color-background-primary-weak": "rgb(214, 224, 255)",
  "color-background-stronger": "rgb(193, 196, 214)",
  "color-background-brand-highlight": "rgb(82, 189, 148)",
  "color-background-brand-highlight-weakest": "rgb(220, 242, 234)",
  "color-background-strongest": "rgb(105, 111, 140)",
  "color-background-body-inverse": "rgb(16, 24, 64)",
  "color-background-inverse": "rgb(16, 24, 64)",
  "color-background-overlay": "rgba(71, 77, 102, 0.64)",
  "color-background-unavailable": "rgb(209, 67, 67)",
  "color-background-error-stronger": "rgb(125, 40, 40)",
  "color-background-brand-stronger": "rgb(6, 3, 58)",
  "color-border-error-stronger": "rgb(125, 40, 40)",
  "color-border-warning-weak": "rgb(235, 172, 145)",
  "color-border-decorative-40-weaker": "rgb(231, 228, 249)",
  "color-border-error-weaker": "rgb(244, 182, 182)",
  "color-border-user": "rgb(231, 220, 250)",
  "color-border-neutral-weaker": "rgb(214, 224, 255)",
  "color-border-warning": "rgb(222, 117, 72)",
  "color-border-success-weaker": "rgb(220, 242, 234)",
  "color-border-primary-stronger": "rgb(31, 61, 153)",
  "color-border-destructive-stronger": "rgb(125, 40, 40)",
  "color-border-warning-weakest": "rgb(248, 227, 218)",
  "color-border-primary-weaker": "rgb(214, 224, 255)",
  "color-border-destructive-weaker": "rgb(249, 218, 218)",
  "color-border-new-weaker": "rgb(231, 228, 249)",
  "color-border-destructive": "rgb(209, 67, 67)",
  "color-border-inverse-strong": "rgb(225, 227, 234)",
  "color-border-primary": "rgb(51, 102, 255)",
  "color-border-primary-weakest": "rgb(235, 240, 255)",
  "color-border-success": "rgb(82, 189, 148)",
  "color-border-destructive-weakest": "rgb(253, 244, 244)",
  "color-border-destructive-strongest": "rgb(49, 12, 12)",
  "color-border-primary-strongest": "rgb(12, 30, 86)",
  "color-border-success-weakest": "rgb(238, 248, 244)",
  "color-border-warning-weaker": "rgb(242, 200, 182)",
  "color-border-strong": "rgb(143, 149, 178)",
  "color-border-weak": "rgb(230, 232, 240)",
  "color-border-neutral": "rgb(51, 102, 255)",
  "color-border-error": "rgb(209, 67, 67)",
  "color-border-error-weakest": "rgb(249, 218, 218)",
  "color-border-error-strongest": "rgb(49, 12, 12)",
  "color-border-error-strong": "rgb(167, 54, 54)",
  "color-border-error-weak": "rgb(238, 145, 145)",
  "color-border-neutral-weak": "rgb(157, 181, 255)",
  "color-border": "rgb(216, 218, 229)",
  "color-border-weakest": "rgb(255, 255, 255)",
  "color-border-inverse-stronger": "rgb(244, 244, 246)",
  "color-border-inverse-weaker": "rgb(57, 71, 98)",
  "color-border-success-weak": "rgb(163, 230, 205)",
  "color-border-primary-strong": "rgb(41, 82, 204)",
  "color-border-inverse": "rgb(136, 145, 170)",
  "color-border-destructive-strong": "rgb(167, 54, 54)",
  "color-border-primary-weak": "rgb(157, 181, 255)",
  "color-border-inverse-weakest": "rgb(31, 48, 76)",
  "color-border-destructive-weak": "rgb(244, 182, 182)",
  "color-border-inverse-strongest": "rgb(255, 255, 255)",
  "color-border-weaker": "rgb(237, 239, 245)",
  "color-border-decorative-10-weaker": "rgb(216, 218, 229)",
  "color-border-decorative-20-weaker": "rgb(214, 224, 255)",
  "color-border-decorative-30-weaker": "rgb(238, 248, 244)",
  "border-radius-0": "0",
  "border-radius-10": "2px",
  "border-radius-20": "4px",
  "border-radius-30": "8px",
  "border-radius-circle": "50%",
  "border-radius-pill": "100px",
  "border-width-0": "0",
  "border-width-10": "1px",
  "border-width-20": "2px",
  "border-width-30": "4px",
  "border-width-40": "8px",
  "shadow-border-bottom-new-weaker": "0 1px 0 #D0CAF4",
  "shadow": "0 4px 16px 0 rgba(0, 0, 0, 0.5)",
  "shadow-border-subaccount": "0 0 0 1px #fff1b3",
  "shadow-border-destructive-stronger": "0 0 0 1px #7D2828",
  "shadow-border-success-weaker": "0 0 0 1px #d1fae0",
  "shadow-border-inverse-new-weaker": "0 0 0 1px #5817bd",
  "shadow-border-primary-stronger": "0 0 0 1px #1F3D99",
  "shadow-border-bottom-warning-weaker": "0 1px 0 #F2C8B6",
  "shadow-border-destructive-weaker": "0 0 0 1px #F9DADA",
  "shadow-border-primary-weaker": "0 0 0 1px #D6E0FF",
  "shadow-border-new-weaker": "0 0 0 1px #e7dcfa",
  "shadow-low": "0 2px 4px 0 rgba(0, 0, 0, 0.4)",
  "shadow-border-inverse-strong": "0 0 0 1px #e1e3ea",
  "shadow-border-warning-weaker": "0 0 0 1px #fddcc4",
  "shadow-border-strong": "0 0 0 1px #8F95B2",
  "shadow-focus": "0 0 0 2px #ffffff, 0 0 0 3px #006dfa, 0 0 0 5px #cce4ff",
  "shadow-border-weak": "0 0 0 1px #E6E8F0",
  "shadow-focus-inverse": "0 0 0 4px rgba(255, 255, 255, 0.4)",
  "shadow-border-primary": "0 0 0 1px #3366FF",
  "shadow-border-destructive": "0 0 0 1px #D14343",
  "shadow-high": "0 16px 24px 4px rgba(0, 0, 0, 0.5)",
  "shadow-border-error-strong": "0 0 0 1px #A73636",
  "shadow-border-primary-strongest": "0 0 0 1px #0C1E56",
  "shadow-border-destructive-strongest": "0 0 0 1px #310C0C",
  "shadow-border-error-weak": "0 0 0 1px #F4B6B6",
  "shadow-border-error": "0 0 0 1px #D14343",
  "shadow-border-bottom-decorative-10-weaker": "0 1px 0 #D8DAE5",
  "shadow-border-bottom-primary": "0 1px 0 #006dfa",
  "shadow-border-bottom-decorative-20-weaker": "0 1px 0 #D6E0FF",
  "shadow-border-inverse-stronger": "0 0 0 1px #f4f4f6",
  "shadow-border-error-strongest": "0 0 0 1px #310c0c",
  "shadow-border-destructive-strong": "0 0 0 1px #A73636",
  "shadow-border-inverse-weaker": "0 0 0 1px #394762",
  "shadow-border-bottom-decorative-30-weaker": "0 1px 0 #DCF2EA",
  "shadow-border-primary-strong": "0 0 0 1px #2952CC",
  "shadow-border-primary-weak": "0 0 0 1px #9DB5FF",
  "shadow-focus-shadow-border": "0 0 0 1px #cacdd8, 0 0 0 3px #ffffff, 0 0 0 4px #006dfa, 0 0 0 6px #cce4ff",
  "shadow-border-bottom-decorative-40-weaker": "0 1px 0 #D0CAF4",
  "shadow-border-destructive-weak": "0 0 0 1px #F4B6B6",
  "shadow-border-bottom-error-weaker": "0 1px 0 #F4B6B6",
  "shadow-border-weaker": "0 0 0 1px #EDEFF5",
  "shadow-border": "0 0 0 1px #D8DAE5",
  "shadow-border-bottom-neutral-weaker": "0 1px 0 #9DB5FF",
  "shadow-border-decorative-10-weaker": "0 0 0 1px #e1e3ea",
  "shadow-border-decorative-20-weaker": "0 0 0 1px #cce4ff",
  "shadow-border-bottom-subaccount": "0 1px 0 #ffdd35",
  "shadow-focus-inset": "inset 0 0 0 2px #9DB5FF",
  "shadow-border-inverse": "0 0 0 1px #8891aa",
  "shadow-border-decorative-30-weaker": "0 0 0 1px #d1fae0",
  "shadow-border-inverse-weakest": "0 0 0 1px #1f304c",
  "shadow-border-bottom-inverse-new-weaker": "0 1px 0 #5817bd",
  "shadow-border-bottom-success-weaker": "0 1px 0 #DCF2EA",
  "shadow-border-decorative-40-weaker": "0 0 0 1px #e7dcfa",
  "shadow-border-error-stronger": "0 0 0 1px #7D2828",
  "shadow-card": "0 2px 4px 0 rgba(0, 0, 0, 0.4)",
  "shadow-border-error-weaker": "0 0 0 1px #fccfcf",
  "shadow-border-inverse-strongest": "0 0 0 1px #ffffff",
  "shadow-focus-inverse-inset": "inset 0 0 0 2px rgba(255, 255, 255, 0.4)",
  "shadow-border-user": "0 0 0 1px #8c5bd8",
  "shadow-border-neutral-weaker": "0 0 0 1px #cce4ff",
  "font-family-text": "'SF UI Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
  "font-family-code": "'SF Mono', Monaco, Inconsolata, 'Fira Mono', 'Droid Sans Mono', 'Source Code Pro', monospace",
  "font-family-text-japanese": "'Inter var experimental', 'Inter var', Hiragino Sans, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, Osaka, 'MS PGothic', sans-serif",
  "font-family-text-korean": "'Inter var experimental', 'Inter var', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, sans-serif",
  "font-family-text-chinese-traditional": "'Inter var experimental', 'Inter var', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, sans-serif",
  "font-family-text-chinese-simplified": "'Inter var experimental', 'Inter var', 'Microsoft YaHei New', 微软雅黑, 'Microsoft Yahei', 'Microsoft JhengHei', 宋体, SimSun, sans-serif",
  "font-family-display": "'Inter var experimental', 'Inter var', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif",
  "font-size-110": "4rem",
  "font-size-100": "3rem",
  "font-size-90": "2rem",
  "font-size-80": "2rem",
  "font-size-70": "1.5rem",
  "font-size-60": "1.25rem",
  "font-size-50": "1rem",
  "font-size-40": "0.875rem",
  "font-size-30": "0.875rem",
  "font-size-20": "0.75rem",
  "font-size-10": "0.75rem",
  "font-size-display-30": "4rem",
  "font-size-display-20": "3rem",
  "font-size-display-10": "2rem",
  "font-size-base": "100%",
  "font-weight-light": "300",
  "font-weight-normal": "400",
  "font-weight-medium": "500",
  "font-weight-semibold": "600",
  "font-weight-bold": "700",
  "font-weight-extrabold": "800",
  "line-height-0": "0",
  "line-height-110": "4rem",
  "line-height-90": "2.75rem",
  "line-height-100": "3.25rem",
  "line-height-80": "2.5rem",
  "line-height-70": "2rem",
  "line-height-60": "1.75rem",
  "line-height-50": "1.75rem",
  "line-height-40": "1.5rem",
  "line-height-30": "1.25rem",
  "line-height-20": "1.25rem",
  "line-height-10": "1rem",
  "line-height-05": "0.75rem",
  "line-height-display-30": "5rem",
  "line-height-display-20": "3.75rem",
  "line-height-display-10": "2.5rem",
  "color-brand-highlight": "rgb(242, 47, 70)",
  "color-gray-0": "rgb(255, 255, 255)",
  "color-gray-100": "rgb(18, 28, 45)",
  "color-gray-90": "rgb(31, 48, 76)",
  "color-gray-80": "rgb(57, 71, 98)",
  "color-gray-70": "rgb(75, 86, 113)",
  "color-gray-60": "rgb(96, 107, 133)",
  "color-gray-50": "rgb(136, 145, 170)",
  "color-gray-40": "rgb(174, 178, 193)",
  "color-brand": "rgb(0, 20, 137)",
  "color-gray-30": "rgb(202, 205, 216)",
  "color-gray-20": "rgb(225, 227, 234)",
  "color-gray-10": "rgb(244, 244, 246)",
  "color-data-visualization-10": "rgb(243, 103, 43)",
  "color-data-visualization-1": "rgb(4, 162, 174)",
  "color-data-visualization-2": "rgb(209, 129, 0)",
  "color-data-visualization-3": "rgb(24, 65, 191)",
  "color-data-visualization-4": "rgb(122, 103, 233)",
  "color-data-visualization-5": "rgb(17, 167, 110)",
  "color-data-visualization-6": "rgb(10, 29, 123)",
  "color-data-visualization-7": "rgb(221, 54, 173)",
  "color-data-visualization-8": "rgb(206, 32, 28)",
  "color-data-visualization-9": "rgb(105, 140, 247)",
  "size-square-40": "0.75rem",
  "size-icon-80": "2.5rem",
  "size-square-30": "0.5rem",
  "size-icon-70": "2rem",
  "size-square-20": "0.25rem",
  "size-icon-60": "1.75rem",
  "size-90": "57.5rem",
  "size-square-10": "0.125rem",
  "size-120": "77rem",
  "size-icon-50": "1.75rem",
  "size-80": "51rem",
  "size-0": "0",
  "size-110": "70.5rem",
  "size-icon-40": "1.5rem",
  "size-square-190": "4.5rem",
  "size-70": "44.5rem",
  "size-100": "64rem",
  "size-icon-30": "1.25rem",
  "size-square-180": "4.25rem",
  "size-60": "38rem",
  "size-icon-20": "1.25rem",
  "size-square-170": "4rem",
  "size-sidebar-compact": "4.75rem",
  "size-icon-10": "1rem",
  "size-square-25": "0.375rem",
  "size-square-160": "3.75rem",
  "size-50": "31.5rem",
  "size-icon-110": "4rem",
  "size-square-150": "3.5rem",
  "size-40": "25rem",
  "size-icon-100": "3.25rem",
  "size-square-140": "3.25rem",
  "size-30": "18.5rem",
  "size-topbar": "4.75rem",
  "size-square-130": "3rem",
  "size-20": "12rem",
  "size-square-120": "2.75rem",
  "size-10": "5.5rem",
  "size-square-110": "2.5rem",
  "size-square-0": "0",
  "size-icon-05": "0.75rem",
  "size-square-100": "2.25rem",
  "size-square-200": "4.75rem",
  "size-sidebar": "15rem",
  "size-square-90": "2rem",
  "size-square-80": "1.75rem",
  "size-square-70": "1.5rem",
  "size-square-60": "1.25rem",
  "size-square-50": "1rem",
  "size-icon-90": "2.75rem",
  "space-70": "1.5rem",
  "space-negative-100": "-2.25rem",
  "space-60": "1.25rem",
  "space-negative-200": "-4.75rem",
  "space-190": "4.5rem",
  "space-50": "1rem",
  "space-180": "4.25rem",
  "space-40": "0.75rem",
  "space-170": "4rem",
  "space-30": "0.5rem",
  "space-160": "3.75rem",
  "space-20": "0.25rem",
  "space-150": "3.5rem",
  "space-10": "0.125rem",
  "space-140": "3.25rem",
  "space-130": "3rem",
  "space-120": "2.75rem",
  "space-negative-90": "-2rem",
  "space-110": "2.5rem",
  "space-0": "0",
  "space-negative-80": "-1.75rem",
  "space-100": "2.25rem",
  "space-negative-70": "-1.5rem",
  "space-200": "4.75rem",
  "space-negative-60": "-1.25rem",
  "space-negative-50": "-1rem",
  "space-negative-40": "-0.75rem",
  "space-negative-30": "-0.5rem",
  "space-negative-20": "-0.25rem",
  "space-negative-10": "-0.125rem",
  "space-negative-190": "-4.5rem",
  "space-negative-180": "-4.25rem",
  "space-negative-170": "-4rem",
  "space-negative-160": "-3.75rem",
  "space-negative-150": "-3.5rem",
  "space-negative-140": "-3.25rem",
  "space-negative-130": "-3rem",
  "space-90": "2rem",
  "space-negative-120": "-2.75rem",
  "space-80": "1.75rem",
  "space-negative-110": "-2.5rem",
  "color-text-link-destructive-weak": "rgb(209, 67, 67)",
  "color-text-link-stronger": "rgb(12, 30, 86)",
  "color-text-user": "rgb(109, 46, 209)",
  "color-text-icon-new": "rgb(109, 46, 209)",
  "color-text-subaccount": "rgb(84, 51, 8)",
  "color-text-destructive-stronger": "rgb(74, 11, 11)",
  "color-text-icon-offline": "rgb(143, 149, 178)",
  "color-text-link-destructive": "rgb(209, 67, 67)",
  "color-text-primary-stronger": "rgb(3, 11, 93)",
  "color-text-icon-success": "rgb(82, 189, 148)",
  "color-text-warning": "rgb(178, 94, 58)",
  "color-text-link-destructive-strongest": "rgb(49, 12, 12)",
  "color-text-icon-neutral": "rgb(41, 82, 204)",
  "color-text-new": "rgb(82, 73, 136)",
  "color-text-icon-error": "rgb(209, 67, 67)",
  "color-text-inverse-weak": "rgb(136, 145, 170)",
  "color-text-icon-available": "rgb(82, 189, 148)",
  "color-text-link-destructive-stronger": "rgb(49, 12, 12)",
  "color-text-icon-brand-inverse": "rgb(255, 255, 255)",
  "color-text-destructive": "rgb(199, 35, 35)",
  "color-text-primary": "rgb(2, 99, 224)",
  "color-text-success": "rgb(36, 99, 75)",
  "color-text-inverse-new": "rgb(200, 175, 240)",
  "color-text-destructive-strongest": "rgb(49, 12, 12)",
  "color-text-weak": "rgb(105, 111, 140)",
  "color-text-primary-strongest": "rgb(6, 3, 58)",
  "color-text-icon": "rgb(143, 149, 178)",
  "color-text-link": "rgb(51, 102, 255)",
  "color-text-icon-brand-highlight": "rgb(82, 189, 148)",
  "color-text-neutral": "rgb(31, 61, 153)",
  "color-text-link-strongest": "rgb(7, 19, 55)",
  "color-text-error": "rgb(167, 54, 54)",
  "color-text-icon-inverse": "rgb(143, 149, 178)",
  "color-text-error-strong": "rgb(125, 40, 40)",
  "color-text-icon-unavailable": "rgb(209, 67, 67)",
  "color-text-error-weak": "rgb(209, 67, 67)",
  "color-text-decorative-40": "rgb(110, 98, 182)",
  "color-text-link-strong": "rgb(31, 61, 153)",
  "color-text-brand-inverse": "rgb(255, 255, 255)",
  "color-text-error-strongest": "rgb(49, 12, 12)",
  "color-text-decorative-30": "rgb(49, 113, 89)",
  "color-text-link-weak": "rgb(157, 181, 255)",
  "color-text-decorative-20": "rgb(41, 82, 204)",
  "color-text-decorative-10": "rgb(105, 111, 140)",
  "color-text": "rgb(71, 77, 102)",
  "color-text-icon-busy": "rgb(222, 117, 72)",
  "color-text-weakest": "rgb(255, 255, 255)",
  "color-text-brand-highlight": "rgb(82, 189, 148)",
  "color-text-destructive-strong": "rgb(173, 17, 17)",
  "color-text-inverse-weaker": "rgb(96, 107, 133)",
  "color-text-primary-strong": "rgb(0, 20, 137)",
  "color-text-primary-weak": "rgb(153, 205, 255)",
  "color-text-destructive-weak": "rgb(246, 177, 177)",
  "color-text-inverse": "rgb(255, 255, 255)",
  "color-text-inverse-weakest": "rgb(75, 86, 113)",
  "color-text-weaker": "rgb(143, 149, 178)",
  "color-text-warning-strong": "rgb(133, 70, 43)",
  "color-text-icon-warning": "rgb(222, 117, 72)",
  "color-text-error-stronger": "rgb(49, 12, 12)",
  "color-text-link-destructive-strong": "rgb(125, 40, 40)",
  "z-index-0": "0",
  "z-index-90": "90",
  "z-index-80": "80",
  "z-index-70": "70",
  "z-index-60": "60",
  "z-index-50": "50",
  "z-index-40": "40",
  "z-index-30": "30",
  "z-index-20": "20",
  "z-index-10": "10",
  "color-scheme": "light"
}