@aurodesignsystem/design-tokens 4.0.0 → 4.1.0

package/src/color-darkmode/base.json

@@ -2,138 +2,18 @@
   "color": {
     "base": {
       "white": {
-        "value": "ffffff",
+        "value": "000000",
         "comment": "{comments.color.base.value.comment}",
         "public": true,
-        "deprecated": false
-      },
-      "white-opacity-40": {
-        "value": "ffffff66",
-        "comment": "white @ 40%",
-        "public": true,
-        "opacity": true,
-        "deprecated": false
+        "deprecated": false,
+        "darkmode": true
       },
       "black": {
-        "value": "000000",
+        "value": "ffffff",
         "comment": "{comments.color.base.value.comment}",
         "public": true,
-        "deprecated": false
-      },
-      "black-opacity-15": {
-        "value": "00000026",
-        "comment": "black @ 15%",
-        "public": true,
-        "opacity": true,
-        "deprecated": false
-      },
-      "gray": {
-        "100": {
-          "value": "f8f8f8",
-          "version": "3.1.0",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "reference": "color-brand-gray-100",
-          "comment": "{comments.reference.comment} color-brand-gray-100"
-        },
-        "200": {
-          "value": "dbdbdb",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-200",
-          "comment": "{comments.reference.comment} color-brand-gray-200"
-        },
-        "300": {
-          "value": "b2b2b2",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-300",
-          "comment": "{comments.reference.comment} color-brand-gray-300"
-        },
-        "400": {
-          "value": "767676",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-400",
-          "comment": "{comments.reference.comment} color-brand-gray-400"
-        },
-        "500": {
-          "value": "222222",
-          "public": false,
-          "neutral": true,
-          "usage": "Neutral accent",
-          "wcag": "n/a",
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-gray-500",
-          "comment": "{comments.reference.comment} color-brand-gray-500"
-        }
-      },
-      "neutral": {
-        "400": {
-          "value": "9fabbb",
-          "public": false,
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-neutral-400",
-          "comment": "{comments.reference.comment} color-brand-neutral-400"
-        },
-        "500": {
-          "value": "626b79",
-          "public": false,
-          "deprecated": true,
-          "version": "3.1.0",
-          "reference": "color-brand-neutral-500",
-          "comment": "{comments.reference.comment} color-brand-neutral-500"
-        }
-      }
-    },
-    "state": {
-      "error": {
-        "100": {
-          "value": "ff999b",
-          "public": true,
-          "deprecated": false
-        },
-        "500": {
-          "value": "df0b37",
-          "public": true,
-          "deprecated": false
-        }
-      },
-      "success": {
-        "100": {
-          "value": "69cf96",
-          "public": true,
-          "deprecated": false
-        },
-        "500": {
-          "value": "00805d",
-          "public": true,
-          "deprecated": false
-        }
-      },
-      "warning": {
-        "500": {
-          "value": "de750c",
-          "public": true,
-          "deprecated": false
-        }
+        "deprecated": false,
+        "darkmode": true
       }
     }
   }

package/src/color-darkmode/border.json

@@ -5,56 +5,18 @@
         "default": {
           "value": "{color.brand.neutral.400.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Primary border color on dark background",
           "wcag": "n/a",
           "deprecated": false
         }
       },
-      "active": {
-        "default": {
-          "value": "{color.brand.breeze.300.value}",
-          "public": true,
-          "default": true,
-          "usage": "Active border color on dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
-      "error": {
-        "default": {
-          "value": "{color.state.error.100.value}",
-          "public": true,
-          "default": true,
-          "usage": "Error states border color on dark background",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
-      "disabled": {
-        "default": {
-          "value": "{color.base.gray.200.value}",
-          "public": true,
-          "default": true,
-          "usage": "Disabled border color on dark background",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
-      "Focus": {
-        "default": {
-          "value": "{color.base.white.value}",
-          "public": true,
-          "default": true,
-          "usage": "Focus border color for dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
       "divider": {
         "default": {
           "value": "{color.base.white.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Strict use as divider between elements on dark backgrounds",
           "wcag": "n/a",

package/src/color-darkmode/icon.json

@@ -5,6 +5,7 @@
         "default": {
           "value": "{color.base.neutral.400.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Primary color for icons on dark backgrounds",
           "wcag": "AAA",
@@ -15,31 +16,12 @@
         "default": {
           "value": "{color.base.white.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Emphasis or lightest icon color on dark backgrounds",
           "wcag": "AAA",
           "deprecated": false
         }
-      },
-      "accent": {
-        "default": {
-          "value": "{color.brand.breeze.300.value}",
-          "public": true,
-          "default": true,
-          "usage": "Accent color for icon color on dark backgrounds",
-          "wcag": "AA",
-          "deprecated": false
-        }
-      },
-      "disabled": {
-        "default": {
-          "value": "{color.base.white-opacity-40.value}",
-          "public": true,
-          "default": true,
-          "usage": "Disabled icon color on dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
       }
     }
   }

package/src/color-darkmode/text.json

@@ -5,6 +5,7 @@
         "default": {
           "value": "{color.base.white.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Primary color for body and header text on dark backgrounds",
           "wcag": "AAA",
@@ -15,6 +16,7 @@
         "default": {
           "value": "{color.base.neutral.400.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Secondary color for body text on dark backgrounds",
           "wcag": "AAA",
@@ -25,6 +27,7 @@
         "default": {
           "value": "{color.brand.breeze.300.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Link text color on light backgrounds",
           "wcag": "AA",
@@ -35,26 +38,18 @@
         "default": {
           "value": "{color.state.error.100.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Error text color on dark backgrounds",
           "wcag": "AA",
           "deprecated": false
         }
       },
-      "disabled": {
-        "default": {
-          "value": "{color.base.gray.200.value}",
-          "public": true,
-          "default": true,
-          "usage": "Disabled text color on dark backgrounds",
-          "wcag": "n/a",
-          "deprecated": false
-        }
-      },
       "emphasis": {
         "default": {
           "value": "{color.brand.midnight.100.value}",
           "public": true,
+          "darkmode": true,
           "default": true,
           "usage": "Emphasized text color on dark backgrounds",
           "wcag": "n/a",

package/src/color-darkmode/tier.json

@@ -6,6 +6,7 @@
           "default": {
             "value": "{color.brand.goldgray.100.value}",
             "public": true,
+            "darkmode": true,
             "default": true,
             "usage": "MVP tier color for Alaska Airlines",
             "wcag": "n/a",
@@ -16,38 +17,13 @@
           "default": {
             "value": "{color.brand.gold.100.value}",
             "public": true,
+            "darkmode": true,
             "default": true,
             "usage": "MVP Gold tier color for Alaska Airlines",
             "wcag": "n/a",
             "deprecated": false
           }
         }
-      },
-      "oneworld": {
-        "emerald": {
-            "value": "{color.brand.emerald.value}",
-            "public": true,
-            "onLight": true,
-            "usage": "Emerald tier color for Oneworld",
-            "wcag": "n/a",
-            "deprecated": false
-        },
-        "sapphire": {
-            "value": "{color.brand.sapphire.value}",
-            "public": true,
-            "default": true,
-            "usage": "Sapphire tier color for Oneworld",
-            "wcag": "n/a",
-            "deprecated": false
-        },
-        "ruby": {
-            "value": "{color.brand.ruby.value}",
-            "public": true,
-            "default": true,
-            "usage": "Ruby tier color for Oneworld",
-            "wcag": "n/a",
-            "deprecated": false
-        }
       }
     }
   }

package/dist/tokens/CSSCustomProperties--darkmode.css

@@ -1,302 +0,0 @@
-/**
- * Do not edit directly
- * Generated on Wed, 13 Sep 2023 17:26:39 GMT
- */
-
-:root {
-  --ds-asset-font-circular-family-name: "AS Circular";
-  --ds-asset-font-circular-filename: "ASCircularWeb";
-  --ds-asset-font-circular-weight-light: "-Light";
-  --ds-asset-font-circular-weight-medium: "-Medium";
-  --ds-asset-font-circular-weight-book: "-Book";
-  --ds-border-radius: 0.375rem;
-  --ds-size-25: 0.125rem; /* 2px */
-  --ds-size-50: 0.25rem; /* 4px */
-  --ds-size-100: 0.5rem; /* 8px */
-  --ds-size-150: 0.75rem; /* 12px */
-  --ds-size-200: 1rem; /* 16px */
-  --ds-size-300: 1.5rem; /* 24px */
-  --ds-size-400: 2rem; /* 32px */
-  --ds-size-500: 2.5rem; /* 40px */
-  --ds-size-600: 3rem; /* 48px */
-  --ds-size-700: 3.5rem; /* 56px */
-  --ds-size-800: 4rem; /* 64px */
-  --ds-size-900: 4.5rem; /* 72px */
-  --ds-size-1000: 5rem; /* 80px */
-  --ds-unitless-scale-20: 0.25;
-  --ds-unitless-scale-50: 0.5;
-  --ds-unitless-scale-100: 1;
-  --ds-unitless-scale-140: 1.4;
-  --ds-unitless-scale-150: 1.5;
-  --ds-unitless-scale-200: 2;
-  --ds-unitless-scale-300: 3;
-  --ds-unitless-scale-350: 3.5;
-  --ds-animation-default-property: all;
-  --ds-animation-default-duration: 0.3s;
-  --ds-animation-default-timing: ease-out;
-  --ds-depth-overlay: 200;
-  --ds-depth-modal: 400;
-  --ds-depth-tooltip: 300;
-  --ds-elevation-100: 0px 0px 5px rgba(0, 0, 0, 0.15); /* for the least amount of emphasis */
-  --ds-elevation-200: 0px 0px 10px rgba(0, 0, 0, 0.15); /* for more emphasis than low elevation */
-  --ds-elevation-300: 0px 0px 15px rgba(0, 0, 0, 0.2); /* for maximum emphasis or differentiation */
-  --ds-grid-breakpoint-xs: 320px;
-  --ds-grid-breakpoint-sm: 576px;
-  --ds-grid-breakpoint-md: 768px;
-  --ds-grid-breakpoint-lg: 1024px;
-  --ds-grid-breakpoint-xl: 1232px;
-  --ds-grid-column-xs: 6;
-  --ds-grid-column-sm: 12;
-  --ds-grid-column-md: 12;
-  --ds-grid-column-lg: 12;
-  --ds-grid-column-xl: 12;
-  --ds-grid-gutter-xs: 0.5rem;
-  --ds-grid-gutter-sm: 1rem;
-  --ds-grid-gutter-md: 1.5rem;
-  --ds-grid-gutter-lg: 1.5rem;
-  --ds-grid-gutter-xl: 2rem;
-  --ds-grid-margin-xs: 1rem;
-  --ds-grid-margin-sm: 1rem;
-  --ds-grid-margin-md: 1.5rem;
-  --ds-grid-margin-lg: 2rem;
-  --ds-grid-margin-xl: 2rem;
-  --ds-font-family-default: 'AS Circular', Helvetica Neue, Arial, sans-serif;
-  --ds-font-family-mono: Menlo, Monaco, Consolas, 'Courier New', monospace;
-  --ds-text-heading-300-weight: 300;
-  --ds-text-heading-300-px: 18px;
-  --ds-text-heading-300-size: 1.125rem;
-  --ds-text-heading-300-height: 1.625rem;
-  --ds-text-heading-300-height-px: 26px;
-  --ds-text-heading-400-weight: 300;
-  --ds-text-heading-400-px: 20px;
-  --ds-text-heading-400-size: 1.25rem;
-  --ds-text-heading-400-height: 1.625rem;
-  --ds-text-heading-400-height-px: 26px;
-  --ds-text-heading-500-weight: 300;
-  --ds-text-heading-500-px-breakpoint-sm: 22px;
-  --ds-text-heading-500-px-breakpoint-md: 24px;
-  --ds-text-heading-500-px-breakpoint-lg: 24px;
-  --ds-text-heading-500-size-breakpoint-sm: 1.375rem;
-  --ds-text-heading-500-size-breakpoint-md: 1.5rem;
-  --ds-text-heading-500-size-breakpoint-lg: 1.5rem;
-  --ds-text-heading-500-height-breakpoint-sm: 1.625rem;
-  --ds-text-heading-500-height-breakpoint-px-sm: 26px;
-  --ds-text-heading-500-height-breakpoint-md: 1.875rem;
-  --ds-text-heading-500-height-breakpoint-px-md: 30px;
-  --ds-text-heading-500-height-breakpoint-lg: 2rem;
-  --ds-text-heading-500-height-breakpoint-px-lg: 32px;
-  --ds-text-heading-600-weight: 300;
-  --ds-text-heading-600-px-breakpoint-sm: 26px;
-  --ds-text-heading-600-px-breakpoint-md: 28px;
-  --ds-text-heading-600-px-breakpoint-lg: 28px;
-  --ds-text-heading-600-size-breakpoint-sm: 1.625rem;
-  --ds-text-heading-600-size-breakpoint-md: 1.75rem;
-  --ds-text-heading-600-size-breakpoint-lg: 1.75rem;
-  --ds-text-heading-600-height-breakpoint-sm: 1.875rem;
-  --ds-text-heading-600-height-breakpoint-px-sm: 30px;
-  --ds-text-heading-600-height-breakpoint-md: 2.125rem;
-  --ds-text-heading-600-height-breakpoint-px-md: 34px;
-  --ds-text-heading-600-height-breakpoint-lg: 2.25rem;
-  --ds-text-heading-600-height-breakpoint-px-lg: 36px;
-  --ds-text-heading-700-weight: 500;
-  --ds-text-heading-700-px-breakpoint-sm: 28px;
-  --ds-text-heading-700-px-breakpoint-md: 32px;
-  --ds-text-heading-700-px-breakpoint-lg: 36px;
-  --ds-text-heading-700-size-breakpoint-sm: 1.75rem;
-  --ds-text-heading-700-size-breakpoint-md: 2rem;
-  --ds-text-heading-700-size-breakpoint-lg: 2.25rem;
-  --ds-text-heading-700-height-breakpoint-sm: 2.125rem;
-  --ds-text-heading-700-height-breakpoint-px-sm: 34px;
-  --ds-text-heading-700-height-breakpoint-md: 2.375rem;
-  --ds-text-heading-700-height-breakpoint-px-md: 38px;
-  --ds-text-heading-700-height-breakpoint-lg: 2.75rem;
-  --ds-text-heading-700-height-breakpoint-px-lg: 44px;
-  --ds-text-heading-800-weight: 500;
-  --ds-text-heading-800-px-breakpoint-sm: 32px;
-  --ds-text-heading-800-px-breakpoint-md: 36px;
-  --ds-text-heading-800-px-breakpoint-lg: 40px;
-  --ds-text-heading-800-size-breakpoint-sm: 2rem;
-  --ds-text-heading-800-size-breakpoint-md: 2.25rem;
-  --ds-text-heading-800-size-breakpoint-lg: 2.5rem;
-  --ds-text-heading-800-height-breakpoint-sm: 2.375rem;
-  --ds-text-heading-800-height-breakpoint-px-sm: 38px;
-  --ds-text-heading-800-height-breakpoint-md: 2.625rem;
-  --ds-text-heading-800-height-breakpoint-px-md: 42px;
-  --ds-text-heading-800-height-breakpoint-lg: 3rem;
-  --ds-text-heading-800-height-breakpoint-px-lg: 48px;
-  --ds-text-heading-default-weight: 500;
-  --ds-text-heading-default-margin: 0;
-  --ds-text-heading-default-spacing: -0.2px;
-  --ds-text-heading-medium-weight: 300;
-  --ds-text-heading-display-weight: 100;
-  --ds-text-heading-display-px-breakpoint-sm: 44px;
-  --ds-text-heading-display-px-breakpoint-md: 48px;
-  --ds-text-heading-display-px-breakpoint-lg: 56px;
-  --ds-text-heading-display-size-breakpoint-sm: 2.75rem;
-  --ds-text-heading-display-size-breakpoint-md: 3rem;
-  --ds-text-heading-display-size-breakpoint-lg: 3.5rem;
-  --ds-text-heading-display-height-breakpoint-sm: 3.375rem;
-  --ds-text-heading-display-height-breakpoint-px-sm: 54px;
-  --ds-text-heading-display-height-breakpoint-md: 3.75rem;
-  --ds-text-heading-display-height-breakpoint-px-md: 60px;
-  --ds-text-heading-display-height-breakpoint-lg: 4.25rem;
-  --ds-text-heading-display-height-breakpoint-px-lg: 68px;
-  --ds-text-body-default-weight: 500;
-  --ds-text-body-size-xxs: 0.625rem;
-  --ds-text-body-size-xs: 0.75rem;
-  --ds-text-body-size-sm: 0.875rem;
-  --ds-text-body-size-default: 1rem;
-  --ds-text-body-size-lg: 1.125rem;
-  --ds-text-body-height-xs: 1rem;
-  --ds-text-body-height-sm: 1.25rem;
-  --ds-text-body-height-default: 1.5rem;
-  --ds-text-body-height-lg: 1.625rem;
-  --ds-color-alert-notification-default: #00cff0;
-  --ds-color-alert-warning-default: #de750c;
-  --ds-color-alert-error-default: #ff999b;
-  --ds-color-alert-success-default: #69cf96;
-  --ds-color-alert-advisory-default: #fff0cd;
-  --ds-color-background-lightest: #ffffff;
-  --ds-color-background-lighter: #f8f8f8;
-  --ds-color-background-darker: #01426a;
-  --ds-color-background-darkest: #00274a;
-  --ds-color-base-white: #ffffff; /* 
-  // Base value for token support; should not use in code! */
-  --ds-color-base-white-opacity-40: rgba(255, 255, 255, 0.4); /* white @ 40% */
-  --ds-color-base-black: #000000; /* 
-  // Base value for token support; should not use in code! */
-  --ds-color-base-black-opacity-15: rgba(0, 0, 0, 0.15); /* black @ 15% */
-  --ds-color-state-error-100: #ff999b;
-  --ds-color-state-error-500: #df0b37;
-  --ds-color-state-success-100: #69cf96;
-  --ds-color-state-success-500: #00805d;
-  --ds-color-state-warning-500: #de750c;
-  --ds-color-border-primary-default: #9fabbb;
-  --ds-color-border-active-default: #00cff0;
-  --ds-color-border-error-default: #ff999b;
-  --ds-color-border-disabled-default: #dbdbdb;
-  --ds-color-border-focus-default: #ffffff;
-  --ds-color-border-divider-default: #ffffff;
-  --ds-color-brand-midnight-100: #c1daf0; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-midnight-200: #569ed7; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-midnight-300: #156fad; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-midnight-400: #01426a; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-midnight-500: #00274a; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-atlas-100: #cde6ff; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-atlas-200: #6bb7fb; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-atlas-300: #2492eb; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-atlas-400: #0074c8; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-atlas-500: #054687; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-breeze-100: #c0f7ff; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-breeze-200: #5de3f7; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-breeze-300: #00cff0; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-breeze-400: #099dc5; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-breeze-500: #0b5575; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-tropical-100: #e2ffcd; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-tropical-200: #d0fba6; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-tropical-300: #c0e585; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-tropical-400: #91be62; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-tropical-500: #5e8741; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-alpine-100: #bcaae6; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-alpine-200: #9e73ea; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-alpine-300: #8439ef; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-alpine-400: #631db8; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-alpine-500: #39115c; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-flamingo-100: #ffebee; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-flamingo-200: #ffc0ca; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-flamingo-300: #ff94a7; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-flamingo-400: #f65b7b; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-flamingo-500: #b82b47; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-canyon-100: #ffcab6; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-canyon-200: #f99574; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-canyon-300: #f26135; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-canyon-400: #de3e09; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-canyon-500: #b83302; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-goldcoast-100: #fff0cd; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-goldcoast-200: #ffdb67; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-goldcoast-300: #ffd200; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-goldcoast-400: #e5ad07; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-goldcoast-500: #b88624; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-neutral-100: #f9fbfc; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-neutral-200: #e2eaef; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-neutral-300: #cbd8e2; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-neutral-400: #9fabbb; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-neutral-500: #626b79; /* 
-  // Please consider descriptive token prior to using brand token */
-  --ds-color-brand-gray-100: #f8f8f8;
-  --ds-color-brand-gray-200: #dbdbdb;
-  --ds-color-brand-gray-300: #b2b2b2;
-  --ds-color-brand-gray-400: #767676;
-  --ds-color-brand-gray-500: #222222;
-  --ds-color-brand-goldgray-100: #c5c1bf;
-  --ds-color-brand-goldgray-200: #726e6c;
-  --ds-color-brand-gold-100: #ccbc94;
-  --ds-color-brand-gold-200: #7f682e;
-  --ds-color-brand-emerald: #139142;
-  --ds-color-brand-sapphire: #015daa;
-  --ds-color-brand-ruby: #a41d4a;
-  --ds-color-icon-primary-default: #9fabbb;
-  --ds-color-icon-emphasis-default: #ffffff;
-  --ds-color-icon-accent-default: #00cff0;
-  --ds-color-icon-disabled-default: rgba(255, 255, 255, 0.4);
-  --ds-color-text-primary-default: #ffffff;
-  --ds-color-text-secondary-default: #9fabbb;
-  --ds-color-text-link-default: #00cff0;
-  --ds-color-text-error-default: #ff999b;
-  --ds-color-text-disabled-default: #dbdbdb;
-  --ds-color-text-emphasis-default: #c1daf0;
-  --ds-color-tier-alaska-mvp-default: #c5c1bf;
-  --ds-color-tier-alaska-mvpgold-default: #ccbc94;
-  --ds-color-tier-oneworld-emerald: #139142;
-  --ds-color-tier-oneworld-sapphire: #015daa;
-  --ds-color-tier-oneworld-ruby: #a41d4a;
-  --ds-color-ui-default-default: #00cff0;
-  --ds-color-ui-hover-default: #5de3f7;
-  --ds-color-ui-active-default: #5de3f7;
-  --ds-color-ui-disabled-default: rgba(0, 207, 240, 0.3);
-  --ds-color-ui-bkg-hover-default: rgba(93, 227, 247, 0.1);
-}