UNPKG

@twilio-paste/design-tokens/dist/tokens.generic.d.ts

Version:
97.7 kBTypeScriptView Raw
1declare const Tokens: {
2"tokens":{"background-colors": [
  {
 type: "color";
 category: "background-color";
 value: "rgb(244, 244, 246)";
 comment: "Default background color for any container.";
 name: "color-background";
 altValue: "#F4F4F6";
10},
11{
 type: "color";
 category: "background-color";
 value: "rgb(20, 176, 83)";
 comment: "Background color used to represent an entity or person as \"available\".";
 name: "color-background-available";
 altValue: "#14B053";
18},
19{
 type: "color";
 category: "background-color";
 value: "rgb(255, 255, 255)";
 comment: "Background color used for the main page body.";
 name: "color-background-body";
 altValue: "#FFFFFF";
26},
27{
 type: "color";
 category: "background-color";
 value: "rgb(18, 28, 45)";
 comment: "Inverse background color used for the main page body.";
 name: "color-background-body-inverse";
 altValue: "#121C2D";
34},
35{
 type: "color";
 category: "background-color";
 value: "rgb(0, 20, 137)";
 comment: "Primary brand background, accessible with inverse text.";
 name: "color-background-brand";
 altValue: "#001489";
42},
43{
 type: "color";
 category: "background-color";
 value: "rgb(242, 190, 90)";
 comment: "Brand accent background color representing Twilio.";
 name: "color-background-brand-10";
 altValue: "#F2BE5A";
50},
51{
 type: "color";
 category: "background-color";
 value: "rgb(81, 169, 227)";
 comment: "Brand accent background color representing Sendgrid.";
 name: "color-background-brand-20";
 altValue: "#51A9E3";
58},
59{
 type: "color";
 category: "background-color";
 value: "rgb(106, 221, 178)";
 comment: "Brand accent background color representing Segment.";
 name: "color-background-brand-30";
 altValue: "#6ADDB2";
66},
67{
 type: "color";
 category: "background-color";
 value: "rgb(242, 47, 70)";
 comment: "Highlight brand background, accessible with black text.";
 name: "color-background-brand-highlight";
 altValue: "#F22F46";
74},
75{
 type: "color";
 category: "background-color";
 value: "rgba(242, 47, 70, 0.1)";
 comment: "Weakest background color used for brand highlights.";
 name: "color-background-brand-highlight-weakest";
 altValue: "#F22F461A";
82},
83{
 type: "color";
 category: "background-color";
 value: "rgb(3, 11, 93)";
 comment: "Strong primary brand background, accessible with inverse text.";
 name: "color-background-brand-strong";
 altValue: "#030B5D";
90},
91{
 type: "color";
 category: "background-color";
 value: "rgb(6, 3, 58)";
 comment: "Stronger primary brand background, accessible with inverse text.";
 name: "color-background-brand-stronger";
 altValue: "#06033A";
98},
99{
 type: "color";
 category: "background-color";
 value: "rgb(244, 124, 34)";
 comment: "Background color used to represent an entity or person as \"busy\".";
 name: "color-background-busy";
 altValue: "#F47C22";
106},
107{
 type: "color";
 category: "background-color";
 value: "rgb(244, 244, 246)";
 comment: "Weakest background color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative border and/or text tokens.";
 name: "color-background-decorative-10-weakest";
 altValue: "#F4F4F6";
114},
115{
 type: "color";
 category: "background-color";
 value: "rgb(235, 244, 255)";
 comment: "Weakest background color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative border and/or text tokens.";
 name: "color-background-decorative-20-weakest";
 altValue: "#EBF4FF";
122},
123{
 type: "color";
 category: "background-color";
 value: "rgb(237, 253, 243)";
 comment: "Weakest background color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative border and/or text tokens.";
 name: "color-background-decorative-30-weakest";
 altValue: "#EDFDF3";
130},
131{
 type: "color";
 category: "background-color";
 value: "rgb(245, 240, 252)";
 comment: "Weakest background color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative border and/or text tokens.";
 name: "color-background-decorative-40-weakest";
 altValue: "#F5F0FC";
138},
139{
 type: "color";
 category: "background-color";
 value: "rgb(214, 31, 31)";
 comment: "Background color used for destructive actions or highlights.";
 name: "color-background-destructive";
 altValue: "#D61F1F";
146},
147{
 type: "color";
 category: "background-color";
 value: "rgb(117, 12, 12)";
 comment: "Strong background color used for destructive actions or highlights.";
 name: "color-background-destructive-strong";
 altValue: "#750C0C";
154},
155{
 type: "color";
 category: "background-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger background color used for destructive actions or highlights.";
 name: "color-background-destructive-stronger";
 altValue: "#4A0B0B";
162},
163{
 type: "color";
 category: "background-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest background color used for destructive actions or highlights.";
 name: "color-background-destructive-strongest";
 altValue: "#310C0C";
170},
171{
 type: "color";
 category: "background-color";
 value: "rgb(246, 177, 177)";
 comment: "Weak background color used for destructive actions or highlights.";
 name: "color-background-destructive-weak";
 altValue: "#F6B1B1";
178},
179{
 type: "color";
 category: "background-color";
 value: "rgb(252, 207, 207)";
 comment: "Weaker background color used for destructive actions or highlights.";
 name: "color-background-destructive-weaker";
 altValue: "#FCCFCF";
186},
187{
 type: "color";
 category: "background-color";
 value: "rgb(254, 236, 236)";
 comment: "Weakest background color used for destructive actions or highlights.";
 name: "color-background-destructive-weakest";
 altValue: "#FEECEC";
194},
195{
 type: "color";
 category: "background-color";
 value: "rgb(214, 31, 31)";
 comment: "Background color used for error alerts and toasts.";
 name: "color-background-error";
 altValue: "#D61F1F";
202},
203{
 type: "color";
 category: "background-color";
 value: "rgb(117, 12, 12)";
 comment: "Strongest background color used for error alerts and toasts.";
 name: "color-background-error-strong";
 altValue: "#750C0C";
210},
211{
 type: "color";
 category: "background-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger error background color";
 name: "color-background-error-stronger";
 altValue: "#4A0B0B";
218},
219{
 type: "color";
 category: "background-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest error background color";
 name: "color-background-error-strongest";
 altValue: "#310C0C";
226},
227{
 type: "color";
 category: "background-color";
 value: "rgb(254, 236, 236)";
 comment: "Weakest background color used for error alerts and toasts.";
 name: "color-background-error-weakest";
 altValue: "#FEECEC";
234},
235{
 type: "color";
 category: "background-color";
 value: "rgb(31, 48, 76)";
 comment: "Inverse background color used for containers.";
 name: "color-background-inverse";
 altValue: "#1F304C";
242},
243{
 type: "color";
 category: "background-color";
 value: "rgb(57, 71, 98)";
 comment: "Strong inverse background color used for containers.";
 name: "color-background-inverse-strong";
 altValue: "#394762";
250},
251{
 type: "color";
 category: "background-color";
 value: "rgb(57, 71, 98)";
 comment: "Stronger inverse background color for any container. Must be used on color-background-body-inverse.";
 name: "color-background-inverse-stronger";
 altValue: "#394762";
258},
259{
 type: "color";
 category: "background-color";
 value: "rgb(255, 255, 255)";
 comment: "Strongest inverse background color used for containers.";
 name: "color-background-inverse-strongest";
 altValue: "#FFFFFF";
266},
267{
 type: "color";
 category: "background-color";
 value: "rgb(235, 244, 255)";
 comment: "Weakest background color used for neutral or default variants.";
 name: "color-background-neutral-weakest";
 altValue: "#EBF4FF";
274},
275{
 type: "color";
 category: "background-color";
 value: "rgb(245, 240, 252)";
 comment: "Background color used to represent a new status.";
 name: "color-background-new";
 altValue: "#F5F0FC";
282},
283{
 type: "color";
 category: "background-color";
 value: "rgb(250, 247, 253)";
 comment: "Weakest background color for indicating a new status.";
 name: "color-background-new-weakest";
 altValue: "#FAF7FD";
290},
291{
 type: "color";
 category: "background-color";
 value: "rgb(174, 178, 193)";
 comment: "Background color used to represent an entity or person as \"offline\".";
 name: "color-background-offline";
 altValue: "#AEB2C1";
298},
299{
 type: "color";
 category: "background-color";
 value: "rgba(6, 3, 58, 0.4)";
 comment: "Background color used for overlays.";
 name: "color-background-overlay";
 altValue: "#06033A66";
306},
307{
 type: "color";
 category: "background-color";
 value: "rgb(2, 99, 224)";
 comment: "Background color used for primary actions or highlights.";
 name: "color-background-primary";
 altValue: "#0263E0";
314},
315{
 type: "color";
 category: "background-color";
 value: "rgb(0, 20, 137)";
 comment: "Strong background color used for primary actions or highlights.";
 name: "color-background-primary-strong";
 altValue: "#001489";
322},
323{
 type: "color";
 category: "background-color";
 value: "rgb(3, 11, 93)";
 comment: "Stronger background color used for primary actions or highlights.";
 name: "color-background-primary-stronger";
 altValue: "#030B5D";
330},
331{
 type: "color";
 category: "background-color";
 value: "rgb(6, 3, 58)";
 comment: "Strongest background color used for primary actions or highlights.";
 name: "color-background-primary-strongest";
 altValue: "#06033A";
338},
339{
 type: "color";
 category: "background-color";
 value: "rgb(153, 205, 255)";
 comment: "Weak background color used for primary actions or highlights.";
 name: "color-background-primary-weak";
 altValue: "#99CDFF";
346},
347{
 type: "color";
 category: "background-color";
 value: "rgb(204, 228, 255)";
 comment: "Weaker background color used for primary actions or highlights.";
 name: "color-background-primary-weaker";
 altValue: "#CCE4FF";
354},
355{
 type: "color";
 category: "background-color";
 value: "rgb(235, 244, 255)";
 comment: "Weakest background color used for primary actions or highlights.";
 name: "color-background-primary-weakest";
 altValue: "#EBF4FF";
362},
363{
 type: "color";
 category: "background-color";
 value: "rgb(235, 86, 86)";
 comment: "Background color used to represent required form fields.";
 name: "color-background-required";
 altValue: "#EB5656";
370},
371{
 type: "color";
 category: "background-color";
 value: "rgb(244, 244, 246)";
 comment: "Background color used for alternative striped rows.";
 name: "color-background-row-striped";
 altValue: "#F4F4F6";
378},
379{
 type: "color";
 category: "background-color";
 value: "rgb(225, 227, 234)";
 comment: "Strong background color used for containers.";
 name: "color-background-strong";
 altValue: "#E1E3EA";
386},
387{
 type: "color";
 category: "background-color";
 value: "rgb(136, 145, 170)";
 comment: "Stronger background color used for containers.";
 name: "color-background-stronger";
 altValue: "#8891AA";
394},
395{
 type: "color";
 category: "background-color";
 value: "rgb(75, 86, 113)";
 comment: "Strongest background color used for containers.";
 name: "color-background-strongest";
 altValue: "#4B5671";
402},
403{
 type: "color";
 category: "background-color";
 value: "rgb(255, 251, 234)";
 comment: "Background color used for subaccounts.";
 name: "color-background-subaccount";
 altValue: "#FFFBEA";
410},
411{
 type: "color";
 category: "background-color";
 value: "rgb(20, 176, 83)";
 comment: "Background color used for success alerts and toasts.";
 name: "color-background-success";
 altValue: "#14B053";
418},
419{
 type: "color";
 category: "background-color";
 value: "rgb(237, 253, 243)";
 comment: "Weakest background color used for success alerts and toasts.";
 name: "color-background-success-weakest";
 altValue: "#EDFDF3";
426},
427{
 type: "color";
 category: "background-color";
 value: "rgb(209, 250, 224)";
 comment: "Background color used for trial accounts.";
 name: "color-background-trial";
 altValue: "#D1FAE0";
434},
435{
 type: "color";
 category: "background-color";
 value: "rgb(214, 31, 31)";
 comment: "Background color used to represent an entity or person as \"unavailable\".";
 name: "color-background-unavailable";
 altValue: "#D61F1F";
442},
443{
 type: "color";
 category: "background-color";
 value: "rgb(200, 175, 240)";
 comment: "Background color used for user avatars.";
 name: "color-background-user";
 altValue: "#C8AFF0";
450},
451{
 type: "color";
 category: "background-color";
 value: "rgb(244, 124, 34)";
 comment: "Background color used for warning alerts and toasts.";
 name: "color-background-warning";
 altValue: "#F47C22";
458},
459{
 type: "color";
 category: "background-color";
 value: "rgb(254, 245, 238)";
 comment: "Weakest background color used for warning alerts and toasts.";
 name: "color-background-warning-weakest";
 altValue: "#FEF5EE";
466},
467{
 type: "color";
 category: "background-color";
 value: "rgb(249, 249, 250)";
 comment: "Weak background color used for containers.";
 name: "color-background-weak";
 altValue: "#F9F9FA";
474}
475]
476"border-colors": [
  {
 type: "color";
 category: "border-color";
 value: "rgb(136, 145, 170)";
 comment: "Default border color";
 uicontrol_contrast_pairing: ["color-background-body"];
 name: "color-border";
 altValue: "#8891AA";
485},
486{
 type: "color";
 category: "border-color";
 value: "rgb(225, 227, 234)";
 comment: "Weaker border color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or text tokens.";
 name: "color-border-decorative-10-weaker";
 altValue: "#E1E3EA";
493},
494{
 type: "color";
 category: "border-color";
 value: "rgb(204, 228, 255)";
 comment: "Weaker border color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or text tokens.";
 name: "color-border-decorative-20-weaker";
 altValue: "#CCE4FF";
501},
502{
 type: "color";
 category: "border-color";
 value: "rgb(209, 250, 224)";
 comment: "Weaker border color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or text tokens.";
 name: "color-border-decorative-30-weaker";
 altValue: "#D1FAE0";
509},
510{
 type: "color";
 category: "border-color";
 value: "rgb(231, 220, 250)";
 comment: "Weaker border color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or text tokens.";
 name: "color-border-decorative-40-weaker";
 altValue: "#E7DCFA";
517},
518{
 type: "color";
 category: "border-color";
 value: "rgb(214, 31, 31)";
 comment: "Destructive border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-border-destructive";
 altValue: "#D61F1F";
526},
527{
 type: "color";
 category: "border-color";
 value: "rgb(117, 12, 12)";
 comment: "Destructive focus border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weak","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weak","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-border-destructive-strong";
 altValue: "#750C0C";
535},
536{
 type: "color";
 category: "border-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger destructive hover border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weak","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weak","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-border-destructive-stronger";
 altValue: "#4A0B0B";
544},
545{
 type: "color";
 category: "border-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest destructive hover border color";
 name: "color-border-destructive-strongest";
 altValue: "#310C0C";
552},
553{
 type: "color";
 category: "border-color";
 value: "rgb(246, 177, 177)";
 comment: "Destructive focus border color";
 name: "color-border-destructive-weak";
 altValue: "#F6B1B1";
560},
561{
 type: "color";
 category: "border-color";
 value: "rgb(252, 207, 207)";
 comment: "Destructive focus border color";
 name: "color-border-destructive-weaker";
 altValue: "#FCCFCF";
568},
569{
 type: "color";
 category: "border-color";
 value: "rgb(254, 236, 236)";
 comment: "Destructive focus border color";
 name: "color-border-destructive-weakest";
 altValue: "#FEECEC";
576},
577{
 type: "color";
 category: "border-color";
 value: "rgb(214, 31, 31)";
 comment: "Error border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-border-error";
 altValue: "#D61F1F";
585},
586{
 type: "color";
 category: "border-color";
 value: "rgb(117, 12, 12)";
 comment: "Strong error border color";
 name: "color-border-error-strong";
 altValue: "#750C0C";
593},
594{
 type: "color";
 category: "border-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger error border color";
 name: "color-border-error-stronger";
 altValue: "#4A0B0B";
601},
602{
 type: "color";
 category: "border-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest error border color";
 name: "color-border-error-strongest";
 altValue: "#310C0C";
609},
610{
 type: "color";
 category: "border-color";
 value: "rgb(245, 138, 138)";
 comment: "Weak error border color";
 name: "color-border-error-weak";
 altValue: "#F58A8A";
617},
618{
 type: "color";
 category: "border-color";
 value: "rgb(252, 207, 207)";
 comment: "Weaker error border color";
 name: "color-border-error-weaker";
 altValue: "#FCCFCF";
625},
626{
 type: "color";
 category: "border-color";
 value: "rgb(254, 236, 236)";
 comment: "Weakest error border color";
 name: "color-border-error-weakest";
 altValue: "#FEECEC";
633},
634{
 type: "color";
 category: "border-color";
 value: "rgb(136, 145, 170)";
 comment: "Border on inverse backgrounds. Must be used on color-background-body-inverse.";
 uicontrol_contrast_pairing: ["color-background-body-inverse"];
 name: "color-border-inverse";
 altValue: "#8891AA";
642},
643{
 type: "color";
 category: "border-color";
 value: "rgb(225, 227, 234)";
 comment: "Strong border on inverse backgrounds. Must be used on color-background-body-inverse.";
 uicontrol_contrast_pairing: ["color-background-body-inverse"];
 name: "color-border-inverse-strong";
 altValue: "#E1E3EA";
651},
652{
 type: "color";
 category: "border-color";
 value: "rgb(244, 244, 246)";
 comment: "Stronger border on inverse backgrounds. Must be used on color-background-body-inverse.";
 uicontrol_contrast_pairing: ["color-background-body-inverse"];
 name: "color-border-inverse-stronger";
 altValue: "#F4F4F6";
660},
661{
 type: "color";
 category: "border-color";
 value: "rgb(255, 255, 255)";
 comment: "Strongest border on inverse backgrounds. Must be used on color-background-body-inverse.";
 uicontrol_contrast_pairing: ["color-background-body-inverse"];
 name: "color-border-inverse-strongest";
 altValue: "#FFFFFF";
669},
670{
 type: "color";
 category: "border-color";
 value: "rgb(57, 71, 98)";
 comment: "Weaker border on inverse backgrounds. Must be used on color-background-body-inverse.";
 name: "color-border-inverse-weaker";
 altValue: "#394762";
677},
678{
 type: "color";
 category: "border-color";
 value: "rgb(31, 48, 76)";
 comment: "Weakest border on inverse backgrounds. Must be used on color-background-body-inverse.";
 name: "color-border-inverse-weakest";
 altValue: "#1F304C";
685},
686{
 type: "color";
 category: "border-color";
 value: "rgb(2, 99, 224)";
 comment: "Neutral border color";
 name: "color-border-neutral";
 altValue: "#0263E0";
693},
694{
 type: "color";
 category: "border-color";
 value: "rgb(102, 179, 255)";
 comment: "Weak neutral border color";
 name: "color-border-neutral-weak";
 altValue: "#66B3FF";
701},
702{
 type: "color";
 category: "border-color";
 value: "rgb(204, 228, 255)";
 comment: "Weaker neutral border color";
 name: "color-border-neutral-weaker";
 altValue: "#CCE4FF";
709},
710{
 type: "color";
 category: "border-color";
 value: "rgb(231, 220, 250)";
 comment: "Weaker border color for something designated as new";
 name: "color-border-new-weaker";
 altValue: "#E7DCFA";
717},
718{
 type: "color";
 category: "border-color";
 value: "rgb(2, 99, 224)";
 comment: "Primary border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-border-primary";
 altValue: "#0263E0";
726},
727{
 type: "color";
 category: "border-color";
 value: "rgb(0, 20, 137)";
 comment: "Strong primary border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weak","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weak","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-border-primary-strong";
 altValue: "#001489";
735},
736{
 type: "color";
 category: "border-color";
 value: "rgb(3, 11, 93)";
 comment: "Stronger primary border color";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weak","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weak","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-border-primary-stronger";
 altValue: "#030B5D";
744},
745{
 type: "color";
 category: "border-color";
 value: "rgb(6, 3, 58)";
 comment: "Strongest primary border color";
 name: "color-border-primary-strongest";
 altValue: "#06033A";
752},
753{
 type: "color";
 category: "border-color";
 value: "rgb(153, 205, 255)";
 comment: "Weak primary border color";
 name: "color-border-primary-weak";
 altValue: "#99CDFF";
760},
761{
 type: "color";
 category: "border-color";
 value: "rgb(204, 228, 255)";
 comment: "Weaker primary border color";
 name: "color-border-primary-weaker";
 altValue: "#CCE4FF";
768},
769{
 type: "color";
 category: "border-color";
 value: "rgb(235, 244, 255)";
 comment: "Weakest primary border color";
 name: "color-border-primary-weakest";
 altValue: "#EBF4FF";
776},
777{
 type: "color";
 category: "border-color";
 value: "rgb(96, 107, 133)";
 comment: "Strong border color";
 uicontrol_contrast_pairing: ["color-background","color-background-strong","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-border-strong";
 altValue: "#606B85";
785},
786{
 type: "color";
 category: "border-color";
 value: "rgb(20, 176, 83)";
 comment: "Success border color";
 name: "color-border-success";
 altValue: "#14B053";
793},
794{
 type: "color";
 category: "border-color";
 value: "rgb(54, 213, 118)";
 comment: "Weak success border color";
 name: "color-border-success-weak";
 altValue: "#36D576";
801},
802{
 type: "color";
 category: "border-color";
 value: "rgb(209, 250, 224)";
 comment: "Weaker success border color";
 name: "color-border-success-weaker";
 altValue: "#D1FAE0";
809},
810{
 type: "color";
 category: "border-color";
 value: "rgb(237, 253, 243)";
 comment: "Weakest success border color";
 name: "color-border-success-weakest";
 altValue: "#EDFDF3";
817},
818{
 type: "color";
 category: "border-color";
 value: "rgb(231, 220, 250)";
 comment: "User avatar border color.";
 name: "color-border-user";
 altValue: "#E7DCFA";
825},
826{
 type: "color";
 category: "border-color";
 value: "rgb(244, 124, 34)";
 comment: "Warning border color";
 name: "color-border-warning";
 altValue: "#F47C22";
833},
834{
 type: "color";
 category: "border-color";
 value: "rgb(255, 179, 122)";
 comment: "Weak warning border color";
 name: "color-border-warning-weak";
 altValue: "#FFB37A";
841},
842{
 type: "color";
 category: "border-color";
 value: "rgb(253, 220, 196)";
 comment: "Weaker warning border color";
 name: "color-border-warning-weaker";
 altValue: "#FDDCC4";
849},
850{
 type: "color";
 category: "border-color";
 value: "rgb(254, 245, 238)";
 comment: "Weakest warning border color";
 name: "color-border-warning-weakest";
 altValue: "#FEF5EE";
857},
858{
 type: "color";
 category: "border-color";
 value: "rgb(202, 205, 216)";
 comment: "Weak border color";
 name: "color-border-weak";
 altValue: "#CACDD8";
865},
866{
 type: "color";
 category: "border-color";
 value: "rgb(225, 227, 234)";
 comment: "Weaker border color";
 name: "color-border-weaker";
 altValue: "#E1E3EA";
873},
874{
 type: "color";
 category: "border-color";
 value: "rgb(255, 255, 255)";
 comment: "Weakest border color";
 name: "color-border-weakest";
 altValue: "#FFFFFF";
881}
882]
883"border-widths": [
  {
 type: "size";
 category: "border-width";
 value: 0;
 comment: "Border width reset";
 name: "border-width-0";
 altValue: null;
891},
892{
 type: "size";
 category: "border-width";
 value: "1px";
 comment: "Constant border width token for border width 10";
 name: "border-width-10";
 altValue: null;
899},
900{
 type: "size";
 category: "border-width";
 value: "2px";
 comment: "Constant border width token for border width 20";
 name: "border-width-20";
 altValue: null;
907},
908{
 type: "size";
 category: "border-width";
 value: "4px";
 comment: "Constant border width token for border width 30";
 name: "border-width-30";
 altValue: null;
915},
916{
 type: "size";
 category: "border-width";
 value: "8px";
 comment: "Constant border width token for border width 40";
 name: "border-width-40";
 altValue: null;
923}
924]
925"box-shadows": [
  {
 type: "shadow";
 category: "box-shadow";
 value: "0 4px 16px 0 rgba(18, 28, 45, 0.2)";
 comment: "Default shadow.";
 name: "shadow";
 altValue: null;
933},
934{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #8891aa";
 comment: "Shadow border for inputs.";
 name: "shadow-border";
 altValue: null;
941},
942{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #855c15";
 comment: "Strong bottom shadow border for brand 10";
 name: "shadow-border-bottom-brand-10-strong";
 altValue: null;
949},
950{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #043cb5";
 comment: "Strong bottom shadow border for brand 20";
 name: "shadow-border-bottom-brand-20-strong";
 altValue: null;
957},
958{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #0e7c3a";
 comment: "Strong bottom shadow border for brand 30";
 name: "shadow-border-bottom-brand-30-strong";
 altValue: null;
965},
966{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #e1e3ea";
 comment: "Weaker bottom shadow border for decorative 10";
 name: "shadow-border-bottom-decorative-10-weaker";
 altValue: null;
973},
974{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #cce4ff";
 comment: "Weaker bottom shadow border for decorative 20";
 name: "shadow-border-bottom-decorative-20-weaker";
 altValue: null;
981},
982{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #d1fae0";
 comment: "Weaker bottom shadow border for decorative 30";
 name: "shadow-border-bottom-decorative-30-weaker";
 altValue: null;
989},
990{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #e7dcfa";
 comment: "Weaker bottom shadow border for decorative 40";
 name: "shadow-border-bottom-decorative-40-weaker";
 altValue: null;
997},
998{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #fccfcf";
 comment: "Weaker bottom shadow border for error status";
 name: "shadow-border-bottom-error-weaker";
 altValue: null;
1005},
1006{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #5817bd";
 comment: "Bottom shadow border for the sidebar beta badge";
 name: "shadow-border-bottom-inverse-new-weaker";
 altValue: null;
1013},
1014{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #cce4ff";
 comment: "Weaker bottom shadow border for neutral status";
 name: "shadow-border-bottom-neutral-weaker";
 altValue: null;
1021},
1022{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #e7dcfa";
 comment: "Weaker bottom shadow border for new status";
 name: "shadow-border-bottom-new-weaker";
 altValue: null;
1029},
1030{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #006dfa";
 comment: "Bottom shadow border for primary status";
 name: "shadow-border-bottom-primary";
 altValue: null;
1037},
1038{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #ffdd35";
 comment: "Bottom shadow border for subaccount badge";
 name: "shadow-border-bottom-subaccount";
 altValue: null;
1045},
1046{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #d1fae0";
 comment: "Weaker bottom shadow border for success status";
 name: "shadow-border-bottom-success-weaker";
 altValue: null;
1053},
1054{
 type: "shadow";
 category: "box-shadow";
 value: "0 1px 0 #fddcc4";
 comment: "Weaker bottom shadow border for warning status";
 name: "shadow-border-bottom-warning-weaker";
 altValue: null;
1061},
1062{
 type: "shadow";
 category: "box-shadow";
 value: "saffron";
 comment: "Shadow border for brand 10";
 name: "shadow-border-brand-10";
 altValue: null;
1069},
1070{
 type: "shadow";
 category: "box-shadow";
 value: "sky";
 comment: "Shadow border for brand 20";
 name: "shadow-border-brand-20";
 altValue: null;
1077},
1078{
 type: "shadow";
 category: "box-shadow";
 value: "mint";
 comment: "Shadow border for brand 30";
 name: "shadow-border-brand-30";
 altValue: null;
1085},
1086{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #e1e3ea";
 comment: "Weaker shadow border for decorative 10";
 name: "shadow-border-decorative-10-weaker";
 altValue: null;
1093},
1094{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #cce4ff";
 comment: "Weaker shadow border for decorative 20";
 name: "shadow-border-decorative-20-weaker";
 altValue: null;
1101},
1102{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #d1fae0";
 comment: "Weaker shadow border for decorative 30";
 name: "shadow-border-decorative-30-weaker";
 altValue: null;
1109},
1110{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #e7dcfa";
 comment: "Weaker shadow border for decorative 40";
 name: "shadow-border-decorative-40-weaker";
 altValue: null;
1117},
1118{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #d61f1f";
 comment: "Shadow border for destructive interactions.";
 name: "shadow-border-destructive";
 altValue: null;
1125},
1126{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #750c0c";
 comment: "Strong shadow border for destructive interactions";
 name: "shadow-border-destructive-strong";
 altValue: null;
1133},
1134{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #4a0b0b";
 comment: "Strong shadow border for destructive interactions";
 name: "shadow-border-destructive-stronger";
 altValue: null;
1141},
1142{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #310c0c";
 comment: "Strongest shadow border for destructive interactions";
 name: "shadow-border-destructive-strongest";
 altValue: null;
1149},
1150{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #f6b1b1";
 comment: "Weak shadow border for destructive interactions.";
 name: "shadow-border-destructive-weak";
 altValue: null;
1157},
1158{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #fccfcf";
 comment: "Weaker shadow border for destructive interactions.";
 name: "shadow-border-destructive-weaker";
 altValue: null;
1165},
1166{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #d61f1f";
 comment: "Shadow border for error inputs.";
 name: "shadow-border-error";
 altValue: null;
1173},
1174{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #750c0c";
 comment: "Shadow border for error inputs hover.";
 name: "shadow-border-error-strong";
 altValue: null;
1181},
1182{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #4a0b0b";
 comment: "Shadow border for error inputs hover.";
 name: "shadow-border-error-stronger";
 altValue: null;
1189},
1190{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #310c0c";
 comment: "Strongest shadow border for error inputs hover.";
 name: "shadow-border-error-strongest";
 altValue: null;
1197},
1198{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #eb5656";
 comment: "Shadow border for inverse error inputs.";
 name: "shadow-border-error-weak";
 altValue: null;
1205},
1206{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #fccfcf";
 comment: "Weaker shadow border for error inputs.";
 name: "shadow-border-error-weaker";
 altValue: null;
1213},
1214{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #8891aa";
 comment: "Shadow border on interactive elements on inverse backgrounds.";
 name: "shadow-border-inverse";
 altValue: null;
1221},
1222{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #5817bd";
 comment: "Shadow border for the sidebar beta badge.";
 name: "shadow-border-inverse-new-weaker";
 altValue: null;
1229},
1230{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #e1e3ea";
 comment: "Strong shadow border on interactive elements on inverse backgrounds.";
 name: "shadow-border-inverse-strong";
 altValue: null;
1237},
1238{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #f4f4f6";
 comment: "Stronger shadow border on interactive elements on inverse backgrounds.";
 name: "shadow-border-inverse-stronger";
 altValue: null;
1245},
1246{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #ffffff";
 comment: "Strongest shadow border on interactive elements on inverse backgrounds.";
 name: "shadow-border-inverse-strongest";
 altValue: null;
1253},
1254{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #394762";
 comment: "Weaker shadow border on interactive elements on inverse backgrounds.";
 name: "shadow-border-inverse-weaker";
 altValue: null;
1261},
1262{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #1f304c";
 comment: "Weakest shadow border on interactive elements on inverse backgrounds.";
 name: "shadow-border-inverse-weakest";
 altValue: null;
1269},
1270{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #cce4ff";
 comment: "Weaker shadow border for neutral inputs.";
 name: "shadow-border-neutral-weaker";
 altValue: null;
1277},
1278{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #e7dcfa";
 comment: "Weaker shadow border for new status inputs.";
 name: "shadow-border-new-weaker";
 altValue: null;
1285},
1286{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #0263e0";
 comment: "Default shadow border for primary interactions.";
 name: "shadow-border-primary";
 altValue: null;
1293},
1294{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #001489";
 comment: "Strong shadow border for inputs hover.";
 name: "shadow-border-primary-strong";
 altValue: null;
1301},
1302{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #030b5d";
 comment: "Stronger shadow border for inputs active.";
 name: "shadow-border-primary-stronger";
 altValue: null;
1309},
1310{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #06033a";
 comment: "Strongest shadow border for inputs active.";
 name: "shadow-border-primary-strongest";
 altValue: null;
1317},
1318{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #99cdff";
 comment: "Weaker shadow border for primary interactions.";
 name: "shadow-border-primary-weak";
 altValue: null;
1325},
1326{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #cce4ff";
 comment: "Weaker shadow border for primary interactions.";
 name: "shadow-border-primary-weaker";
 altValue: null;
1333},
1334{
 type: "shadow";
 category: "box-shadow";
 value: "1px 0px #e1e3ea";
 comment: "Right shadow border for hover status of vertical tabs on inverse backgrounds";
 name: "shadow-border-right-inverse-strong";
 altValue: null;
1341},
1342{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #606b85";
 comment: "Strong shadow border for inputs.";
 name: "shadow-border-strong";
 altValue: null;
1349},
1350{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #fff1b3";
 comment: "Shadow border for subaccount badge.";
 name: "shadow-border-subaccount";
 altValue: null;
1357},
1358{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #d1fae0";
 comment: "Weaker shadow border for success inputs.";
 name: "shadow-border-success-weaker";
 altValue: null;
1365},
1366{
 type: "shadow";
 category: "box-shadow";
 value: "0px -1px 0 #cce4ff";
 comment: "Top shadow border for for selected status of horizontal tabs on inverse backgrounds";
 name: "shadow-border-top-inverse-strongest";
 altValue: null;
1373},
1374{
 type: "shadow";
 category: "box-shadow";
 value: "0px -1px 0 #006dfa";
 comment: "Top shadow border for selected status of horizontal tabs";
 name: "shadow-border-top-primary";
 altValue: null;
1381},
1382{
 type: "shadow";
 category: "box-shadow";
 value: "0px -1px 0 #030b5d";
 comment: "Top shadow border for selected hover status of horizontal tabs";
 name: "shadow-border-top-primary-strongest";
 altValue: null;
1389},
1390{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #8c5bd8";
 comment: "Shadow border for user.";
 name: "shadow-border-user";
 altValue: null;
1397},
1398{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #fddcc4";
 comment: "Weaker shadow border for warning inputs.";
 name: "shadow-border-warning-weaker";
 altValue: null;
1405},
1406{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #cacdd8";
 comment: "Weak shadow border for disabled inputs.";
 name: "shadow-border-weak";
 altValue: null;
1413},
1414{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 1px #e1e3ea";
 comment: "Weaker shadow border for disabled inputs.";
 name: "shadow-border-weaker";
 altValue: null;
1421},
1422{
 type: "shadow";
 category: "box-shadow";
 value: "0 2px 8px 0 rgba(18, 28, 45, 0.1)";
 comment: "Shadow for cards.";
 name: "shadow-card";
 altValue: null;
1429},
1430{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 4px rgba(2, 99, 224, 0.7)";
 comment: "Shadow for focus ring on interactive elements.";
 name: "shadow-focus";
 altValue: null;
1437},
1438{
 type: "shadow";
 category: "box-shadow";
 value: "inset 0 0 0 2px rgba(2, 99, 224, 0.7)";
 comment: "Shadow for inset focus on elements, such as DataGrid cells.";
 name: "shadow-focus-inset";
 altValue: null;
1445},
1446{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 4px rgba(255, 255, 255, 0.4)";
 comment: "Shadow for focus ring on interactive elements on inverse backgrounds.";
 name: "shadow-focus-inverse";
 altValue: null;
1453},
1454{
 type: "shadow";
 category: "box-shadow";
 value: "inset 0 0 0 2px rgba(255, 255, 255, 0.4)";
 comment: "Shadow for inset focus ring on interactive elements on inverse backgrounds.";
 name: "shadow-focus-inverse-inset";
 altValue: null;
1461},
1462{
 type: "shadow";
 category: "box-shadow";
 value: "0 0 0 4px rgba(2, 99, 224, 0.7), 0 0 0 1px #8891aa";
 comment: "Shadow for simultaneous focus and border.";
 name: "shadow-focus-shadow-border";
 altValue: null;
1469},
1470{
 type: "shadow";
 category: "box-shadow";
 value: "0 16px 24px 0 rgba(18, 28, 45, 0.2)";
 comment: "High elevation default shadow.";
 name: "shadow-high";
 altValue: null;
1477},
1478{
 type: "shadow";
 category: "box-shadow";
 value: "0 2px 8px 0 rgba(18, 28, 45, 0.1)";
 comment: "Low elevation default shadow.";
 name: "shadow-low";
 altValue: null;
1485}
1486]
1487"colors": [
  {
 type: "color";
 category: "color";
 value: "rgb(0, 20, 137)";
 comment: "Default branding color";
 name: "color-brand";
 altValue: null;
1495},
1496{
 type: "color";
 category: "color";
 value: "rgb(242, 47, 70)";
 comment: "Twilio brand red";
 name: "color-brand-highlight";
 altValue: null;
1503},
1504{
 type: "color";
 category: "color";
 value: "rgb(255, 255, 255)";
 comment: "Gray Color 0";
 name: "color-gray-0";
 altValue: null;
1511},
1512{
 type: "color";
 category: "color";
 value: "rgb(244, 244, 246)";
 comment: "Gray Color 1";
 name: "color-gray-10";
 altValue: null;
1519},
1520{
 type: "color";
 category: "color";
 value: "rgb(225, 227, 234)";
 comment: "Gray Color 2";
 name: "color-gray-20";
 altValue: null;
1527},
1528{
 type: "color";
 category: "color";
 value: "rgb(202, 205, 216)";
 comment: "Gray Color 3";
 name: "color-gray-30";
 altValue: null;
1535},
1536{
 type: "color";
 category: "color";
 value: "rgb(174, 178, 193)";
 comment: "Gray Color 4";
 name: "color-gray-40";
 altValue: null;
1543},
1544{
 type: "color";
 category: "color";
 value: "rgb(136, 145, 170)";
 comment: "Gray Color 5";
 name: "color-gray-50";
 altValue: null;
1551},
1552{
 type: "color";
 category: "color";
 value: "rgb(96, 107, 133)";
 comment: "Gray Color 6";
 name: "color-gray-60";
 altValue: null;
1559},
1560{
 type: "color";
 category: "color";
 value: "rgb(75, 86, 113)";
 comment: "Gray Color 7";
 name: "color-gray-70";
 altValue: null;
1567},
1568{
 type: "color";
 category: "color";
 value: "rgb(57, 71, 98)";
 comment: "Gray Color 8";
 name: "color-gray-80";
 altValue: null;
1575},
1576{
 type: "color";
 category: "color";
 value: "rgb(31, 48, 76)";
 comment: "Gray Color 9";
 name: "color-gray-90";
 altValue: null;
1583},
1584{
 type: "color";
 category: "color";
 value: "rgb(18, 28, 45)";
 comment: "Gray Color 10";
 name: "color-gray-100";
 altValue: null;
1591}
1592]
1593"color-schemes": [
  {
 type: "string";
 category: "color-scheme";
 value: "light";
 name: "color-scheme";
 altValue: null;
1600}
1601]
1602"data-visualization": [
  {
 type: "color";
 category: "data-visualization";
 value: "rgb(0, 20, 137)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-10","color-data-visualization-2"];
 name: "color-data-visualization-1";
 altValue: null;
1612},
1613{
 type: "color";
 category: "data-visualization";
 value: "rgb(14, 124, 58)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-1","color-data-visualization-3"];
 name: "color-data-visualization-2";
 altValue: null;
1622},
1623{
 type: "color";
 category: "data-visualization";
 value: "rgb(13, 58, 31)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-2","color-data-visualization-4"];
 name: "color-data-visualization-3";
 altValue: null;
1632},
1633{
 type: "color";
 category: "data-visualization";
 value: "rgb(0, 140, 255)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-3","color-data-visualization-5"];
 name: "color-data-visualization-4";
 altValue: null;
1642},
1643{
 type: "color";
 category: "data-visualization";
 value: "rgb(57, 71, 98)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-4","color-data-visualization-6"];
 name: "color-data-visualization-5";
 altValue: null;
1652},
1653{
 type: "color";
 category: "data-visualization";
 value: "rgb(166, 127, 227)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-5","color-data-visualization-7"];
 name: "color-data-visualization-6";
 altValue: null;
1662},
1663{
 type: "color";
 category: "data-visualization";
 value: "rgb(109, 46, 209)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-6","color-data-visualization-8"];
 name: "color-data-visualization-7";
 altValue: null;
1672},
1673{
 type: "color";
 category: "data-visualization";
 value: "rgb(136, 145, 170)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-7","color-data-visualization-9"];
 name: "color-data-visualization-8";
 altValue: null;
1682},
1683{
 type: "color";
 category: "data-visualization";
 value: "rgb(117, 12, 12)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-8","color-data-visualization-10"];
 name: "color-data-visualization-9";
 altValue: null;
1692},
1693{
 type: "color";
 category: "data-visualization";
 value: "rgb(235, 86, 86)";
 comment: "Color used for data visualizations. Must be used in a sequence.";
 uicontrol_contrast_pairing: ["color-background-body"];
 data_visualization_contrast_pairing: ["color-data-visualization-9","color-data-visualization-1"];
 name: "color-data-visualization-10";
 altValue: null;
1702}
1703]
1704"fonts": [
  {
 category: "font";
 type: "font";
 value: "'TwilioSansMono', Courier, monospace";
 name: "font-family-code";
 altValue: null;
1711},
1712{
 category: "font";
 type: "font";
 value: "'Inter var experimental', 'Inter var', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif";
 name: "font-family-display";
 altValue: null;
1718},
1719{
 category: "font";
 type: "font";
 value: "'Inter var experimental', 'Inter var', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif";
 name: "font-family-text";
 altValue: null;
1725},
1726{
 category: "font";
 type: "font";
 value: "'Inter var experimental', 'Inter var', 'Microsoft YaHei New', 微软雅黑, 'Microsoft Yahei', 'Microsoft JhengHei', 宋体, SimSun, sans-serif";
 name: "font-family-text-chinese-simplified";
 altValue: null;
1732},
1733{
 category: "font";
 type: "font";
 value: "'Inter var experimental', 'Inter var', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, sans-serif";
 name: "font-family-text-chinese-traditional";
 altValue: null;
1739},
1740{
 category: "font";
 type: "font";
 value: "'Inter var experimental', 'Inter var', Hiragino Sans, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, Osaka, 'MS PGothic', sans-serif";
 name: "font-family-text-japanese";
 altValue: null;
1746},
1747{
 category: "font";
 type: "font";
 value: "'Inter var experimental', 'Inter var', 'Microsoft JhengHei', 微軟正黑體, 'Microsoft JhengHei UI', 'Microsoft YaHei', 微軟雅黑, 宋体, SimSun, sans-serif";
 name: "font-family-text-korean";
 altValue: null;
1753}
1754]
1755"font-sizes": [
  {
 category: "font-size";
 type: "font-size";
 value: "0.625rem";
 comment: "Constant typography token for font size 10";
 name: "font-size-10";
 altValue: "10px";
1763},
1764{
 category: "font-size";
 type: "font-size";
 value: "0.75rem";
 comment: "Constant typography token for font size 20";
 name: "font-size-20";
 altValue: "12px";
1771},
1772{
 category: "font-size";
 type: "font-size";
 value: "0.875rem";
 comment: "Constant typography token for font size 30";
 name: "font-size-30";
 altValue: "14px";
1779},
1780{
 category: "font-size";
 type: "font-size";
 value: "1rem";
 comment: "Constant typography token for font size 40";
 name: "font-size-40";
 altValue: "16px";
1787},
1788{
 category: "font-size";
 type: "font-size";
 value: "1.125rem";
 comment: "Constant typography token for font size 50";
 name: "font-size-50";
 altValue: "18px";
1795},
1796{
 category: "font-size";
 type: "font-size";
 value: "1.25rem";
 comment: "Constant typography token for font size 60";
 name: "font-size-60";
 altValue: "20px";
1803},
1804{
 category: "font-size";
 type: "font-size";
 value: "1.5rem";
 comment: "Constant typography token for font size 70";
 name: "font-size-70";
 altValue: "24px";
1811},
1812{
 category: "font-size";
 type: "font-size";
 value: "1.75rem";
 comment: "Constant typography token for font size 80";
 name: "font-size-80";
 altValue: "28px";
1819},
1820{
 category: "font-size";
 type: "font-size";
 value: "2rem";
 comment: "Constant typography token for font size 90";
 name: "font-size-90";
 altValue: "32px";
1827},
1828{
 category: "font-size";
 type: "font-size";
 value: "2.5rem";
 comment: "Constant typography token for font size 100";
 name: "font-size-100";
 altValue: "40px";
1835},
1836{
 category: "font-size";
 type: "font-size";
 value: "3rem";
 comment: "Constant typography token for font size 110";
 name: "font-size-110";
 altValue: "48px";
1843},
1844{
 category: "font-size";
 type: "font-size";
 value: "100%";
 comment: "Base font size applied to the html element, used for rem calculations";
 name: "font-size-base";
 altValue: "1600px";
1851},
1852{
 category: "font-size";
 type: "font-size";
 value: "2rem";
 comment: "Constant typography token for font size display 10";
 name: "font-size-display-10";
 altValue: "32px";
1859},
1860{
 category: "font-size";
 type: "font-size";
 value: "3rem";
 comment: "Constant typography token for font size display 20";
 name: "font-size-display-20";
 altValue: "48px";
1867},
1868{
 category: "font-size";
 type: "font-size";
 value: "4rem";
 comment: "Constant typography token for font size display 30";
 name: "font-size-display-30";
 altValue: "64px";
1875}
1876]
1877"font-weights": [
  {
 category: "font-weight";
 type: "font-weight";
 value: 400;
 comment: "Font weight for light weight";
 name: "font-weight-light";
 altValue: null;
1885},
1886{
 category: "font-weight";
 type: "font-weight";
 value: 400;
 comment: "Font weight for normal weight";
 name: "font-weight-normal";
 altValue: null;
1893},
1894{
 category: "font-weight";
 type: "font-weight";
 value: 500;
 comment: "Font weight for medium weight";
 name: "font-weight-medium";
 altValue: null;
1901},
1902{
 category: "font-weight";
 type: "font-weight";
 value: 600;
 comment: "Font weight for semibold weight";
 name: "font-weight-semibold";
 altValue: null;
1909},
1910{
 category: "font-weight";
 type: "font-weight";
 value: 700;
 comment: "Font weight for bold weight";
 name: "font-weight-bold";
 altValue: null;
1917},
1918{
 category: "font-weight";
 type: "font-weight";
 value: 800;
 comment: "Font weight for extrabold weight";
 name: "font-weight-extrabold";
 altValue: null;
1925}
1926]
1927"line-heights": [
  {
 category: "line-height";
 type: "number";
 value: 0;
 comment: "Constant line-height token for line-height 0";
 name: "line-height-0";
 altValue: "0px";
1935},
1936{
 category: "line-height";
 type: "number";
 value: "0.75rem";
 comment: "Constant line-height token for line-height 05";
 name: "line-height-05";
 altValue: "12px";
1943},
1944{
 category: "line-height";
 type: "number";
 value: "1rem";
 comment: "Constant line-height token for line-height 10";
 name: "line-height-10";
 altValue: "16px";
1951},
1952{
 category: "line-height";
 type: "number";
 value: "1.25rem";
 comment: "Constant line-height token for line-height 20";
 name: "line-height-20";
 altValue: "20px";
1959},
1960{
 category: "line-height";
 type: "number";
 value: "1.25rem";
 comment: "Constant line-height token for line-height 30";
 name: "line-height-30";
 altValue: "20px";
1967},
1968{
 category: "line-height";
 type: "number";
 value: "1.5rem";
 comment: "Constant line-height token for line-height 40";
 name: "line-height-40";
 altValue: "24px";
1975},
1976{
 category: "line-height";
 type: "number";
 value: "1.75rem";
 comment: "Constant line-height token for line-height 50";
 name: "line-height-50";
 altValue: "28px";
1983},
1984{
 category: "line-height";
 type: "number";
 value: "1.75rem";
 comment: "Constant line-height token for line-height 60";
 name: "line-height-60";
 altValue: "28px";
1991},
1992{
 category: "line-height";
 type: "number";
 value: "2rem";
 comment: "Constant line-height token for line-height 70";
 name: "line-height-70";
 altValue: "32px";
1999},
2000{
 category: "line-height";
 type: "number";
 value: "2.5rem";
 comment: "Constant line-height token for line-height 80";
 name: "line-height-80";
 altValue: "40px";
2007},
2008{
 category: "line-height";
 type: "number";
 value: "2.5rem";
 comment: "Constant line-height token for line-height 90";
 name: "line-height-90";
 altValue: "40px";
2015},
2016{
 category: "line-height";
 type: "number";
 value: "3.25rem";
 comment: "Constant line-height token for line-height 100";
 name: "line-height-100";
 altValue: "52px";
2023},
2024{
 category: "line-height";
 type: "number";
 value: "4rem";
 comment: "Constant line-height token for line-height 110";
 name: "line-height-110";
 altValue: "64px";
2031},
2032{
 category: "line-height";
 type: "number";
 value: "2.5rem";
 comment: "Constant line-height token for line-height-display 10";
 name: "line-height-display-10";
 altValue: "40px";
2039},
2040{
 category: "line-height";
 type: "number";
 value: "3.75rem";
 comment: "Constant line-height token for line-height-display 20";
 name: "line-height-display-20";
 altValue: "60px";
2047},
2048{
 category: "line-height";
 type: "number";
 value: "5rem";
 comment: "Constant line-height token for line-height-display 30";
 name: "line-height-display-30";
 altValue: "80px";
2055}
2056]
2057"radii": [
  {
 type: "size";
 category: "radius";
 value: 0;
 comment: "Border radius reset";
 name: "border-radius-0";
 altValue: null;
2065},
2066{
 type: "size";
 category: "radius";
 value: "2px";
 comment: "Smallest border radius";
 name: "border-radius-10";
 altValue: null;
2073},
2074{
 type: "size";
 category: "radius";
 value: "4px";
 comment: "Small border radius";
 name: "border-radius-20";
 altValue: null;
2081},
2082{
 type: "size";
 category: "radius";
 value: "8px";
 comment: "Small-medium border radius";
 name: "border-radius-30";
 altValue: null;
2089},
2090{
 type: "size";
 category: "radius";
 value: "12px";
 comment: "Medium border radius";
 name: "border-radius-40";
 altValue: null;
2097},
2098{
 type: "size";
 category: "radius";
 value: "16px";
 comment: "Medium-large border radius";
 name: "border-radius-50";
 altValue: null;
2105},
2106{
 type: "size";
 category: "radius";
 value: "20px";
 comment: "Large border radiusr";
 name: "border-radius-60";
 altValue: null;
2113},
2114{
 type: "size";
 category: "radius";
 value: "24px";
 comment: "Larger border radius";
 name: "border-radius-70";
 altValue: null;
2121},
2122{
 type: "size";
 category: "radius";
 value: "28px";
 comment: "Extra-large border radius";
 name: "border-radius-80";
 altValue: null;
2129},
2130{
 type: "size";
 category: "radius";
 value: "32px";
 comment: "Largest border radius";
 name: "border-radius-90";
 altValue: null;
2137},
2138{
 type: "size";
 category: "radius";
 value: "50%";
 comment: "Circular border radius";
 name: "border-radius-circle";
 altValue: null;
2145},
2146{
 type: "size";
 category: "radius";
 value: "100px";
 comment: "Pill border radius";
 name: "border-radius-pill";
 altValue: null;
2153}
2154]
2155"sizings": [
  {
 type: "size";
 category: "sizing";
 value: 0;
 comment: "Generic sizing token scale for UI components.";
 name: "size-0";
 altValue: "0px";
2163},
2164{
 type: "size";
 category: "sizing";
 value: "5.5rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-10";
 altValue: "88px";
2171},
2172{
 type: "size";
 category: "sizing";
 value: "12rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-20";
 altValue: "192px";
2179},
2180{
 type: "size";
 category: "sizing";
 value: "18.5rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-30";
 altValue: "296px";
2187},
2188{
 type: "size";
 category: "sizing";
 value: "25rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-40";
 altValue: "400px";
2195},
2196{
 type: "size";
 category: "sizing";
 value: "31.5rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-50";
 altValue: "504px";
2203},
2204{
 type: "size";
 category: "sizing";
 value: "38rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-60";
 altValue: "608px";
2211},
2212{
 type: "size";
 category: "sizing";
 value: "44.5rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-70";
 altValue: "712px";
2219},
2220{
 type: "size";
 category: "sizing";
 value: "51rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-80";
 altValue: "816px";
2227},
2228{
 type: "size";
 category: "sizing";
 value: "57.5rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-90";
 altValue: "920px";
2235},
2236{
 type: "size";
 category: "sizing";
 value: "64rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-100";
 altValue: "1024px";
2243},
2244{
 type: "size";
 category: "sizing";
 value: "70.5rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-110";
 altValue: "1128px";
2251},
2252{
 type: "size";
 category: "sizing";
 value: "77rem";
 comment: "Generic sizing token scale for UI components.";
 name: "size-120";
 altValue: "1232px";
2259},
2260{
 type: "size";
 category: "sizing";
 value: "0.75rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-05";
 altValue: "12px";
2267},
2268{
 type: "size";
 category: "sizing";
 value: "1rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-10";
 altValue: "16px";
2275},
2276{
 type: "size";
 category: "sizing";
 value: "1.25rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-20";
 altValue: "20px";
2283},
2284{
 type: "size";
 category: "sizing";
 value: "1.25rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-30";
 altValue: "20px";
2291},
2292{
 type: "size";
 category: "sizing";
 value: "1.5rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-40";
 altValue: "24px";
2299},
2300{
 type: "size";
 category: "sizing";
 value: "1.75rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-50";
 altValue: "28px";
2307},
2308{
 type: "size";
 category: "sizing";
 value: "1.75rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-60";
 altValue: "28px";
2315},
2316{
 type: "size";
 category: "sizing";
 value: "2rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-70";
 altValue: "32px";
2323},
2324{
 type: "size";
 category: "sizing";
 value: "2.5rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-80";
 altValue: "40px";
2331},
2332{
 type: "size";
 category: "sizing";
 value: "2.5rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-90";
 altValue: "40px";
2339},
2340{
 type: "size";
 category: "sizing";
 value: "3.25rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-100";
 altValue: "52px";
2347},
2348{
 type: "size";
 category: "sizing";
 value: "4rem";
 comment: "Maps to line-height tokens 1:1";
 name: "size-icon-110";
 altValue: "64px";
2355},
2356{
 type: "size";
 category: "sizing";
 value: "15rem";
 comment: "Sizing token for sidebar width.";
 name: "size-sidebar";
 altValue: "240px";
2363},
2364{
 type: "size";
 category: "sizing";
 value: "4.75rem";
 comment: "Sizing token for the compact sidebar width.";
 name: "size-sidebar-compact";
 altValue: "76px";
2371},
2372{
 type: "size";
 category: "sizing";
 value: 0;
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-0";
 altValue: "0px";
2379},
2380{
 type: "size";
 category: "sizing";
 value: "0.125rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-10";
 altValue: "2px";
2387},
2388{
 type: "size";
 category: "sizing";
 value: "0.25rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-20";
 altValue: "4px";
2395},
2396{
 type: "size";
 category: "sizing";
 value: "0.375rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-25";
 altValue: "6px";
2403},
2404{
 type: "size";
 category: "sizing";
 value: "0.5rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-30";
 altValue: "8px";
2411},
2412{
 type: "size";
 category: "sizing";
 value: "0.75rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-40";
 altValue: "12px";
2419},
2420{
 type: "size";
 category: "sizing";
 value: "1rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-50";
 altValue: "16px";
2427},
2428{
 type: "size";
 category: "sizing";
 value: "1.25rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-60";
 altValue: "20px";
2435},
2436{
 type: "size";
 category: "sizing";
 value: "1.5rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-70";
 altValue: "24px";
2443},
2444{
 type: "size";
 category: "sizing";
 value: "1.75rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-80";
 altValue: "28px";
2451},
2452{
 type: "size";
 category: "sizing";
 value: "2rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-90";
 altValue: "32px";
2459},
2460{
 type: "size";
 category: "sizing";
 value: "2.25rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-100";
 altValue: "36px";
2467},
2468{
 type: "size";
 category: "sizing";
 value: "2.5rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-110";
 altValue: "40px";
2475},
2476{
 type: "size";
 category: "sizing";
 value: "2.75rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-120";
 altValue: "44px";
2483},
2484{
 type: "size";
 category: "sizing";
 value: "3rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-130";
 altValue: "48px";
2491},
2492{
 type: "size";
 category: "sizing";
 value: "3.25rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-140";
 altValue: "52px";
2499},
2500{
 type: "size";
 category: "sizing";
 value: "3.5rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-150";
 altValue: "56px";
2507},
2508{
 type: "size";
 category: "sizing";
 value: "3.75rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-160";
 altValue: "60px";
2515},
2516{
 type: "size";
 category: "sizing";
 value: "4rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-170";
 altValue: "64px";
2523},
2524{
 type: "size";
 category: "sizing";
 value: "4.25rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-180";
 altValue: "68px";
2531},
2532{
 type: "size";
 category: "sizing";
 value: "4.5rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-190";
 altValue: "72px";
2539},
2540{
 type: "size";
 category: "sizing";
 value: "4.75rem";
 comment: "Generic square sizing token scale for UI components.";
 name: "size-square-200";
 altValue: "76px";
2547},
2548{
 type: "size";
 category: "sizing";
 value: "4.75rem";
 comment: "Sizing token for the minimum topbar height.";
 name: "size-topbar";
 altValue: "76px";
2555}
2556]
2557"spacings": [
  {
 category: "spacing";
 type: "size";
 value: 0;
 name: "space-0";
 altValue: "0px";
2564},
2565{
 category: "spacing";
 type: "size";
 value: "0.125rem";
 name: "space-10";
 altValue: "2px";
2571},
2572{
 category: "spacing";
 type: "size";
 value: "0.25rem";
 name: "space-20";
 altValue: "4px";
2578},
2579{
 category: "spacing";
 type: "size";
 value: "0.5rem";
 name: "space-30";
 altValue: "8px";
2585},
2586{
 category: "spacing";
 type: "size";
 value: "0.75rem";
 name: "space-40";
 altValue: "12px";
2592},
2593{
 category: "spacing";
 type: "size";
 value: "1rem";
 name: "space-50";
 altValue: "16px";
2599},
2600{
 category: "spacing";
 type: "size";
 value: "1.25rem";
 name: "space-60";
 altValue: "20px";
2606},
2607{
 category: "spacing";
 type: "size";
 value: "1.5rem";
 name: "space-70";
 altValue: "24px";
2613},
2614{
 category: "spacing";
 type: "size";
 value: "1.75rem";
 name: "space-80";
 altValue: "28px";
2620},
2621{
 category: "spacing";
 type: "size";
 value: "2rem";
 name: "space-90";
 altValue: "32px";
2627},
2628{
 category: "spacing";
 type: "size";
 value: "2.25rem";
 name: "space-100";
 altValue: "36px";
2634},
2635{
 category: "spacing";
 type: "size";
 value: "2.5rem";
 name: "space-110";
 altValue: "40px";
2641},
2642{
 category: "spacing";
 type: "size";
 value: "2.75rem";
 name: "space-120";
 altValue: "44px";
2648},
2649{
 category: "spacing";
 type: "size";
 value: "3rem";
 name: "space-130";
 altValue: "48px";
2655},
2656{
 category: "spacing";
 type: "size";
 value: "3.25rem";
 name: "space-140";
 altValue: "52px";
2662},
2663{
 category: "spacing";
 type: "size";
 value: "3.5rem";
 name: "space-150";
 altValue: "56px";
2669},
2670{
 category: "spacing";
 type: "size";
 value: "3.75rem";
 name: "space-160";
 altValue: "60px";
2676},
2677{
 category: "spacing";
 type: "size";
 value: "4rem";
 name: "space-170";
 altValue: "64px";
2683},
2684{
 category: "spacing";
 type: "size";
 value: "4.25rem";
 name: "space-180";
 altValue: "68px";
2690},
2691{
 category: "spacing";
 type: "size";
 value: "4.5rem";
 name: "space-190";
 altValue: "72px";
2697},
2698{
 category: "spacing";
 type: "size";
 value: "4.75rem";
 name: "space-200";
 altValue: "76px";
2704},
2705{
 category: "spacing";
 type: "size";
 value: "-0.125rem";
 name: "space-negative-10";
 altValue: "-2px";
2711},
2712{
 category: "spacing";
 type: "size";
 value: "-0.25rem";
 name: "space-negative-20";
 altValue: "-4px";
2718},
2719{
 category: "spacing";
 type: "size";
 value: "-0.5rem";
 name: "space-negative-30";
 altValue: "-8px";
2725},
2726{
 category: "spacing";
 type: "size";
 value: "-0.75rem";
 name: "space-negative-40";
 altValue: "-12px";
2732},
2733{
 category: "spacing";
 type: "size";
 value: "-1rem";
 name: "space-negative-50";
 altValue: "-16px";
2739},
2740{
 category: "spacing";
 type: "size";
 value: "-1.25rem";
 name: "space-negative-60";
 altValue: "-20px";
2746},
2747{
 category: "spacing";
 type: "size";
 value: "-1.5rem";
 name: "space-negative-70";
 altValue: "-24px";
2753},
2754{
 category: "spacing";
 type: "size";
 value: "-1.75rem";
 name: "space-negative-80";
 altValue: "-28px";
2760},
2761{
 category: "spacing";
 type: "size";
 value: "-2rem";
 name: "space-negative-90";
 altValue: "-32px";
2767},
2768{
 category: "spacing";
 type: "size";
 value: "-2.25rem";
 name: "space-negative-100";
 altValue: "-36px";
2774},
2775{
 category: "spacing";
 type: "size";
 value: "-2.5rem";
 name: "space-negative-110";
 altValue: "-40px";
2781},
2782{
 category: "spacing";
 type: "size";
 value: "-2.75rem";
 name: "space-negative-120";
 altValue: "-44px";
2788},
2789{
 category: "spacing";
 type: "size";
 value: "-3rem";
 name: "space-negative-130";
 altValue: "-48px";
2795},
2796{
 category: "spacing";
 type: "size";
 value: "-3.25rem";
 name: "space-negative-140";
 altValue: "-52px";
2802},
2803{
 category: "spacing";
 type: "size";
 value: "-3.5rem";
 name: "space-negative-150";
 altValue: "-56px";
2809},
2810{
 category: "spacing";
 type: "size";
 value: "-3.75rem";
 name: "space-negative-160";
 altValue: "-60px";
2816},
2817{
 category: "spacing";
 type: "size";
 value: "-4rem";
 name: "space-negative-170";
 altValue: "-64px";
2823},
2824{
 category: "spacing";
 type: "size";
 value: "-4.25rem";
 name: "space-negative-180";
 altValue: "-68px";
2830},
2831{
 category: "spacing";
 type: "size";
 value: "-4.5rem";
 name: "space-negative-190";
 altValue: "-72px";
2837},
2838{
 category: "spacing";
 type: "size";
 value: "-4.75rem";
 name: "space-negative-200";
 altValue: "-76px";
2844}
2845]
2846"text-colors": [
  {
 type: "color";
 category: "text-color";
 value: "rgb(18, 28, 45)";
 comment: "Body text color";
 text_contrast_pairing: ["color-background","color-background-strong","color-background-stronger","color-background-body","color-background-user","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weak","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weak","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-text";
 altValue: "#121C2D";
2855},
2856{
 type: "color";
 category: "text-color";
 value: "rgb(18, 28, 45)";
 comment: "Text color to be used on top of brand accent background colors such as color-background-brand-10 only.";
 text_contrast_pairing: ["color-background-brand-10","color-background-brand-20","color-background-brand-30"];
 name: "color-text-brand";
 altValue: "#121C2D";
2864},
2865{
 type: "color";
 category: "text-color";
 value: "rgb(242, 47, 70)";
 comment: "Twilio brand red, accessible on large text only.";
 uicontrol_contrast_pairing: ["color-background-body"];
 name: "color-text-brand-highlight";
 altValue: "#F22F46";
2873},
2874{
 type: "color";
 category: "text-color";
 value: "rgb(255, 255, 255)";
 comment: "Text color used on any brand color";
 text_contrast_pairing: ["color-background-body-inverse","color-background-brand"];
 name: "color-text-brand-inverse";
 altValue: "#FFFFFF";
2882},
2883{
 type: "color";
 category: "text-color";
 value: "rgb(96, 107, 133)";
 comment: "Text color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or border tokens.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-decorative-10-weakest"];
 name: "color-text-decorative-10";
 altValue: "#606B85";
2891},
2892{
 type: "color";
 category: "text-color";
 value: "rgb(0, 20, 137)";
 comment: "Text color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or border tokens.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-decorative-20-weakest"];
 name: "color-text-decorative-20";
 altValue: "#001489";
2900},
2901{
 type: "color";
 category: "text-color";
 value: "rgb(14, 124, 58)";
 comment: "Text color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or border tokens.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-decorative-30-weakest"];
 name: "color-text-decorative-30";
 altValue: "#0E7C3A";
2909},
2910{
 type: "color";
 category: "text-color";
 value: "rgb(109, 46, 209)";
 comment: "Text color with no semantic meaning, used for decorative purposes only. Should generally be used with matching decorative background and/or border tokens.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-decorative-40-weakest"];
 name: "color-text-decorative-40";
 altValue: "#6D2ED1";
2918},
2919{
 type: "color";
 category: "text-color";
 value: "rgb(214, 31, 31)";
 comment: "Destructive text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-warning-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-destructive";
 altValue: "#D61F1F";
2927},
2928{
 type: "color";
 category: "text-color";
 value: "rgb(173, 17, 17)";
 comment: "Strong shade of destructive text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-destructive-strong";
 altValue: "#AD1111";
2936},
2937{
 type: "color";
 category: "text-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger shade of destructive text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-destructive-stronger";
 altValue: "#4A0B0B";
2945},
2946{
 type: "color";
 category: "text-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest shade of destructive text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-destructive-strongest";
 altValue: "#310C0C";
2954},
2955{
 type: "color";
 category: "text-color";
 value: "rgb(246, 177, 177)";
 comment: "Weak shade of destructive text.";
 name: "color-text-destructive-weak";
 altValue: "#F6B1B1";
2962},
2963{
 type: "color";
 category: "text-color";
 value: "rgb(214, 31, 31)";
 comment: "Error text for inputs and error misc";
 text_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-error";
 altValue: "#D61F1F";
2971},
2972{
 type: "color";
 category: "text-color";
 value: "rgb(173, 17, 17)";
 comment: "Strong error text for inputs and error misc";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-error-strong";
 altValue: "#AD1111";
2980},
2981{
 type: "color";
 category: "text-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger error text for inputs and error misc";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-error-stronger";
 altValue: "#4A0B0B";
2989},
2990{
 type: "color";
 category: "text-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest error text for inputs and error misc.";
 name: "color-text-error-strongest";
 altValue: "#310C0C";
2997},
2998{
 type: "color";
 category: "text-color";
 value: "rgb(235, 86, 86)";
 comment: "Weak error text for inputs and error misc";
 name: "color-text-error-weak";
 altValue: "#EB5656";
3005},
3006{
 type: "color";
 category: "text-color";
 value: "rgb(96, 107, 133)";
 comment: "Default icon color.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 uicontrol_contrast_pairing: ["color-background","color-background-strong","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-text-icon";
 altValue: "#606B85";
3015},
3016{
 type: "color";
 category: "text-color";
 value: "rgb(14, 124, 58)";
 comment: "Icon color for indicating a available status";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 name: "color-text-icon-available";
 altValue: "#0E7C3A";
3024},
3025{
 type: "color";
 category: "text-color";
 value: "rgb(242, 47, 70)";
 comment: "Twilio brand red icon color used for the Twilio logo.";
 uicontrol_contrast_pairing: ["color-background","color-background-body"];
 name: "color-text-icon-brand-highlight";
 altValue: "#F22F46";
3033},
3034{
 type: "color";
 category: "text-color";
 value: "rgb(255, 255, 255)";
 comment: "Twilio brand icon color used for the Twilio logo on inverse backgrounds.";
 text_contrast_pairing: ["color-background-body-inverse"];
 name: "color-text-icon-brand-inverse";
 altValue: "#FFFFFF";
3042},
3043{
 type: "color";
 category: "text-color";
 value: "rgb(227, 106, 25)";
 comment: "Icon color for indicating a busy status";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 name: "color-text-icon-busy";
 altValue: "#E36A19";
3051},
3052{
 type: "color";
 category: "text-color";
 value: "rgb(214, 31, 31)";
 comment: "Icon color for indicating an error.";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-error-weakest","color-background-row-striped"];
 name: "color-text-icon-error";
 altValue: "#D61F1F";
3060},
3061{
 type: "color";
 category: "text-color";
 value: "rgb(136, 145, 170)";
 comment: "Default icon color for inverse backgrounds.";
 text_contrast_pairing: ["color-background-body-inverse"];
 name: "color-text-icon-inverse";
 altValue: "#8891AA";
3069},
3070{
 type: "color";
 category: "text-color";
 value: "rgb(0, 20, 137)";
 comment: "Icon color for being neutral.";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-row-striped"];
 name: "color-text-icon-neutral";
 altValue: "#001489";
3078},
3079{
 type: "color";
 category: "text-color";
 value: "rgb(109, 46, 209)";
 comment: "Icon color for indicating a new status.";
 name: "color-text-icon-new";
 altValue: "#6D2ED1";
3086},
3087{
 type: "color";
 category: "text-color";
 value: "rgb(96, 107, 133)";
 comment: "Icon color for indicating a offline status";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 name: "color-text-icon-offline";
 altValue: "#606B85";
3095},
3096{
 type: "color";
 category: "text-color";
 value: "rgb(14, 124, 58)";
 comment: "Icon color for indicating success.";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-success-weakest","color-background-row-striped"];
 name: "color-text-icon-success";
 altValue: "#0E7C3A";
3104},
3105{
 type: "color";
 category: "text-color";
 value: "rgb(214, 31, 31)";
 comment: "Icon color for indicating a unavailable status";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 name: "color-text-icon-unavailable";
 altValue: "#D61F1F";
3113},
3114{
 type: "color";
 category: "text-color";
 value: "rgb(227, 106, 25)";
 comment: "Icon color for indicating a warning.";
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 name: "color-text-icon-warning";
 altValue: "#E36A19";
3122},
3123{
 type: "color";
 category: "text-color";
 value: "rgb(255, 255, 255)";
 comment: "Inverse text color for dark backgrounds. Must pass AA color contrast with color-background-body-inverse.";
 text_contrast_pairing: ["color-background-body-inverse","color-background-brand","color-background-error","color-background-primary","color-background-destructive"];
 name: "color-text-inverse";
 altValue: "#FFFFFF";
3131},
3132{
 type: "color";
 category: "text-color";
 value: "rgb(200, 175, 240)";
 comment: "Inverse color for indicating a new status.";
 text_contrast_pairing: ["color-background-inverse-strong"];
 name: "color-text-inverse-new";
 altValue: "#C8AFF0";
3140},
3141{
 type: "color";
 category: "text-color";
 value: "rgb(202, 205, 216)";
 comment: "Weak inverse text color for dark backgrounds. Must pass AA color contrast with color-background-body-inverse.";
 text_contrast_pairing: ["color-background-body-inverse","color-background-brand"];
 name: "color-text-inverse-weak";
 altValue: "#CACDD8";
3149},
3150{
 type: "color";
 category: "text-color";
 value: "rgb(136, 145, 170)";
 comment: "Weaker inverse text color for dark backgrounds. Must pass AA color contrast with color-background-body-inverse.";
 name: "color-text-inverse-weaker";
 altValue: "#8891AA";
3157},
3158{
 type: "color";
 category: "text-color";
 value: "rgb(75, 86, 113)";
 comment: "Weakest inverse text color for dark backgrounds. Must pass AA color contrast with color-background-body-inverse.";
 name: "color-text-inverse-weakest";
 altValue: "#4B5671";
3165},
3166{
 type: "color";
 category: "text-color";
 value: "rgb(2, 99, 224)";
 comment: "Link text";
 text_contrast_pairing: ["color-background","color-background-body","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 uicontrol_contrast_pairing: ["color-background","color-background-strong","color-background-body","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-new","color-background-row-striped","color-background-primary-weaker","color-background-primary-weakest","color-background-destructive-weaker","color-background-destructive-weakest"];
 name: "color-text-link";
 altValue: "#0263E0";
3175},
3176{
 type: "color";
 category: "text-color";
 value: "rgb(214, 31, 31)";
 comment: "Destructive link text";
 text_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-warning-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-destructive";
 altValue: "#D61F1F";
3184},
3185{
 type: "color";
 category: "text-color";
 value: "rgb(173, 17, 17)";
 comment: "Strong shade of destructive link text to be used in interactions";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-destructive-strong";
 altValue: "#AD1111";
3193},
3194{
 type: "color";
 category: "text-color";
 value: "rgb(74, 11, 11)";
 comment: "Stronger shade of destructive link text to be used in interactions";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-destructive-stronger";
 altValue: "#4A0B0B";
3202},
3203{
 type: "color";
 category: "text-color";
 value: "rgb(49, 12, 12)";
 comment: "Strongest shade of destructive link text to be used in interactions";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-destructive-strongest";
 altValue: "#310C0C";
3211},
3212{
 type: "color";
 category: "text-color";
 value: "rgb(246, 177, 177)";
 comment: "Weak shade of destructive link text to be used in interactions";
 name: "color-text-link-destructive-weak";
 altValue: "#F6B1B1";
3219},
3220{
 type: "color";
 category: "text-color";
 value: "rgb(0, 20, 137)";
 comment: "Strong shade of link text to be used in interactions";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-strong";
 altValue: "#001489";
3228},
3229{
 type: "color";
 category: "text-color";
 value: "rgb(3, 11, 93)";
 comment: "Stronger shade of link text to be used in interactions";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-stronger";
 altValue: "#030B5D";
3237},
3238{
 type: "color";
 category: "text-color";
 value: "rgb(6, 3, 58)";
 comment: "Strongest shade of link text to be used in interactions";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-link-strongest";
 altValue: "#06033A";
3246},
3247{
 type: "color";
 category: "text-color";
 value: "rgb(153, 205, 255)";
 comment: "Weak shade of link text to be used in interactions";
 name: "color-text-link-weak";
 altValue: "#99CDFF";
3254},
3255{
 type: "color";
 category: "text-color";
 value: "rgb(0, 20, 137)";
 comment: "Color for text indicating a neutral status.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-neutral";
 altValue: "#001489";
3263},
3264{
 type: "color";
 category: "text-color";
 value: "rgb(109, 46, 209)";
 comment: "Color for text indicating a new status.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-subaccount","color-background-trial","color-background-neutral-weakest","color-background-success-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-new";
 altValue: "#6D2ED1";
3272},
3273{
 type: "color";
 category: "text-color";
 value: "rgb(2, 99, 224)";
 comment: "Primary text.";
 name: "color-text-primary";
 altValue: "#0263E0";
3280},
3281{
 type: "color";
 category: "text-color";
 value: "rgb(0, 20, 137)";
 comment: "Strong primary text.";
 name: "color-text-primary-strong";
 altValue: "#001489";
3288},
3289{
 type: "color";
 category: "text-color";
 value: "rgb(3, 11, 93)";
 comment: "Stronger primary text.";
 name: "color-text-primary-stronger";
 altValue: "#030B5D";
3296},
3297{
 type: "color";
 category: "text-color";
 value: "rgb(6, 3, 58)";
 comment: "Strongest primary text.";
 name: "color-text-primary-strongest";
 altValue: "#06033A";
3304},
3305{
 type: "color";
 category: "text-color";
 value: "rgb(153, 205, 255)";
 comment: "Weak primary text.";
 name: "color-text-primary-weak";
 altValue: "#99CDFF";
3312},
3313{
 type: "color";
 category: "text-color";
 value: "rgb(84, 51, 8)";
 comment: "Text color for the subaccount badge";
 name: "color-text-subaccount";
 altValue: "#543308";
3320},
3321{
 type: "color";
 category: "text-color";
 value: "rgb(14, 124, 58)";
 comment: "Text color for success text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-success-weakest","color-background-row-striped"];
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-success-weakest","color-background-row-striped"];
 name: "color-text-success";
 altValue: "#0E7C3A";
3330},
3331{
 type: "color";
 category: "text-color";
 value: "rgb(18, 28, 45)";
 comment: "Text color for user avatar.";
 name: "color-text-user";
 altValue: "#121C2D";
3338},
3339{
 type: "color";
 category: "text-color";
 value: "rgb(141, 49, 24)";
 comment: "Color for warning text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-warning-weakest","color-background-row-striped"];
 name: "color-text-warning";
 altValue: "#8D3118";
3348},
3349{
 type: "color";
 category: "text-color";
 value: "rgb(141, 49, 24)";
 comment: "Color for dark warning text.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-row-striped","color-background-warning-weakest"];
 uicontrol_contrast_pairing: ["color-background","color-background-body","color-background-row-striped","color-background-warning-weakest"];
 name: "color-text-warning-strong";
 altValue: "#8D3118";
3358},
3359{
 type: "color";
 category: "text-color";
 value: "rgb(96, 107, 133)";
 comment: "Weak body text for visual hierarchy.";
 text_contrast_pairing: ["color-background","color-background-body","color-background-neutral-weakest","color-background-warning-weakest","color-background-error-weakest","color-background-row-striped","color-background-primary-weakest","color-background-destructive-weakest"];
 name: "color-text-weak";
 altValue: "#606B85";
3367},
3368{
 type: "color";
 category: "text-color";
 value: "rgb(174, 178, 193)";
 comment: "Weaker body text for visual hierarchy. Inaccessible unless used on disabled controls.";
 name: "color-text-weaker";
 altValue: "#AEB2C1";
3375},
3376{
 type: "color";
 category: "text-color";
 value: "rgb(255, 255, 255)";
 comment: "Weakest body text for visual hierarchy. Inaccessible unless used on disabled controls.";
 text_contrast_pairing: ["color-background-primary-strong","color-background-primary-stronger","color-background-primary-strongest","color-background-destructive-strong","color-background-destructive-stronger","color-background-destructive-strongest"];
 name: "color-text-weakest";
 altValue: "#FFFFFF";
3384}
3385]
3386"z-indices": [
  {
 type: "z-index";
 category: "z-index";
 value: 0;
 name: "z-index-0";
 altValue: null;
3393},
3394{
 type: "z-index";
 category: "z-index";
 value: 10;
 name: "z-index-10";
 altValue: null;
3400},
3401{
 type: "z-index";
 category: "z-index";
 value: 20;
 name: "z-index-20";
 altValue: null;
3407},
3408{
 type: "z-index";
 category: "z-index";
 value: 30;
 name: "z-index-30";
 altValue: null;
3414},
3415{
 type: "z-index";
 category: "z-index";
 value: 40;
 name: "z-index-40";
 altValue: null;
3421},
3422{
 type: "z-index";
 category: "z-index";
 value: 50;
 name: "z-index-50";
 altValue: null;
3428},
3429{
 type: "z-index";
 category: "z-index";
 value: 60;
 name: "z-index-60";
 altValue: null;
3435},
3436{
 type: "z-index";
 category: "z-index";
 value: 70;
 name: "z-index-70";
 altValue: null;
3442},
3443{
 type: "z-index";
 category: "z-index";
 value: 80;
 name: "z-index-80";
 altValue: null;
3449},
3450{
 type: "z-index";
 category: "z-index";
 value: 90;
 name: "z-index-90";
 altValue: null;
3456}
3457]}
3458}
3459export default Tokens;
\No newline at end of file
1	`declare const Tokens: {`
2	`"tokens":{"background-colors": [`
3	`{`
4	`type: "color";`
5	`category: "background-color";`
6	`value: "rgb(244, 244, 246)";`
7	`comment: "Default background color for any container.";`
8	`name: "color-background";`
9	`altValue: "#F4F4F6";`
10	`},`
11	`{`
12	`type: "color";`
13	`category: "background-color";`
14	`value: "rgb(20, 176, 83)";`
15	`comment: "Background color used to represent an entity or person as \"available\".";`
16	`name: "color-background-available";`
17	`altValue: "#14B053";`
18	`},`
19	`{`
20	`type: "color";`
21	`category: "background-color";`
22	`value: "rgb(255, 255, 255)";`
23	`comment: "Background color used for the main page body.";`
24	`name: "color-background-body";`
25	`altValue: "#FFFFFF";`
26	`},`
27	`{`
28	`type: "color";`
29	`category: "background-color";`
30	`value: "rgb(18, 28, 45)";`
31	`comment: "Inverse background color used for the main page body.";`
32	`name: "color-background-body-inverse";`
33	`altValue: "#121C2D";`
34	`},`
35	`{`
36	`type: "color";`
37	`category: "background-color";`
38	`value: "rgb(0, 20, 137)";`
39	`comment: "Primary brand background, accessible with inverse text.";`
40	`name: "color-background-brand";`