@primer/react-brand 0.28.1 → 0.29.0-rc.520f636

package/lib/design-tokens/css/tokens/base/colors/light.css

@@ -0,0 +1,140 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
+ */
+
+:root {
+  --base-color-scale-indigo-9: #191F5C;
+  --base-color-scale-indigo-8: #22297F;
+  --base-color-scale-indigo-7: #2C33A5;
+  --base-color-scale-indigo-6: #3C42D0;
+  --base-color-scale-indigo-5: #545DF0;
+  --base-color-scale-indigo-4: #7683FF;
+  --base-color-scale-indigo-3: #9AA4FF;
+  --base-color-scale-indigo-2: #B9C2FF;
+  --base-color-scale-indigo-1: #D7DDFF;
+  --base-color-scale-indigo-0: #EFF2FF;
+  --base-color-scale-teal-9: #052B2C;
+  --base-color-scale-teal-8: #063A3C;
+  --base-color-scale-teal-7: #024B4D;
+  --base-color-scale-teal-6: #136061;
+  --base-color-scale-teal-5: #197B7B;
+  --base-color-scale-teal-4: #339D9B;
+  --base-color-scale-teal-3: #49BCB7;
+  --base-color-scale-teal-2: #6BD6D0;
+  --base-color-scale-teal-1: #B0EAE3;
+  --base-color-scale-teal-0: #DAF9F5;
+  --base-color-scale-lime-9: #182C01;
+  --base-color-scale-lime-8: #233B03;
+  --base-color-scale-lime-7: #2F4A06;
+  --base-color-scale-lime-6: #425E13;
+  --base-color-scale-lime-5: #5A791B;
+  --base-color-scale-lime-4: #799A2A;
+  --base-color-scale-lime-3: #94B83B;
+  --base-color-scale-lime-2: #B1D353;
+  --base-color-scale-lime-1: #CDEC78;
+  --base-color-scale-lime-0: #EAFABA;
+  --base-color-scale-lemon-9: #322400;
+  --base-color-scale-lemon-8: #413200;
+  --base-color-scale-lemon-7: #534100;
+  --base-color-scale-lemon-6: #685400;
+  --base-color-scale-lemon-5: #866D00;
+  --base-color-scale-lemon-4: #A88D02;
+  --base-color-scale-lemon-3: #C5AA20;
+  --base-color-scale-lemon-2: #DEC741;
+  --base-color-scale-lemon-1: #F4E162;
+  --base-color-scale-lemon-0: #FDF5B3;
+  --base-color-scale-coral-9: #510901;
+  --base-color-scale-coral-8: #691105;
+  --base-color-scale-coral-7: #801f0f;
+  --base-color-scale-coral-6: #9e2f1c;
+  --base-color-scale-coral-5: #c4432b;
+  --base-color-scale-coral-4: #ec6547;
+  --base-color-scale-coral-3: #fd8c73;
+  --base-color-scale-coral-2: #ffb4a1;
+  --base-color-scale-coral-1: #ffd6cc;
+  --base-color-scale-coral-0: #fff0eb;
+  --base-color-scale-pink-9: #4d0336;
+  --base-color-scale-pink-8: #611347;
+  --base-color-scale-pink-7: #772057;
+  --base-color-scale-pink-6: #99286e;
+  --base-color-scale-pink-5: #bf3989;
+  --base-color-scale-pink-4: #e85aad;
+  --base-color-scale-pink-3: #ff80c8;
+  --base-color-scale-pink-2: #ffadda;
+  --base-color-scale-pink-1: #ffd3eb;
+  --base-color-scale-pink-0: #ffeff7;
+  --base-color-scale-purple-9: #2e1461;
+  --base-color-scale-purple-8: #3e1f79;
+  --base-color-scale-purple-7: #512a97;
+  --base-color-scale-purple-6: #6639ba;
+  --base-color-scale-purple-5: #8250df;
+  --base-color-scale-purple-4: #a475f9;
+  --base-color-scale-purple-3: #c297ff;
+  --base-color-scale-purple-2: #d8b9ff;
+  --base-color-scale-purple-1: #ecd8ff;
+  --base-color-scale-purple-0: #fbefff;
+  --base-color-scale-red-9: #4c0014;
+  --base-color-scale-red-8: #660018;
+  --base-color-scale-red-7: #82071e;
+  --base-color-scale-red-6: #a40e26;
+  --base-color-scale-red-5: #cf222e;
+  --base-color-scale-red-4: #fa4549;
+  --base-color-scale-red-3: #ff8182;
+  --base-color-scale-red-2: #ffaba8;
+  --base-color-scale-red-1: #ffcecb;
+  --base-color-scale-red-0: #ffebe9;
+  --base-color-scale-orange-9: #471700;
+  --base-color-scale-orange-8: #5c2200;
+  --base-color-scale-orange-7: #762c00;
+  --base-color-scale-orange-6: #953800;
+  --base-color-scale-orange-5: #bc4c00;
+  --base-color-scale-orange-4: #e16f24;
+  --base-color-scale-orange-3: #fb8f44;
+  --base-color-scale-orange-2: #ffb77c;
+  --base-color-scale-orange-1: #ffd8b5;
+  --base-color-scale-orange-0: #fff1e5;
+  --base-color-scale-yellow-9: #3b2300;
+  --base-color-scale-yellow-8: #4d2d00;
+  --base-color-scale-yellow-7: #633c01;
+  --base-color-scale-yellow-6: #7d4e00;
+  --base-color-scale-yellow-5: #9a6700;
+  --base-color-scale-yellow-4: #bf8700;
+  --base-color-scale-yellow-3: #d4a72c;
+  --base-color-scale-yellow-2: #eac54f;
+  --base-color-scale-yellow-1: #fae17d;
+  --base-color-scale-yellow-0: #fff8c5;
+  --base-color-scale-green-9: #002d11;
+  --base-color-scale-green-8: #003d16;
+  --base-color-scale-green-7: #044f1e;
+  --base-color-scale-green-6: #116329;
+  --base-color-scale-green-5: #1a7f37;
+  --base-color-scale-green-4: #2da44e;
+  --base-color-scale-green-3: #4ac26b;
+  --base-color-scale-green-2: #6fdd8b;
+  --base-color-scale-green-1: #aceebb;
+  --base-color-scale-green-0: #dafbe1;
+  --base-color-scale-blue-9: #002155;
+  --base-color-scale-blue-8: #0a3069;
+  --base-color-scale-blue-7: #033d8b;
+  --base-color-scale-blue-6: #0550ae;
+  --base-color-scale-blue-5: #0969da;
+  --base-color-scale-blue-4: #218bff;
+  --base-color-scale-blue-3: #54aeff;
+  --base-color-scale-blue-2: #80ccff;
+  --base-color-scale-blue-1: #b6e3ff;
+  --base-color-scale-blue-0: #ddf4ff;
+  --base-color-scale-gray-9: #24292f;
+  --base-color-scale-gray-8: #32383f;
+  --base-color-scale-gray-7: #424a53;
+  --base-color-scale-gray-6: #57606a;
+  --base-color-scale-gray-5: #6e7781;
+  --base-color-scale-gray-4: #8c959f;
+  --base-color-scale-gray-3: #afb8c1;
+  --base-color-scale-gray-2: #d0d7de;
+  --base-color-scale-gray-1: #eaeef2;
+  --base-color-scale-gray-0: #f6f8fa;
+  --base-color-scale-white-0: #ffffff;
+  --base-color-scale-transparent: #ffffff00;
+  --base-color-scale-black-0: #1f2328;
+}

package/lib/design-tokens/css/tokens/base/size/size.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/base/typography/typography.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/animation/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/colors/global-with-modes.css

@@ -1,17 +1,17 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,
 [data-color-mode="light"] {
   --brand-color-success-fg: var(--base-color-scale-green-5);
   --brand-color-success-emphasis: var(--base-color-scale-green-4);
-  --brand-color-success-muted: hsl(var(--base-color-scale-green-3-hsl) / 60%);
+  --brand-color-success-muted: #4bc36b99;
   --brand-color-success-subtle: var(--base-color-scale-green-0);
   --brand-color-error-fg: var(--base-color-scale-red-5);
   --brand-color-error-emphasis: var(--base-color-scale-red-5);
-  --brand-color-error-muted: hsl(var(--base-color-scale-red-3-hsl) / 60%);
+  --brand-color-error-muted: #ff878599;
   --brand-color-error-subtle: var(--base-color-scale-red-0);
   --brand-color-accent-primary: var(--base-color-scale-pink-5);
   --brand-color-accent-secondary: var(--base-color-scale-purple-5);
@@ -21,27 +21,27 @@
   --brand-color-text-onEmphasis: var(--base-color-scale-white-0);
   --brand-color-neutral-emphasisPlus: var(--base-color-scale-gray-9);
   --brand-color-neutral-emphasis: var(--base-color-scale-gray-5);
-  --brand-color-neutral-muted: hsl(var(--base-color-scale-gray-3-hsl) / 99.8%);
-  --brand-color-neutral-subtle: hsl(var(--base-color-scale-gray-1-hsl) / 99.5%);
+  --brand-color-neutral-muted: #b7bfc8fe;
+  --brand-color-neutral-subtle: #e9edf1fe;
   --brand-color-canvas-default: var(--base-color-scale-white-0);
   --brand-color-canvas-overlay: var(--base-color-scale-white-0);
   --brand-color-canvas-inset: var(--base-color-scale-gray-0);
   --brand-color-canvas-subtle: var(--base-color-scale-gray-0);
   --brand-color-border-default: var(--base-color-scale-gray-3);
-  --brand-color-border-muted: hsl(var(--base-color-scale-gray-2-hsl) / 99.7%);
-  --brand-color-border-subtle: hsl(var(--base-color-scale-gray-1-hsl) / 99.7%);
+  --brand-color-border-muted: #d3d9dffe;
+  --brand-color-border-subtle: #e9edf1fe;
   --brand-color-focus: var(--base-color-scale-blue-5);
 }
 
 [data-color-mode="dark"] {
   --brand-color-success-fg: var(--base-color-scale-green-3);
   --brand-color-success-emphasis: var(--base-color-scale-green-5);
-  --brand-color-success-muted: hsl(var(--base-color-scale-green-4-hsl) / 60%);
-  --brand-color-success-subtle: hsl(var(--base-color-scale-green-4-hsl) / 85%);
+  --brand-color-success-muted: #2e9e4299;
+  --brand-color-success-subtle: #2e9e42d9;
   --brand-color-error-fg: var(--base-color-scale-red-4);
   --brand-color-error-emphasis: var(--base-color-scale-red-5);
-  --brand-color-error-muted: hsl(var(--base-color-scale-red-4-hsl) / 60%);
-  --brand-color-error-subtle: hsl(var(--base-color-scale-red-4-hsl) / 85%);
+  --brand-color-error-muted: #f8524999;
+  --brand-color-error-subtle: #f85249d9;
   --brand-color-accent-primary: var(--base-color-scale-pink-3);
   --brand-color-accent-secondary: var(--base-color-scale-purple-3);
   --brand-color-text-default: var(--base-color-scale-white-0);
@@ -50,8 +50,8 @@
   --brand-color-text-onEmphasis: var(--base-color-scale-black-0);
   --brand-color-neutral-emphasisPlus: var(--base-color-scale-gray-4);
   --brand-color-neutral-emphasis: var(--base-color-scale-gray-4);
-  --brand-color-neutral-muted: hsl(var(--base-color-scale-gray-4-hsl) / 99.6%);
-  --brand-color-neutral-subtle: hsl(var(--base-color-scale-gray-4-hsl) / 99.9%);
+  --brand-color-neutral-muted: #6e7681fe;
+  --brand-color-neutral-subtle: #6e7681ff;
   --brand-color-canvas-default: var(--base-color-scale-gray-9);
   --brand-color-canvas-overlay: var(--base-color-scale-gray-8);
   --brand-color-canvas-inset: var(--base-color-scale-black-0);

package/lib/design-tokens/css/tokens/functional/colors/global.css

@@ -1,19 +1,19 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {
   --brand-color-focus: var(--base-color-scale-blue-5);
-  --brand-color-border-subtle: hsl(var(--base-color-scale-gray-1-hsl) / 99.7%);
-  --brand-color-border-muted: hsl(var(--base-color-scale-gray-2-hsl) / 99.7%);
+  --brand-color-border-subtle: #e9edf1fe;
+  --brand-color-border-muted: #d3d9dffe;
   --brand-color-border-default: var(--base-color-scale-gray-3);
   --brand-color-canvas-subtle: var(--base-color-scale-gray-0);
   --brand-color-canvas-inset: var(--base-color-scale-gray-0);
   --brand-color-canvas-overlay: var(--base-color-scale-white-0);
   --brand-color-canvas-default: var(--base-color-scale-white-0);
-  --brand-color-neutral-subtle: hsl(var(--base-color-scale-gray-1-hsl) / 99.5%);
-  --brand-color-neutral-muted: hsl(var(--base-color-scale-gray-3-hsl) / 99.8%);
+  --brand-color-neutral-subtle: #e9edf1fe;
+  --brand-color-neutral-muted: #b7bfc8fe;
   --brand-color-neutral-emphasis: var(--base-color-scale-gray-5);
   --brand-color-neutral-emphasisPlus: var(--base-color-scale-gray-9);
   --brand-color-text-onEmphasis: var(--base-color-scale-white-0);
@@ -23,11 +23,11 @@
   --brand-color-accent-secondary: var(--base-color-scale-purple-5);
   --brand-color-accent-primary: var(--base-color-scale-pink-5);
   --brand-color-error-subtle: var(--base-color-scale-red-0);
-  --brand-color-error-muted: hsl(var(--base-color-scale-red-3-hsl) / 60%);
+  --brand-color-error-muted: #ff878599;
   --brand-color-error-emphasis: var(--base-color-scale-red-5);
   --brand-color-error-fg: var(--base-color-scale-red-5);
   --brand-color-success-subtle: var(--base-color-scale-green-0);
-  --brand-color-success-muted: hsl(var(--base-color-scale-green-3-hsl) / 60%);
+  --brand-color-success-muted: #4bc36b99;
   --brand-color-success-emphasis: var(--base-color-scale-green-4);
   --brand-color-success-fg: var(--base-color-scale-green-5);
 }

package/lib/design-tokens/css/tokens/functional/components/accordion/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/action-menu/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/anchor-nav/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/bento/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,
@@ -17,8 +17,8 @@
   --brand-button-primary-fgColor-disabled: var(--base-color-scale-gray-2);
   --brand-button-primary-shadow-active: inset 0px 1px 0px 0px var(--brand-button-primary-borderColor-active);
   --brand-button-secondary-bgColor-rest: transparent;
-  --brand-button-secondary-bgColor-hover: hsl(var(--base-color-scale-gray-3-hsl) / 20%);
-  --brand-button-secondary-bgColor-active: hsl(var(--base-color-scale-gray-3-hsl) / 40%);
+  --brand-button-secondary-bgColor-hover: #b7bfc833;
+  --brand-button-secondary-bgColor-active: #b7bfc866;
   --brand-button-secondary-borderColor-rest: var(--brand-color-border-default);
   --brand-button-secondary-borderColor-hover: var(--base-color-scale-gray-9);
   --brand-button-secondary-borderColor-active: var(--base-color-scale-gray-9);
@@ -44,8 +44,8 @@
   --brand-button-primary-fgColor-disabled: var(--base-color-scale-gray-2);
   --brand-button-primary-shadow-active: inset 0px 1px 0px 0px var(--brand-button-primary-borderColor-active);
   --brand-button-secondary-bgColor-rest: transparent;
-  --brand-button-secondary-bgColor-hover: hsl(var(--base-color-scale-gray-3-hsl) / 20%);
-  --brand-button-secondary-bgColor-active: hsl(var(--base-color-scale-gray-3-hsl) / 40%);
+  --brand-button-secondary-bgColor-hover: #8a939e33;
+  --brand-button-secondary-bgColor-active: #8a939e66;
   --brand-button-secondary-borderColor-rest: var(--brand-color-border-default);
   --brand-button-secondary-borderColor-hover: var(--base-color-scale-white-0);
   --brand-button-secondary-borderColor-active: var(--base-color-scale-white-0);

package/lib/design-tokens/css/tokens/functional/components/card/base.css

@@ -1,11 +1,10 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {
   --brand-Card-animation-easing: var(--brand-animation-easing-default);
   --brand-Card-animation-duration: 600ms;
-  --brand-Card-shadow: 0 3px 2px hsl(var(--base-color-scale-black-0-hsl) / 4%), 0 7px 5px hsl(var(--base-color-scale-black-0-hsl) / 2%), 0 13px 10px hsl(var(--base-color-scale-black-0-hsl) / 2%), 0 22px 17px hsl(var(--base-color-scale-black-0-hsl) / 2%);
   --brand-Card-maxWidth: 26.25rem;
 }

package/lib/design-tokens/css/tokens/functional/components/card/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/card/colors.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/comparison-table/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/comparison-table/comparison-table.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/cta-banner/colors-with-modes.css

@@ -1,15 +1,15 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,
 [data-color-mode="light"] {
-  --brand-CTABanner-shadow-color-start: var(--base-color-scale-green-5-hsl);
-  --brand-CTABanner-shadow-color-end: var(--base-color-scale-blue-5-hsl);
+  --brand-CTABanner-shadow-color-start: var(--base-color-scale-green-5);
+  --brand-CTABanner-shadow-color-end: var(--base-color-scale-blue-5);
 }
 
 [data-color-mode="dark"] {
-  --brand-CTABanner-shadow-color-start: var(--base-color-scale-green-2-hsl);
-  --brand-CTABanner-shadow-color-end: var(--base-color-scale-blue-3-hsl);
+  --brand-CTABanner-shadow-color-start: var(--base-color-scale-green-2);
+  --brand-CTABanner-shadow-color-end: var(--base-color-scale-blue-3);
 }

package/lib/design-tokens/css/tokens/functional/components/faq/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/faq/colors.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/faq/faq.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/footer/colors-with-modes.css

@@ -1,11 +1,11 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,
 [data-color-mode="light"] {
-  --brand-footer-bg-color: var(--base-color-scale-white-0);
+  --brand-footer-bg-color: var(--base-color-scale-white);
 }
 
 [data-color-mode="dark"] {

package/lib/design-tokens/css/tokens/functional/components/footer/colors.css

@@ -1,8 +1,8 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {
-  --brand-footer-bg-color: var(--base-color-scale-white-0);
+  --brand-footer-bg-color: var(--base-color-scale-white);
 }

package/lib/design-tokens/css/tokens/functional/components/grid/colors-with-modes.css

@@ -1,13 +1,13 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,
 [data-color-mode="light"] {
-  --brand-Grid-column-bgColor-overlay: hsl(var(--base-color-scale-red-4-hsl) / 30%);
+  --brand-Grid-column-bgColor-overlay: #fb51544d;
 }
 
 [data-color-mode="dark"] {
-  --brand-Grid-column-bgColor-overlay: hsl(var(--base-color-scale-pink-2-hsl) / 30%);
+  --brand-Grid-column-bgColor-overlay: #fb51544d;
 }

package/lib/design-tokens/css/tokens/functional/components/grid/colors.css

@@ -1,8 +1,8 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {
-  --brand-Grid-column-bgColor-overlay: hsl(var(--base-color-scale-red-4-hsl) / 30%);
+  --brand-Grid-column-bgColor-overlay: #fb51544d;
 }

package/lib/design-tokens/css/tokens/functional/components/grid/grid.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/hero/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/image/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/inline-link/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/inline-link/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/inline-link/colors.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/label/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/label/colors.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/link/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/link/colors.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/logosuite/base.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/logosuite/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:11:00 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,

package/lib/design-tokens/css/tokens/functional/components/logosuite/colors.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:58 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root {

package/lib/design-tokens/css/tokens/functional/components/pillar/colors-with-modes.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 26 Oct 2023 10:10:59 GMT
+ * Generated on Thu, 02 Nov 2023 20:12:18 GMT
  */
 
 :root,