@gainsight-hub/design-tokens 0.2.3 → 0.2.4

package/dist/styles.css

@@ -13,16 +13,16 @@
   /* ───────────────────────────────────────────────────────────────────────── */
 
   /* Brand scale */
-  --theme-brand-100: #E9F2FF;
-  --theme-brand-200: #CCE0FF;
-  --theme-brand-300: #85B8FF;
-  --theme-brand-400: #579DFF;
-  --theme-brand-500: #388BFF;
-  --theme-brand-600: #1D7AFC;
-  --theme-brand-700: #0C66E4;
-  --theme-brand-800: #0055CC;
-  --theme-brand-900: #09326C;
-  --theme-brand-1000: #1C2B41;
+  --theme-brand-100: #F2F0FF;
+  --theme-brand-200: #DCD8FD;
+  --theme-brand-300: #B3ACF6;
+  --theme-brand-400: #978FEF;
+  --theme-brand-500: #877EE7;
+  --theme-brand-600: #7970DB;
+  --theme-brand-700: #645DC6;
+  --theme-brand-800: #544DB2;
+  --theme-brand-900: #2F2C63;
+  --theme-brand-1000: #28273F;
 
   /* Neutral scale */
   --theme-neutral-0: #FFFFFF;
@@ -46,16 +46,16 @@
   /* ───────────────────────────────────────────────────────────────────────── */
 
   /* Color — Brand */
-  --color-brand-100: var(--theme-brand-100, #E9F2FF);
-  --color-brand-200: var(--theme-brand-200, #CCE0FF);
-  --color-brand-300: var(--theme-brand-300, #85B8FF);
-  --color-brand-400: var(--theme-brand-400, #579DFF);
-  --color-brand-500: var(--theme-brand-500, #388BFF);
-  --color-brand-600: var(--theme-brand-600, #1D7AFC);
-  --color-brand-700: var(--theme-brand-700, #0C66E4);
-  --color-brand-800: var(--theme-brand-800, #0055CC);
-  --color-brand-900: var(--theme-brand-900, #09326C);
-  --color-brand-1000: var(--theme-brand-1000, #1C2B41);
+  --color-brand-100: var(--theme-brand-100, #F2F0FF);
+  --color-brand-200: var(--theme-brand-200, #DCD8FD);
+  --color-brand-300: var(--theme-brand-300, #B3ACF6);
+  --color-brand-400: var(--theme-brand-400, #978FEF);
+  --color-brand-500: var(--theme-brand-500, #877EE7);
+  --color-brand-600: var(--theme-brand-600, #7970DB);
+  --color-brand-700: var(--theme-brand-700, #645DC6);
+  --color-brand-800: var(--theme-brand-800, #544DB2);
+  --color-brand-900: var(--theme-brand-900, #2F2C63);
+  --color-brand-1000: var(--theme-brand-1000, #28273F);
 
   /* Color — Neutral */
   --color-neutral-a100: rgba(43, 51, 70, 0.04);
@@ -107,7 +107,7 @@
   --color-red-500: #f15050;
   --color-red-600: #e23d3d;
   --color-red-700: #c92c2f;
-  --color-red-800: #ae2426;
+  --color-red-800: #ae2424;
   --color-red-900: #5d1a1c;
   --color-red-1000: #421f21;
 
@@ -189,11 +189,11 @@
 
   /* Color — Action */
   --color-action-destructive-default: var(--color-red-700, #c92c2f); /** color used for actions that perform irreversible or potentially harmful operations */
-  --color-action-destructive-hover: var(--color-red-800, #ae2426); /** color used when a destructive action is hovered */
+  --color-action-destructive-hover: var(--color-red-800, #ae2424); /** color used when a destructive action is hovered */
   --color-action-destructive-pressed: var(--color-red-900, #5d1a1c); /** color used when a destructive action is actively pressed */
-  --color-action-primary-default: var(--color-brand-700, #0C66E4); /** default color used for the most prominent call-to-action in the interface */
-  --color-action-primary-hover: var(--color-brand-800, #0055CC); /** color used when a primary action is hovered */
-  --color-action-primary-pressed: var(--color-brand-900, #09326C); /** color used when a primary action is actively pressed */
+  --color-action-primary-default: var(--color-brand-700, #645DC6); /** default color used for the most prominent call-to-action in the interface */
+  --color-action-primary-hover: var(--color-brand-800, #544DB2); /** color used when a primary action is hovered */
+  --color-action-primary-pressed: var(--color-brand-900, #2F2C63); /** color used when a primary action is actively pressed */
   --color-action-neutral-default: var(--color-neutral-0, #FFFFFF); /** color used for less prominent actions that support the primary action */
   --color-action-neutral-hover: var(--color-neutral-100, #FAFAFA); /** color used when a secondary action is hovered */
   --color-action-neutral-pressed: var(--color-neutral-200, #F4F5F6); /** color used when a secondary action is actively pressed */
@@ -225,8 +225,8 @@
   --color-status-danger-bold: var(--color-red-700, #c92c2f); /** high-emphasis color used for neutral informational messages */
 
   /* Color — Link */
-  --color-link-default: var(--color-brand-700, #0C66E4); /** default color used for interactive text links */
-  --color-link-hover: var(--color-brand-800, #0055CC); /** color used for interactive text links on hover */
+  --color-link-default: var(--color-brand-700, #645DC6); /** default color used for interactive text links */
+  --color-link-hover: var(--color-brand-800, #544DB2); /** color used for interactive text links on hover */
 
   /* Color — Focus */
   --color-focus-ring: var(--color-blue-500, #388bff); /** default color used for focus rings on interactive elements */
@@ -243,8 +243,8 @@
   /* Color — Community */
   --color-community-answered: var(--color-green-700, #1f8444); /** color used to indicate that a question or thread has received an accepted answer */
   --color-community-unanswered: var(--color-neutral-700, #696E7C); /** color used to indicate that a question or thread has not yet received a response */
-  --color-community-highlighted: var(--color-brand-700, #0C66E4); /** color used to highlight content that is featured or editorially promoted */
-  --color-community-pinned: var(--color-brand-700, #0C66E4); /** color used to indicate content that is pinned and prioritized in listings */
+  --color-community-highlighted: var(--color-brand-700, #645DC6); /** color used to highlight content that is featured or editorially promoted */
+  --color-community-pinned: var(--color-brand-700, #645DC6); /** color used to indicate content that is pinned and prioritized in listings */
 
   /* Typography */
   --text-hero-font-weight: var(--font-weight-bold, 700);
@@ -335,7 +335,7 @@
   --button-destructive-background-default: var(--color-action-destructive-default, #c92c2f); /** Destructive button background in default state. */
   --button-destructive-background-hover: color-mix(in oklch, var(--button-destructive-background-default) 85%, black); /** Destructive button background on hover. */
   --button-destructive-background-pressed: color-mix(in oklch, var(--button-destructive-background-default) 70%, black); /** Destructive button background on press. */
-  --button-primary-background-default: var(--color-action-primary-default, #0C66E4); /** Primary button background in default state. */
+  --button-primary-background-default: var(--color-action-primary-default, #645DC6); /** Primary button background in default state. */
   --button-primary-background-hover: color-mix(in oklch, var(--button-primary-background-default) 85%, black); /** Primary button background on hover. */
   --button-primary-background-pressed: color-mix(in oklch, var(--button-primary-background-default) 70%, black); /** Primary button background on press. */
   --button-primary-content-default: var(--color-content-inverse, #FFFFFF); /** Primary button label/icon color in default state. */
@@ -362,7 +362,7 @@
   --button-vote-border-default: var(--color-line-default, #DEDFE2); /** Vote button border color in default state. */
   --button-vote-border-hover: var(--color-line-default, #DEDFE2); /** Vote button border color on hover. */
   --button-vote-border-pressed: var(--color-line-default, #DEDFE2); /** Vote button border color on press. */
-  --button-vote-selected-background-default: var(--color-action-primary-default, #0C66E4); /** Vote button background when selected (default). */
+  --button-vote-selected-background-default: var(--color-action-primary-default, #645DC6); /** Vote button background when selected (default). */
   --button-vote-selected-background-hover: color-mix(in oklch, var(--button-vote-selected-background-default) 85%, black); /** Vote button background when selected (hovered). */
   --button-vote-selected-background-pressed: color-mix(in oklch, var(--button-vote-selected-background-default) 70%, black); /** Vote button background when selected (pressed). */
   --button-vote-selected-content-default: var(--color-content-inverse, #FFFFFF); /** Vote button content color when selected (default). */
@@ -382,11 +382,11 @@
   --card-background-hover: color-mix(in oklch, var(--card-background-default) 85%, black); /** Card background on hover. */
   --card-background-pressed: color-mix(in oklch, var(--card-background-default) 70%, black); /** Card background on press. */
   --card-title-default: var(--color-content-heading-default, #2B3346); /** Card title color in default state. */
-  --card-title-hover: var(--color-link-default, #0C66E4); /** Card title color on hover (link styling). */
+  --card-title-hover: var(--color-link-default, #645DC6); /** Card title color on hover (link styling). */
   --card-title-pressed: var(--color-content-heading-default, #2B3346); /** Card title color on press. */
   --card-content-default: var(--color-content-default, #2B3346); /** Card body/content color in default state. */
   --card-content-hover: var(--color-content-default, #2B3346); /** Card body/content color on hover. */
-  --card-content-pressed: var(--color-link-hover, #0055CC); /** Card body/content color on press (link hovered styling). */
+  --card-content-pressed: var(--color-link-hover, #544DB2); /** Card body/content color on press (link hovered styling). */
 
   /* Sidebar */
   --sidebar-shadow: none; /** Sidebar widget placeholder box shadow. */
@@ -416,11 +416,11 @@
   --feed-item-background-hover: color-mix(in oklch, var(--feed-item-background-default) 85%, black); /** Feed item background on hover. */
   --feed-item-background-pressed: color-mix(in oklch, var(--feed-item-background-default) 70%, black); /** Feed item background on press. */
   --feed-item-title-default: var(--color-content-heading-default, #2B3346); /** Feed item title color in default state. */
-  --feed-item-title-hover: var(--color-link-default, #0C66E4); /** Feed item title color on hover (link styling). */
-  --feed-item-title-pressed: var(--color-link-hover, #0055CC); /** Feed item title color on press (link hovered styling). */
+  --feed-item-title-hover: var(--color-link-default, #645DC6); /** Feed item title color on hover (link styling). */
+  --feed-item-title-pressed: var(--color-link-hover, #544DB2); /** Feed item title color on press (link hovered styling). */
   --feed-item-content-default: var(--color-content-default, #2B3346); /** Feed item content color in default state. */
   --feed-item-content-hover: var(--color-content-default, #2B3346); /** Feed item content color on hover. */
-  --feed-item-content-pressed: var(--color-link-hover, #0055CC); /** Feed item content color on press (link hovered styling). */
+  --feed-item-content-pressed: var(--color-link-hover, #544DB2); /** Feed item content color on press (link hovered styling). */
 
   /* Navigation */
   --navigation-border-top: rgba(0, 0, 0, 0); /** Top border of navigation (transparent). */

package/dist/token-catalog.json

@@ -1,6 +1,6 @@
 {
   "version": "0.1.0",
-  "generatedAt": "2026-06-25T08:19:53.916Z",
+  "generatedAt": "2026-06-30T06:28:56.777Z",
   "scales": {
     "brand": {
       "seedVar": "--theme-brand-700",
@@ -9,52 +9,52 @@
         {
           "step": "100",
           "cssVar": "--theme-brand-100",
-          "value": "#E9F2FF"
+          "value": "#F2F0FF"
         },
         {
           "step": "200",
           "cssVar": "--theme-brand-200",
-          "value": "#CCE0FF"
+          "value": "#DCD8FD"
         },
         {
           "step": "300",
           "cssVar": "--theme-brand-300",
-          "value": "#85B8FF"
+          "value": "#B3ACF6"
         },
         {
           "step": "400",
           "cssVar": "--theme-brand-400",
-          "value": "#579DFF"
+          "value": "#978FEF"
         },
         {
           "step": "500",
           "cssVar": "--theme-brand-500",
-          "value": "#388BFF"
+          "value": "#877EE7"
         },
         {
           "step": "600",
           "cssVar": "--theme-brand-600",
-          "value": "#1D7AFC"
+          "value": "#7970DB"
         },
         {
           "step": "700",
           "cssVar": "--theme-brand-700",
-          "value": "#0C66E4"
+          "value": "#645DC6"
         },
         {
           "step": "800",
           "cssVar": "--theme-brand-800",
-          "value": "#0055CC"
+          "value": "#544DB2"
         },
         {
           "step": "900",
           "cssVar": "--theme-brand-900",
-          "value": "#09326C"
+          "value": "#2F2C63"
         },
         {
           "step": "1000",
           "cssVar": "--theme-brand-1000",
-          "value": "#1C2B41"
+          "value": "#28273F"
         }
       ]
     },
@@ -126,7 +126,7 @@
         "cssVar": "--color-action-primary-default",
         "path": "color.action.primary.default",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "default color used for the most prominent call-to-action in the interface",
         "references": "color.brand.700",
         "derivedFrom": "brand",
@@ -136,7 +136,7 @@
         "cssVar": "--color-action-primary-hover",
         "path": "color.action.primary.hover",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "color used when a primary action is hovered",
         "references": "color.brand.800",
         "derivedFrom": "brand",
@@ -146,7 +146,7 @@
         "cssVar": "--color-action-primary-pressed",
         "path": "color.action.primary.pressed",
         "type": "color",
-        "value": "#09326C",
+        "value": "#2F2C63",
         "description": "color used when a primary action is actively pressed",
         "references": "color.brand.900",
         "derivedFrom": "brand",
@@ -156,7 +156,7 @@
         "cssVar": "--color-community-highlighted",
         "path": "color.community.highlighted",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "color used to highlight content that is featured or editorially promoted",
         "references": "color.brand.700",
         "derivedFrom": "brand",
@@ -166,7 +166,7 @@
         "cssVar": "--color-community-pinned",
         "path": "color.community.pinned",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "color used to indicate content that is pinned and prioritized in listings",
         "references": "color.brand.700",
         "derivedFrom": "brand",
@@ -176,7 +176,7 @@
         "cssVar": "--color-link-default",
         "path": "color.link.default",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "default color used for interactive text links",
         "references": "color.brand.700",
         "derivedFrom": "brand",
@@ -186,7 +186,7 @@
         "cssVar": "--color-link-hover",
         "path": "color.link.hover",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "color used for interactive text links on hover",
         "references": "color.brand.800",
         "derivedFrom": "brand",
@@ -450,7 +450,7 @@
         "cssVar": "--color-action-destructive-hover",
         "path": "color.action.destructive.hover",
         "type": "color",
-        "value": "#ae2426",
+        "value": "#ae2424",
         "description": "color used when a destructive action is hovered",
         "references": "color.red.800",
         "derivedFrom": "status",
@@ -1082,7 +1082,7 @@
         "cssVar": "--button-primary-background-default",
         "path": "button.primary.background.default",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "Primary button background in default state.",
         "references": "color.action.primary.default",
         "derivedFrom": "action",
@@ -1092,7 +1092,7 @@
         "cssVar": "--button-primary-background-hover",
         "path": "button.primary.background.hover",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "Primary button background on hover.",
         "references": "color.action.primary.hover",
         "derivedFrom": "action",
@@ -1102,7 +1102,7 @@
         "cssVar": "--button-primary-background-pressed",
         "path": "button.primary.background.pressed",
         "type": "color",
-        "value": "#09326C",
+        "value": "#2F2C63",
         "description": "Primary button background on press.",
         "references": "color.action.primary.pressed",
         "derivedFrom": "action",
@@ -1292,7 +1292,7 @@
         "cssVar": "--button-destructive-background-hover",
         "path": "button.destructive.background.hover",
         "type": "color",
-        "value": "#ae2426",
+        "value": "#ae2424",
         "description": "Destructive button background on hover.",
         "references": "color.action.destructive.hover",
         "derivedFrom": "action",
@@ -1502,7 +1502,7 @@
         "cssVar": "--button-vote-selected-background-default",
         "path": "button.vote.selected.background.default",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "Vote button background when selected (default).",
         "references": "color.action.primary.default",
         "derivedFrom": "action",
@@ -1512,7 +1512,7 @@
         "cssVar": "--button-vote-selected-background-hover",
         "path": "button.vote.selected.background.hover",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "Vote button background when selected (hovered).",
         "references": "color.action.primary.hover",
         "derivedFrom": "action",
@@ -1522,7 +1522,7 @@
         "cssVar": "--button-vote-selected-background-pressed",
         "path": "button.vote.selected.background.pressed",
         "type": "color",
-        "value": "#09326C",
+        "value": "#2F2C63",
         "description": "Vote button background when selected (pressed).",
         "references": "color.action.primary.pressed",
         "derivedFrom": "action",
@@ -1714,7 +1714,7 @@
         "cssVar": "--card-title-hover",
         "path": "card.title.hover",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "Card title color on hover (link styling).",
         "references": "color.link.default",
         "derivedFrom": "link",
@@ -1754,7 +1754,7 @@
         "cssVar": "--card-content-pressed",
         "path": "card.content.pressed",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "Card body/content color on press (link hovered styling).",
         "references": "color.link.hover",
         "derivedFrom": "link",
@@ -1936,7 +1936,7 @@
         "cssVar": "--feed-item-title-hover",
         "path": "feed.item.title.hover",
         "type": "color",
-        "value": "#0C66E4",
+        "value": "#645DC6",
         "description": "Feed item title color on hover (link styling).",
         "references": "color.link.default",
         "derivedFrom": "link",
@@ -1946,7 +1946,7 @@
         "cssVar": "--feed-item-title-pressed",
         "path": "feed.item.title.pressed",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "Feed item title color on press (link hovered styling).",
         "references": "color.link.hover",
         "derivedFrom": "link",
@@ -1976,7 +1976,7 @@
         "cssVar": "--feed-item-content-pressed",
         "path": "feed.item.content.pressed",
         "type": "color",
-        "value": "#0055CC",
+        "value": "#544DB2",
         "description": "Feed item content color on press (link hovered styling).",
         "references": "color.link.hover",
         "derivedFrom": "link",
@@ -2819,7 +2819,7 @@
       "cssVar": "--color-action-primary-default",
       "path": "color.action.primary.default",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "default color used for the most prominent call-to-action in the interface",
       "references": "color.brand.700",
       "derivedFrom": "brand",
@@ -2829,7 +2829,7 @@
       "cssVar": "--color-action-primary-hover",
       "path": "color.action.primary.hover",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "color used when a primary action is hovered",
       "references": "color.brand.800",
       "derivedFrom": "brand",
@@ -2839,7 +2839,7 @@
       "cssVar": "--color-action-primary-pressed",
       "path": "color.action.primary.pressed",
       "type": "color",
-      "value": "#09326C",
+      "value": "#2F2C63",
       "description": "color used when a primary action is actively pressed",
       "references": "color.brand.900",
       "derivedFrom": "brand",
@@ -2889,7 +2889,7 @@
       "cssVar": "--color-action-destructive-hover",
       "path": "color.action.destructive.hover",
       "type": "color",
-      "value": "#ae2426",
+      "value": "#ae2424",
       "description": "color used when a destructive action is hovered",
       "references": "color.red.800",
       "derivedFrom": "status",
@@ -3109,7 +3109,7 @@
       "cssVar": "--color-community-highlighted",
       "path": "color.community.highlighted",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "color used to highlight content that is featured or editorially promoted",
       "references": "color.brand.700",
       "derivedFrom": "brand",
@@ -3119,7 +3119,7 @@
       "cssVar": "--color-community-pinned",
       "path": "color.community.pinned",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "color used to indicate content that is pinned and prioritized in listings",
       "references": "color.brand.700",
       "derivedFrom": "brand",
@@ -3129,7 +3129,7 @@
       "cssVar": "--color-link-default",
       "path": "color.link.default",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "default color used for interactive text links",
       "references": "color.brand.700",
       "derivedFrom": "brand",
@@ -3139,7 +3139,7 @@
       "cssVar": "--color-link-hover",
       "path": "color.link.hover",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "color used for interactive text links on hover",
       "references": "color.brand.800",
       "derivedFrom": "brand",
@@ -3759,7 +3759,7 @@
       "cssVar": "--button-primary-background-default",
       "path": "button.primary.background.default",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "Primary button background in default state.",
       "references": "color.action.primary.default",
       "derivedFrom": "action",
@@ -3769,7 +3769,7 @@
       "cssVar": "--button-primary-background-hover",
       "path": "button.primary.background.hover",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "Primary button background on hover.",
       "references": "color.action.primary.hover",
       "derivedFrom": "action",
@@ -3779,7 +3779,7 @@
       "cssVar": "--button-primary-background-pressed",
       "path": "button.primary.background.pressed",
       "type": "color",
-      "value": "#09326C",
+      "value": "#2F2C63",
       "description": "Primary button background on press.",
       "references": "color.action.primary.pressed",
       "derivedFrom": "action",
@@ -3969,7 +3969,7 @@
       "cssVar": "--button-destructive-background-hover",
       "path": "button.destructive.background.hover",
       "type": "color",
-      "value": "#ae2426",
+      "value": "#ae2424",
       "description": "Destructive button background on hover.",
       "references": "color.action.destructive.hover",
       "derivedFrom": "action",
@@ -4179,7 +4179,7 @@
       "cssVar": "--button-vote-selected-background-default",
       "path": "button.vote.selected.background.default",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "Vote button background when selected (default).",
       "references": "color.action.primary.default",
       "derivedFrom": "action",
@@ -4189,7 +4189,7 @@
       "cssVar": "--button-vote-selected-background-hover",
       "path": "button.vote.selected.background.hover",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "Vote button background when selected (hovered).",
       "references": "color.action.primary.hover",
       "derivedFrom": "action",
@@ -4199,7 +4199,7 @@
       "cssVar": "--button-vote-selected-background-pressed",
       "path": "button.vote.selected.background.pressed",
       "type": "color",
-      "value": "#09326C",
+      "value": "#2F2C63",
       "description": "Vote button background when selected (pressed).",
       "references": "color.action.primary.pressed",
       "derivedFrom": "action",
@@ -4389,7 +4389,7 @@
       "cssVar": "--card-title-hover",
       "path": "card.title.hover",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "Card title color on hover (link styling).",
       "references": "color.link.default",
       "derivedFrom": "link",
@@ -4429,7 +4429,7 @@
       "cssVar": "--card-content-pressed",
       "path": "card.content.pressed",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "Card body/content color on press (link hovered styling).",
       "references": "color.link.hover",
       "derivedFrom": "link",
@@ -4609,7 +4609,7 @@
       "cssVar": "--feed-item-title-hover",
       "path": "feed.item.title.hover",
       "type": "color",
-      "value": "#0C66E4",
+      "value": "#645DC6",
       "description": "Feed item title color on hover (link styling).",
       "references": "color.link.default",
       "derivedFrom": "link",
@@ -4619,7 +4619,7 @@
       "cssVar": "--feed-item-title-pressed",
       "path": "feed.item.title.pressed",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "Feed item title color on press (link hovered styling).",
       "references": "color.link.hover",
       "derivedFrom": "link",
@@ -4649,7 +4649,7 @@
       "cssVar": "--feed-item-content-pressed",
       "path": "feed.item.content.pressed",
       "type": "color",
-      "value": "#0055CC",
+      "value": "#544DB2",
       "description": "Feed item content color on press (link hovered styling).",
       "references": "color.link.hover",
       "derivedFrom": "link",

package/dist/tokens.js

@@ -4,16 +4,16 @@
 
 export const BorderWidth100 = "1px";
 export const BorderWidth200 = "2px";
-export const ColorBrand100 = "#E9F2FF";
-export const ColorBrand200 = "#CCE0FF";
-export const ColorBrand300 = "#85B8FF";
-export const ColorBrand400 = "#579DFF";
-export const ColorBrand500 = "#388BFF";
-export const ColorBrand600 = "#1D7AFC";
-export const ColorBrand700 = "#0C66E4";
-export const ColorBrand800 = "#0055CC";
-export const ColorBrand900 = "#09326C";
-export const ColorBrand1000 = "#1C2B41";
+export const ColorBrand100 = "#F2F0FF";
+export const ColorBrand200 = "#DCD8FD";
+export const ColorBrand300 = "#B3ACF6";
+export const ColorBrand400 = "#978FEF";
+export const ColorBrand500 = "#877EE7";
+export const ColorBrand600 = "#7970DB";
+export const ColorBrand700 = "#645DC6";
+export const ColorBrand800 = "#544DB2";
+export const ColorBrand900 = "#2F2C63";
+export const ColorBrand1000 = "#28273F";
 export const ColorNeutral0 = "#FFFFFF";
 export const ColorNeutral100 = "#FAFAFA";
 export const ColorNeutral200 = "#F4F5F6";
@@ -57,7 +57,7 @@ export const ColorRed400 = "#f86a68";
 export const ColorRed500 = "#f15050";
 export const ColorRed600 = "#e23d3d";
 export const ColorRed700 = "#c92c2f";
-export const ColorRed800 = "#ae2426";
+export const ColorRed800 = "#ae2424";
 export const ColorRed900 = "#5d1a1c";
 export const ColorRed1000 = "#421f21";
 export const ColorYellow100 = "#fff7d6";
@@ -70,14 +70,14 @@ export const ColorYellow700 = "#946f00";
 export const ColorYellow800 = "#7f5f01";
 export const ColorYellow900 = "#533f04";
 export const ColorYellow1000 = "#332e1b";
-export const ColorActionPrimaryDefault = "#0C66E4"; // default color used for the most prominent call-to-action in the interface
-export const ColorActionPrimaryHover = "#0055CC"; // color used when a primary action is hovered
-export const ColorActionPrimaryPressed = "#09326C"; // color used when a primary action is actively pressed
+export const ColorActionPrimaryDefault = "#645DC6"; // default color used for the most prominent call-to-action in the interface
+export const ColorActionPrimaryHover = "#544DB2"; // color used when a primary action is hovered
+export const ColorActionPrimaryPressed = "#2F2C63"; // color used when a primary action is actively pressed
 export const ColorActionNeutralDefault = "#FFFFFF"; // color used for less prominent actions that support the primary action
 export const ColorActionNeutralHover = "#FAFAFA"; // color used when a secondary action is hovered
 export const ColorActionNeutralPressed = "#F4F5F6"; // color used when a secondary action is actively pressed
 export const ColorActionDestructiveDefault = "#c92c2f"; // color used for actions that perform irreversible or potentially harmful operations
-export const ColorActionDestructiveHover = "#ae2426"; // color used when a destructive action is hovered
+export const ColorActionDestructiveHover = "#ae2424"; // color used when a destructive action is hovered
 export const ColorActionDestructivePressed = "#5d1a1c"; // color used when a destructive action is actively pressed
 export const ColorSurfacePage = "#FAFAFA"; // application canvas background used behind all UI surfaces
 export const ColorSurfaceDefault = "#FFFFFF"; // default container surface for standard UI sections (cards, panels, content areas)
@@ -99,10 +99,10 @@ export const ColorStatusInformationBold = "#0c66e4"; // high-emphasis color used
 export const ColorStatusDangerBold = "#c92c2f"; // high-emphasis color used for neutral informational messages
 export const ColorCommunityAnswered = "#1f8444"; // color used to indicate that a question or thread has received an accepted answer
 export const ColorCommunityUnanswered = "#696E7C"; // color used to indicate that a question or thread has not yet received a response
-export const ColorCommunityHighlighted = "#0C66E4"; // color used to highlight content that is featured or editorially promoted
-export const ColorCommunityPinned = "#0C66E4"; // color used to indicate content that is pinned and prioritized in listings
-export const ColorLinkDefault = "#0C66E4"; // default color used for interactive text links
-export const ColorLinkHover = "#0055CC"; // color used for interactive text links on hover
+export const ColorCommunityHighlighted = "#645DC6"; // color used to highlight content that is featured or editorially promoted
+export const ColorCommunityPinned = "#645DC6"; // color used to indicate content that is pinned and prioritized in listings
+export const ColorLinkDefault = "#645DC6"; // default color used for interactive text links
+export const ColorLinkHover = "#544DB2"; // color used for interactive text links on hover
 export const ColorFocusRing = "#388bff"; // default color used for focus rings on interactive elements
 export const ColorOverlayBackdrop = "#2b33467a"; // semi-transparent color displayed behind modals to obscure background content
 export const ColorOverlayInteractiveHover = "#2b33460a"; // overlay color applied to interactive elements to indicate a hover state
@@ -216,9 +216,9 @@ export const ButtonRadius = "8px"; // Border radius used for all button variants
 export const ButtonBorderWidth = "1px"; // Border width used for all button variants.
 export const ButtonFontWeight = 500; // Font weight used for button labels across all variants.
 export const ButtonTextTransform = "none"; // Text transform applied to button labels (e.g., none/uppercase).
-export const ButtonPrimaryBackgroundDefault = "#0C66E4"; // Primary button background in default state.
-export const ButtonPrimaryBackgroundHover = "#0055CC"; // Primary button background on hover.
-export const ButtonPrimaryBackgroundPressed = "#09326C"; // Primary button background on press.
+export const ButtonPrimaryBackgroundDefault = "#645DC6"; // Primary button background in default state.
+export const ButtonPrimaryBackgroundHover = "#544DB2"; // Primary button background on hover.
+export const ButtonPrimaryBackgroundPressed = "#2F2C63"; // Primary button background on press.
 export const ButtonPrimaryContentDefault = "#FFFFFF"; // Primary button label/icon color in default state.
 export const ButtonPrimaryContentHover = "#FFFFFF"; // Primary button label/icon color on hover.
 export const ButtonPrimaryContentPressed = "#FFFFFF"; // Primary button label/icon color on press.
@@ -237,7 +237,7 @@ export const ButtonSecondaryBorderHover = "#DEDFE2"; // Secondary button border
 export const ButtonSecondaryBorderPressed = "#DEDFE2"; // Secondary button border color on press.
 export const ButtonSecondaryShadow = "none"; // Secondary button shadow (none).
 export const ButtonDestructiveBackgroundDefault = "#c92c2f"; // Destructive button background in default state.
-export const ButtonDestructiveBackgroundHover = "#ae2426"; // Destructive button background on hover.
+export const ButtonDestructiveBackgroundHover = "#ae2424"; // Destructive button background on hover.
 export const ButtonDestructiveBackgroundPressed = "#5d1a1c"; // Destructive button background on press.
 export const ButtonDestructiveContentDefault = "#FFFFFF"; // Destructive button label/icon color in default state.
 export const ButtonDestructiveContentHover = "#FFFFFF"; // Destructive button label/icon color on hover.
@@ -258,9 +258,9 @@ export const ButtonVoteBorderPressed = "#DEDFE2"; // Vote button border color on
 export const ButtonVoteShadowDefault = "none"; // Vote button shadow in default state (none).
 export const ButtonVoteShadowHover = "none"; // Vote button shadow on hover (none).
 export const ButtonVoteShadowPressed = "none"; // Vote button shadow on press (none).
-export const ButtonVoteSelectedBackgroundDefault = "#0C66E4"; // Vote button background when selected (default).
-export const ButtonVoteSelectedBackgroundHover = "#0055CC"; // Vote button background when selected (hovered).
-export const ButtonVoteSelectedBackgroundPressed = "#09326C"; // Vote button background when selected (pressed).
+export const ButtonVoteSelectedBackgroundDefault = "#645DC6"; // Vote button background when selected (default).
+export const ButtonVoteSelectedBackgroundHover = "#544DB2"; // Vote button background when selected (hovered).
+export const ButtonVoteSelectedBackgroundPressed = "#2F2C63"; // Vote button background when selected (pressed).
 export const ButtonVoteSelectedContentDefault = "#FFFFFF"; // Vote button content color when selected (default).
 export const ButtonVoteSelectedContentHover = "#FFFFFF"; // Vote button content color when selected (hovered).
 export const ButtonVoteSelectedContentPressed = "#FFFFFF"; // Vote button content color when selected (pressed).
@@ -279,11 +279,11 @@ export const CardBackgroundDefault = "#FFFFFF"; // Card background in default st
 export const CardBackgroundHover = "#FFFFFF"; // Card background on hover.
 export const CardBackgroundPressed = "#FFFFFF"; // Card background on press.
 export const CardTitleDefault = "#2B3346"; // Card title color in default state.
-export const CardTitleHover = "#0C66E4"; // Card title color on hover (link styling).
+export const CardTitleHover = "#645DC6"; // Card title color on hover (link styling).
 export const CardTitlePressed = "#2B3346"; // Card title color on press.
 export const CardContentDefault = "#2B3346"; // Card body/content color in default state.
 export const CardContentHover = "#2B3346"; // Card body/content color on hover.
-export const CardContentPressed = "#0055CC"; // Card body/content color on press (link hovered styling).
+export const CardContentPressed = "#544DB2"; // Card body/content color on press (link hovered styling).
 export const CardShadowDefault = "none"; // Card shadow in default state (none).
 export const CardShadowHover =
   "0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1)"; // Card shadow on hover.
@@ -303,11 +303,11 @@ export const FeedItemBackgroundDefault = "#FFFFFF"; // Feed item background in d
 export const FeedItemBackgroundHover = "#FFFFFF"; // Feed item background on hover.
 export const FeedItemBackgroundPressed = "#FFFFFF"; // Feed item background on press.
 export const FeedItemTitleDefault = "#2B3346"; // Feed item title color in default state.
-export const FeedItemTitleHover = "#0C66E4"; // Feed item title color on hover (link styling).
-export const FeedItemTitlePressed = "#0055CC"; // Feed item title color on press (link hovered styling).
+export const FeedItemTitleHover = "#645DC6"; // Feed item title color on hover (link styling).
+export const FeedItemTitlePressed = "#544DB2"; // Feed item title color on press (link hovered styling).
 export const FeedItemContentDefault = "#2B3346"; // Feed item content color in default state.
 export const FeedItemContentHover = "#2B3346"; // Feed item content color on hover.
-export const FeedItemContentPressed = "#0055CC"; // Feed item content color on press (link hovered styling).
+export const FeedItemContentPressed = "#544DB2"; // Feed item content color on press (link hovered styling).
 export const FeedItemShadowDefault = "none"; // Feed item shadow in default state (none).
 export const FeedItemShadowHover =
   "0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1)"; // Feed item shadow on hover.
@@ -343,16 +343,16 @@ export const WidgetIntroductionContent = "#2B3346"; // Introduction widget body/
 export const WidgetIntroductionIconBackground = "#1f8444"; // Introduction widget icon container background.
 export const WidgetIntroductionIconContent = "#FFFFFF"; // Introduction widget icon color.
 export const WidgetIntroductionCloseContent = "#696E7C"; // Introduction widget close button color.
-export const ThemeBrand100 = "#E9F2FF";
-export const ThemeBrand200 = "#CCE0FF";
-export const ThemeBrand300 = "#85B8FF";
-export const ThemeBrand400 = "#579DFF";
-export const ThemeBrand500 = "#388BFF";
-export const ThemeBrand600 = "#1D7AFC";
-export const ThemeBrand700 = "#0C66E4";
-export const ThemeBrand800 = "#0055CC";
-export const ThemeBrand900 = "#09326C";
-export const ThemeBrand1000 = "#1C2B41";
+export const ThemeBrand100 = "#F2F0FF";
+export const ThemeBrand200 = "#DCD8FD";
+export const ThemeBrand300 = "#B3ACF6";
+export const ThemeBrand400 = "#978FEF";
+export const ThemeBrand500 = "#877EE7";
+export const ThemeBrand600 = "#7970DB";
+export const ThemeBrand700 = "#645DC6";
+export const ThemeBrand800 = "#544DB2";
+export const ThemeBrand900 = "#2F2C63";
+export const ThemeBrand1000 = "#28273F";
 export const ThemeNeutral0 = "#FFFFFF";
 export const ThemeNeutral100 = "#FAFAFA";
 export const ThemeNeutral200 = "#F4F5F6";

package/dist/tokens.json

@@ -7,16 +7,16 @@
   },
   "color": {
     "brand": {
-      "100": "#E9F2FF",
-      "200": "#CCE0FF",
-      "300": "#85B8FF",
-      "400": "#579DFF",
-      "500": "#388BFF",
-      "600": "#1D7AFC",
-      "700": "#0C66E4",
-      "800": "#0055CC",
-      "900": "#09326C",
-      "1000": "#1C2B41"
+      "100": "#F2F0FF",
+      "200": "#DCD8FD",
+      "300": "#B3ACF6",
+      "400": "#978FEF",
+      "500": "#877EE7",
+      "600": "#7970DB",
+      "700": "#645DC6",
+      "800": "#544DB2",
+      "900": "#2F2C63",
+      "1000": "#28273F"
     },
     "neutral": {
       "0": "#FFFFFF",
@@ -68,7 +68,7 @@
       "500": "#f15050",
       "600": "#e23d3d",
       "700": "#c92c2f",
-      "800": "#ae2426",
+      "800": "#ae2424",
       "900": "#5d1a1c",
       "1000": "#421f21"
     },
@@ -86,9 +86,9 @@
     },
     "action": {
       "primary": {
-        "default": "#0C66E4",
-        "hover": "#0055CC",
-        "pressed": "#09326C"
+        "default": "#645DC6",
+        "hover": "#544DB2",
+        "pressed": "#2F2C63"
       },
       "neutral": {
         "default": "#FFFFFF",
@@ -97,7 +97,7 @@
       },
       "destructive": {
         "default": "#c92c2f",
-        "hover": "#ae2426",
+        "hover": "#ae2424",
         "pressed": "#5d1a1c"
       }
     },
@@ -138,12 +138,12 @@
     "community": {
       "answered": "#1f8444",
       "unanswered": "#696E7C",
-      "highlighted": "#0C66E4",
-      "pinned": "#0C66E4"
+      "highlighted": "#645DC6",
+      "pinned": "#645DC6"
     },
     "link": {
-      "default": "#0C66E4",
-      "hover": "#0055CC"
+      "default": "#645DC6",
+      "hover": "#544DB2"
     },
     "focus": {
       "ring": "#388bff"
@@ -366,9 +366,9 @@
     },
     "primary": {
       "background": {
-        "default": "#0C66E4",
-        "hover": "#0055CC",
-        "pressed": "#09326C"
+        "default": "#645DC6",
+        "hover": "#544DB2",
+        "pressed": "#2F2C63"
       },
       "content": {
         "default": "#FFFFFF",
@@ -403,7 +403,7 @@
     "destructive": {
       "background": {
         "default": "#c92c2f",
-        "hover": "#ae2426",
+        "hover": "#ae2424",
         "pressed": "#5d1a1c"
       },
       "content": {
@@ -441,9 +441,9 @@
       },
       "selected": {
         "background": {
-          "default": "#0C66E4",
-          "hover": "#0055CC",
-          "pressed": "#09326C"
+          "default": "#645DC6",
+          "hover": "#544DB2",
+          "pressed": "#2F2C63"
         },
         "content": {
           "default": "#FFFFFF",
@@ -478,13 +478,13 @@
     },
     "title": {
       "default": "#2B3346",
-      "hover": "#0C66E4",
+      "hover": "#645DC6",
       "pressed": "#2B3346"
     },
     "content": {
       "default": "#2B3346",
       "hover": "#2B3346",
-      "pressed": "#0055CC"
+      "pressed": "#544DB2"
     },
     "shadow": {
       "default": "none",
@@ -517,13 +517,13 @@
       },
       "title": {
         "default": "#2B3346",
-        "hover": "#0C66E4",
-        "pressed": "#0055CC"
+        "hover": "#645DC6",
+        "pressed": "#544DB2"
       },
       "content": {
         "default": "#2B3346",
         "hover": "#2B3346",
-        "pressed": "#0055CC"
+        "pressed": "#544DB2"
       },
       "shadow": {
         "default": "none",
@@ -592,16 +592,16 @@
   },
   "theme": {
     "brand": {
-      "100": "#E9F2FF",
-      "200": "#CCE0FF",
-      "300": "#85B8FF",
-      "400": "#579DFF",
-      "500": "#388BFF",
-      "600": "#1D7AFC",
-      "700": "#0C66E4",
-      "800": "#0055CC",
-      "900": "#09326C",
-      "1000": "#1C2B41"
+      "100": "#F2F0FF",
+      "200": "#DCD8FD",
+      "300": "#B3ACF6",
+      "400": "#978FEF",
+      "500": "#877EE7",
+      "600": "#7970DB",
+      "700": "#645DC6",
+      "800": "#544DB2",
+      "900": "#2F2C63",
+      "1000": "#28273F"
     },
     "neutral": {
       "0": "#FFFFFF",

package/dist/tokens.scss

@@ -3,16 +3,16 @@
 
 $border-width-100: 1px;
 $border-width-200: 2px;
-$color-brand-100: #E9F2FF;
-$color-brand-200: #CCE0FF;
-$color-brand-300: #85B8FF;
-$color-brand-400: #579DFF;
-$color-brand-500: #388BFF;
-$color-brand-600: #1D7AFC;
-$color-brand-700: #0C66E4;
-$color-brand-800: #0055CC;
-$color-brand-900: #09326C;
-$color-brand-1000: #1C2B41;
+$color-brand-100: #F2F0FF;
+$color-brand-200: #DCD8FD;
+$color-brand-300: #B3ACF6;
+$color-brand-400: #978FEF;
+$color-brand-500: #877EE7;
+$color-brand-600: #7970DB;
+$color-brand-700: #645DC6;
+$color-brand-800: #544DB2;
+$color-brand-900: #2F2C63;
+$color-brand-1000: #28273F;
 $color-neutral-0: #FFFFFF;
 $color-neutral-100: #FAFAFA;
 $color-neutral-200: #F4F5F6;
@@ -56,7 +56,7 @@ $color-red-400: #f86a68;
 $color-red-500: #f15050;
 $color-red-600: #e23d3d;
 $color-red-700: #c92c2f;
-$color-red-800: #ae2426;
+$color-red-800: #ae2424;
 $color-red-900: #5d1a1c;
 $color-red-1000: #421f21;
 $color-yellow-100: #fff7d6;
@@ -69,14 +69,14 @@ $color-yellow-700: #946f00;
 $color-yellow-800: #7f5f01;
 $color-yellow-900: #533f04;
 $color-yellow-1000: #332e1b;
-$color-action-primary-default: #0C66E4; // default color used for the most prominent call-to-action in the interface
-$color-action-primary-hover: #0055CC; // color used when a primary action is hovered
-$color-action-primary-pressed: #09326C; // color used when a primary action is actively pressed
+$color-action-primary-default: #645DC6; // default color used for the most prominent call-to-action in the interface
+$color-action-primary-hover: #544DB2; // color used when a primary action is hovered
+$color-action-primary-pressed: #2F2C63; // color used when a primary action is actively pressed
 $color-action-neutral-default: #FFFFFF; // color used for less prominent actions that support the primary action
 $color-action-neutral-hover: #FAFAFA; // color used when a secondary action is hovered
 $color-action-neutral-pressed: #F4F5F6; // color used when a secondary action is actively pressed
 $color-action-destructive-default: #c92c2f; // color used for actions that perform irreversible or potentially harmful operations
-$color-action-destructive-hover: #ae2426; // color used when a destructive action is hovered
+$color-action-destructive-hover: #ae2424; // color used when a destructive action is hovered
 $color-action-destructive-pressed: #5d1a1c; // color used when a destructive action is actively pressed
 $color-surface-page: #FAFAFA; // application canvas background used behind all UI surfaces
 $color-surface-default: #FFFFFF; // default container surface for standard UI sections (cards, panels, content areas)
@@ -98,10 +98,10 @@ $color-status-information-bold: #0c66e4; // high-emphasis color used to indicate
 $color-status-danger-bold: #c92c2f; // high-emphasis color used for neutral informational messages
 $color-community-answered: #1f8444; // color used to indicate that a question or thread has received an accepted answer
 $color-community-unanswered: #696E7C; // color used to indicate that a question or thread has not yet received a response
-$color-community-highlighted: #0C66E4; // color used to highlight content that is featured or editorially promoted
-$color-community-pinned: #0C66E4; // color used to indicate content that is pinned and prioritized in listings
-$color-link-default: #0C66E4; // default color used for interactive text links
-$color-link-hover: #0055CC; // color used for interactive text links on hover
+$color-community-highlighted: #645DC6; // color used to highlight content that is featured or editorially promoted
+$color-community-pinned: #645DC6; // color used to indicate content that is pinned and prioritized in listings
+$color-link-default: #645DC6; // default color used for interactive text links
+$color-link-hover: #544DB2; // color used for interactive text links on hover
 $color-focus-ring: #388bff; // default color used for focus rings on interactive elements
 $color-overlay-backdrop: rgba(43, 51, 70, 0.48); // semi-transparent color displayed behind modals to obscure background content
 $color-overlay-interactive-hover: rgba(43, 51, 70, 0.04); // overlay color applied to interactive elements to indicate a hover state
@@ -209,9 +209,9 @@ $button-radius: 8px; // Border radius used for all button variants.
 $button-border-width: 1px; // Border width used for all button variants.
 $button-font-weight: 500; // Font weight used for button labels across all variants.
 $button-text-transform: none; // Text transform applied to button labels (e.g., none/uppercase).
-$button-primary-background-default: #0C66E4; // Primary button background in default state.
-$button-primary-background-hover: #0055CC; // Primary button background on hover.
-$button-primary-background-pressed: #09326C; // Primary button background on press.
+$button-primary-background-default: #645DC6; // Primary button background in default state.
+$button-primary-background-hover: #544DB2; // Primary button background on hover.
+$button-primary-background-pressed: #2F2C63; // Primary button background on press.
 $button-primary-content-default: #FFFFFF; // Primary button label/icon color in default state.
 $button-primary-content-hover: #FFFFFF; // Primary button label/icon color on hover.
 $button-primary-content-pressed: #FFFFFF; // Primary button label/icon color on press.
@@ -230,7 +230,7 @@ $button-secondary-border-hover: #DEDFE2; // Secondary button border color on hov
 $button-secondary-border-pressed: #DEDFE2; // Secondary button border color on press.
 $button-secondary-shadow: none; // Secondary button shadow (none).
 $button-destructive-background-default: #c92c2f; // Destructive button background in default state.
-$button-destructive-background-hover: #ae2426; // Destructive button background on hover.
+$button-destructive-background-hover: #ae2424; // Destructive button background on hover.
 $button-destructive-background-pressed: #5d1a1c; // Destructive button background on press.
 $button-destructive-content-default: #FFFFFF; // Destructive button label/icon color in default state.
 $button-destructive-content-hover: #FFFFFF; // Destructive button label/icon color on hover.
@@ -251,9 +251,9 @@ $button-vote-border-pressed: #DEDFE2; // Vote button border color on press.
 $button-vote-shadow-default: none; // Vote button shadow in default state (none).
 $button-vote-shadow-hover: none; // Vote button shadow on hover (none).
 $button-vote-shadow-pressed: none; // Vote button shadow on press (none).
-$button-vote-selected-background-default: #0C66E4; // Vote button background when selected (default).
-$button-vote-selected-background-hover: #0055CC; // Vote button background when selected (hovered).
-$button-vote-selected-background-pressed: #09326C; // Vote button background when selected (pressed).
+$button-vote-selected-background-default: #645DC6; // Vote button background when selected (default).
+$button-vote-selected-background-hover: #544DB2; // Vote button background when selected (hovered).
+$button-vote-selected-background-pressed: #2F2C63; // Vote button background when selected (pressed).
 $button-vote-selected-content-default: #FFFFFF; // Vote button content color when selected (default).
 $button-vote-selected-content-hover: #FFFFFF; // Vote button content color when selected (hovered).
 $button-vote-selected-content-pressed: #FFFFFF; // Vote button content color when selected (pressed).
@@ -272,11 +272,11 @@ $card-background-default: #FFFFFF; // Card background in default state.
 $card-background-hover: #FFFFFF; // Card background on hover.
 $card-background-pressed: #FFFFFF; // Card background on press.
 $card-title-default: #2B3346; // Card title color in default state.
-$card-title-hover: #0C66E4; // Card title color on hover (link styling).
+$card-title-hover: #645DC6; // Card title color on hover (link styling).
 $card-title-pressed: #2B3346; // Card title color on press.
 $card-content-default: #2B3346; // Card body/content color in default state.
 $card-content-hover: #2B3346; // Card body/content color on hover.
-$card-content-pressed: #0055CC; // Card body/content color on press (link hovered styling).
+$card-content-pressed: #544DB2; // Card body/content color on press (link hovered styling).
 $card-shadow-default: none; // Card shadow in default state (none).
 $card-shadow-hover: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1); // Card shadow on hover.
 $card-shadow-pressed: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1); // Card shadow on press.
@@ -294,11 +294,11 @@ $feed-item-background-default: #FFFFFF; // Feed item background in default state
 $feed-item-background-hover: #FFFFFF; // Feed item background on hover.
 $feed-item-background-pressed: #FFFFFF; // Feed item background on press.
 $feed-item-title-default: #2B3346; // Feed item title color in default state.
-$feed-item-title-hover: #0C66E4; // Feed item title color on hover (link styling).
-$feed-item-title-pressed: #0055CC; // Feed item title color on press (link hovered styling).
+$feed-item-title-hover: #645DC6; // Feed item title color on hover (link styling).
+$feed-item-title-pressed: #544DB2; // Feed item title color on press (link hovered styling).
 $feed-item-content-default: #2B3346; // Feed item content color in default state.
 $feed-item-content-hover: #2B3346; // Feed item content color on hover.
-$feed-item-content-pressed: #0055CC; // Feed item content color on press (link hovered styling).
+$feed-item-content-pressed: #544DB2; // Feed item content color on press (link hovered styling).
 $feed-item-shadow-default: none; // Feed item shadow in default state (none).
 $feed-item-shadow-hover: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1); // Feed item shadow on hover.
 $feed-item-shadow-pressed: 0px 2px 4px -2px rgba(0, 0, 0, 0.1), 0px 4px 6px -1px rgba(0, 0, 0, 0.1); // Feed item shadow on press.
@@ -332,16 +332,16 @@ $widget-introduction-content: #2B3346; // Introduction widget body/content color
 $widget-introduction-icon-background: #1f8444; // Introduction widget icon container background.
 $widget-introduction-icon-content: #FFFFFF; // Introduction widget icon color.
 $widget-introduction-close-content: #696E7C; // Introduction widget close button color.
-$theme-brand-100: #E9F2FF;
-$theme-brand-200: #CCE0FF;
-$theme-brand-300: #85B8FF;
-$theme-brand-400: #579DFF;
-$theme-brand-500: #388BFF;
-$theme-brand-600: #1D7AFC;
-$theme-brand-700: #0C66E4;
-$theme-brand-800: #0055CC;
-$theme-brand-900: #09326C;
-$theme-brand-1000: #1C2B41;
+$theme-brand-100: #F2F0FF;
+$theme-brand-200: #DCD8FD;
+$theme-brand-300: #B3ACF6;
+$theme-brand-400: #978FEF;
+$theme-brand-500: #877EE7;
+$theme-brand-600: #7970DB;
+$theme-brand-700: #645DC6;
+$theme-brand-800: #544DB2;
+$theme-brand-900: #2F2C63;
+$theme-brand-1000: #28273F;
 $theme-neutral-0: #FFFFFF;
 $theme-neutral-100: #FAFAFA;
 $theme-neutral-200: #F4F5F6;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gainsight-hub/design-tokens",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "Design tokens: CSS variables, JSON, TypeScript constants, and Tailwind preset.",
   "license": "UNLICENSED",
   "author": "Gainsight Design Systems",