@sage/design-tokens 8.2.0 → 8.4.0

package/js/umd/product/small/light/components/tab.js

@@ -302,6 +302,19 @@
           attributes: {},
           path: ["tab", "color", "bg-hover"],
         },
+        "border-activealt": {
+          $type: "color",
+          $value: "#d1d1d1",
+          filePath: "data/tokens/components/tab.json",
+          isSource: true,
+          original: {
+            $type: "color",
+            $value: "{modes.color.generic.fg.delicate}",
+          },
+          name: "tabColorBorderActivealt",
+          attributes: {},
+          path: ["tab", "color", "border-activealt"],
+        },
         "border-active": {
           $type: "color",
           $value: "#000000",
@@ -633,13 +646,11 @@
           bottom: {
             $type: "borderWidth",
             $value: 2,
-            $description: "Tab (enabled and hover bottom border)",
             filePath: "data/tokens/components/tab.json",
             isSource: true,
             original: {
               $type: "borderWidth",
               $value: "{global.borderwidth.S}",
-              $description: "Tab (enabled and hover bottom border)",
             },
             name: "tabBorderwidthNavigationBottom",
             attributes: {},
@@ -648,18 +659,29 @@
           side: {
             $type: "borderWidth",
             $value: 2,
-            $description: "Tab (enabled and hover bottom border)",
             filePath: "data/tokens/components/tab.json",
             isSource: true,
             original: {
               $type: "borderWidth",
               $value: "{global.borderwidth.S}",
-              $description: "Tab (enabled and hover bottom border)",
             },
             name: "tabBorderwidthNavigationSide",
             attributes: {},
             path: ["tab", "borderwidth", "navigation", "side"],
           },
+          top: {
+            $type: "borderWidth",
+            $value: 2,
+            filePath: "data/tokens/components/tab.json",
+            isSource: true,
+            original: {
+              $type: "borderWidth",
+              $value: "{global.borderwidth.S}",
+            },
+            name: "tabBorderwidthNavigationTop",
+            attributes: {},
+            path: ["tab", "borderwidth", "navigation", "top"],
+          },
         },
       },
       typography: {

package/js/umd/product/small/light/mode.js

@@ -195,6 +195,418 @@
             path: ["modes", "color", "custom", "frozen"],
           },
         },
+        colorcode: {
+          blue: {
+            deep: {
+              $type: "color",
+              $value: "#0071c3",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.blue.400}",
+              },
+              name: "modesColorColorcodeBlueDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "blue", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#CDE5FF",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.blue.950}",
+              },
+              name: "modesColorColorcodeBlueMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "blue", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#0084E1",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.blue.550}",
+              },
+              name: "modesColorColorcodeBlueRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "blue", "rich"],
+            },
+          },
+          teal: {
+            deep: {
+              $type: "color",
+              $value: "#007C7B",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.teal.400}",
+              },
+              name: "modesColorColorcodeTealDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "teal", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#C1FBFB",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.teal.950}",
+              },
+              name: "modesColorColorcodeTealMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "teal", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#009B99",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.teal.550}",
+              },
+              name: "modesColorColorcodeTealRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "teal", "rich"],
+            },
+          },
+          green: {
+            deep: {
+              $type: "color",
+              $value: "#00811F",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.green.400}",
+              },
+              name: "modesColorColorcodeGreenDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "green", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#C5FFC9",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.green.950}",
+              },
+              name: "modesColorColorcodeGreenMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "green", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#00a128",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.green.550}",
+              },
+              name: "modesColorColorcodeGreenRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "green", "rich"],
+            },
+          },
+          lime: {
+            deep: {
+              $type: "color",
+              $value: "#637700",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.lime.400}",
+              },
+              name: "modesColorColorcodeLimeDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "lime", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#FFFF9C",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.lime.950}",
+              },
+              name: "modesColorColorcodeLimeMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "lime", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#819B00",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.lime.550}",
+              },
+              name: "modesColorColorcodeLimeRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "lime", "rich"],
+            },
+          },
+          orange: {
+            deep: {
+              $type: "color",
+              $value: "#C54300",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.orange.400}",
+              },
+              name: "modesColorColorcodeOrangeDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "orange", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#FEEAB0",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.orange.950}",
+              },
+              name: "modesColorColorcodeOrangeMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "orange", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#EA5100",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.orange.550}",
+              },
+              name: "modesColorColorcodeOrangeRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "orange", "rich"],
+            },
+          },
+          red: {
+            deep: {
+              $type: "color",
+              $value: "#DC004E",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.red.400}",
+              },
+              name: "modesColorColorcodeRedDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "red", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#FFDBCF",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.red.950}",
+              },
+              name: "modesColorColorcodeRedMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "red", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#FE005B",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.red.550}",
+              },
+              name: "modesColorColorcodeRedRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "red", "rich"],
+            },
+          },
+          pink: {
+            deep: {
+              $type: "color",
+              $value: "#C8269A",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.pink.400}",
+              },
+              name: "modesColorColorcodePinkDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "pink", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#FFD7EE",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.pink.950}",
+              },
+              name: "modesColorColorcodePinkMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "pink", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#e62db2",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.pink.550}",
+              },
+              name: "modesColorColorcodePinkRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "pink", "rich"],
+            },
+          },
+          purple: {
+            deep: {
+              $type: "color",
+              $value: "#8F4CD7",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.purple.400}",
+              },
+              name: "modesColorColorcodePurpleDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "purple", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#E7DEF8",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.purple.950}",
+              },
+              name: "modesColorColorcodePurpleMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "purple", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#9C66DE",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.purple.550}",
+              },
+              name: "modesColorColorcodePurpleRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "purple", "rich"],
+            },
+          },
+          slate: {
+            deep: {
+              $type: "color",
+              $value: "#527386",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.slate.400}",
+              },
+              name: "modesColorColorcodeSlateDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "slate", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#D4E5F1",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.slate.950}",
+              },
+              name: "modesColorColorcodeSlateMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "slate", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#60869C",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.slate.550}",
+              },
+              name: "modesColorColorcodeSlateRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "slate", "rich"],
+            },
+          },
+          gray: {
+            deep: {
+              $type: "color",
+              $value: "#6F6F6F",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.gray.400}",
+              },
+              name: "modesColorColorcodeGrayDeep",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "gray", "deep"],
+            },
+            muted: {
+              $type: "color",
+              $value: "#E2E2E2",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.gray.950}",
+              },
+              name: "modesColorColorcodeGrayMuted",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "gray", "muted"],
+            },
+            rich: {
+              $type: "color",
+              $value: "#9b9b9b",
+              filePath: "data/tokens/modes/light.json",
+              isSource: true,
+              original: {
+                $type: "color",
+                $value: "{primitives.colors.supplementary.gray.550}",
+              },
+              name: "modesColorColorcodeGrayRich",
+              attributes: {},
+              path: ["modes", "color", "colorcode", "gray", "rich"],
+            },
+          },
+        },
         generic: {
           bg: {
             nought: {

package/json/flat/frozenproduct/large/dark/components/badge.json

@@ -1,6 +1,7 @@
 {
   "badgeColorNotificationBorderDefault": "#000000",
   "badgeColorNotificationBgDefault": "#E13E53",
+  "badgeColorNotificationBgAlt": "#007ED9",
   "badgeColorNotificationLabelDefault": "#000000",
   "badgeSizeMicroDot": 8,
   "badgeSizeMicroNumberedMin": 16,

package/json/flat/frozenproduct/large/dark/components/container.json

@@ -1,21 +1,31 @@
 {
-  "containerColorStandardBgAlt": "#0e0e0e",
-  "containerColorStandardBgDefault": "#000000",
-  "containerColorStandardBgFooterDefault": "#0e0e0e",
-  "containerColorStandardBorderActive": "#FFFFFF",
-  "containerColorStandardBorderAlt": "#4b4b4b",
-  "containerColorStandardBorderDefault": "#181818",
-  "containerColorStandardDimmer": "#FFFFFF",
-  "containerColorStandardIcon": "#777",
-  "containerColorStandardTextAlt": "#ffffff8c",
-  "containerColorStandardTextDefault": "#fffffff2",
   "containerColorAiBorderhorizontal": "linear-gradient(90deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%)",
   "containerColorAiBordervertical": "linear-gradient(180deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%)",
   "containerColorAiNudgeBorderAiHorizontal": "linear-gradient(90deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%)",
   "containerColorAiNudgeBorderAiVertical": "linear-gradient(180deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%)",
-  "containerColorScrollbarBgDefault": "#0e0e0e",
-  "containerColorScrollbarFgDefault": "#777",
-  "containerColorInteractiveDetailediconBg": "#00D639",
+  "containerColorBlockquoteBorder": "#00D639",
+  "containerColorCalendarLabelDefault": "#FFFFFF",
+  "containerColorCalendarLabelAlt": "#FFFFFF",
+  "containerColorCalendarBlueBgDefault": "#00293F",
+  "containerColorCalendarBluePattern": "#0071c3",
+  "containerColorCalendarTealBgDefault": "#002B2A",
+  "containerColorCalendarTealPattern": "#007C7B",
+  "containerColorCalendarGreenBgDefault": "#002D05",
+  "containerColorCalendarGreenPattern": "#00811F",
+  "containerColorCalendarLimeBgDefault": "#171e00",
+  "containerColorCalendarLimePattern": "#637700",
+  "containerColorCalendarOrangeBgDefault": "#380D00",
+  "containerColorCalendarOrangePattern": "#C54300",
+  "containerColorCalendarRedBgDefault": "#400011",
+  "containerColorCalendarRedPattern": "#DC004E",
+  "containerColorCalendarPinkBgDefault": "#3C002C",
+  "containerColorCalendarPinkPattern": "#C8269A",
+  "containerColorCalendarPurpleBgDefault": "#270E41",
+  "containerColorCalendarPurplePattern": "#8F4CD7",
+  "containerColorCalendarSlateBgDefault": "#121D23",
+  "containerColorCalendarSlatePattern": "#527386",
+  "containerColorCalendarGrayBgDefault": "#1b1b1b",
+  "containerColorCalendarGrayPattern": "#6F6F6F",
   "containerColorInteractiveBgFooterActivated": "#009023",
   "containerColorInteractiveBgFooterActive": "#FFFFFF",
   "containerColorInteractiveBorderActivated": "#009023",
@@ -39,7 +49,19 @@
   "containerColorInteractiveTextEnabled": "#fffffff2",
   "containerColorInteractiveTextAltEnabled": "#ffffff8c",
   "containerColorInteractiveTextHover": "#ffffffe6",
-  "containerColorBlockquoteBorder": "#00D639",
+  "containerColorInteractiveDetailediconBg": "#00D639",
+  "containerColorScrollbarBgDefault": "#0e0e0e",
+  "containerColorScrollbarFgDefault": "#777",
+  "containerColorStandardBgAlt": "#0e0e0e",
+  "containerColorStandardBgDefault": "#000000",
+  "containerColorStandardBgFooterDefault": "#0e0e0e",
+  "containerColorStandardBorderActive": "#FFFFFF",
+  "containerColorStandardBorderAlt": "#4b4b4b",
+  "containerColorStandardBorderDefault": "#181818",
+  "containerColorStandardDimmer": "#FFFFFF",
+  "containerColorStandardIcon": "#777",
+  "containerColorStandardTextAlt": "#ffffff8c",
+  "containerColorStandardTextDefault": "#fffffff2",
   "containerSizeNone": 0,
   "containerSizeAccordionstandardChevron": 20,
   "containerSizeQuotebarWidth": 8,

package/json/flat/frozenproduct/large/dark/components/form.json

@@ -192,6 +192,58 @@
   "formColorCalendarTextEnabled": "#fffffff2",
   "formColorCalendarTextHover": "#FFFFFF",
   "formColorCalendarTextAltEnabled": "#ffffff8c",
+  "formColorColorpickerLabelDefault": "#FFFFFF",
+  "formColorColorpickerLabelAlt": "#FFFFFF",
+  "formColorColorpickerBlueBorder": "#0071c3",
+  "formColorColorpickerBlueBgAlt": "#0071c3",
+  "formColorColorpickerBlueBgDefault": "#00293F",
+  "formColorColorpickerBluePattern": "#0071c3",
+  "formColorColorpickerBlueLabelDefault": "#007FD9",
+  "formColorColorpickerTealBorder": "#007C7B",
+  "formColorColorpickerTealBgAlt": "#007C7B",
+  "formColorColorpickerTealBgDefault": "#002B2A",
+  "formColorColorpickerTealPattern": "#007C7B",
+  "formColorColorpickerTealLabelDefault": "#008A89",
+  "formColorColorpickerGreenBorder": "#00811F",
+  "formColorColorpickerGreenBgAlt": "#00811F",
+  "formColorColorpickerGreenBgDefault": "#002D05",
+  "formColorColorpickerGreenPattern": "#00811F",
+  "formColorColorpickerGreenLabelDefault": "#009023",
+  "formColorColorpickerLimeBorder": "#637700",
+  "formColorColorpickerLimeBgAlt": "#637700",
+  "formColorColorpickerLimeBgDefault": "#171e00",
+  "formColorColorpickerLimePattern": "#637700",
+  "formColorColorpickerLimeLabelDefault": "#6E8500",
+  "formColorColorpickerOrangeBorder": "#C54300",
+  "formColorColorpickerOrangeBgAlt": "#C54300",
+  "formColorColorpickerOrangeBgDefault": "#380D00",
+  "formColorColorpickerOrangePattern": "#C54300",
+  "formColorColorpickerOrangeLabelDefault": "#DB4B00",
+  "formColorColorpickerRedBorder": "#DC004E",
+  "formColorColorpickerRedBgAlt": "#DC004E",
+  "formColorColorpickerRedBgDefault": "#400011",
+  "formColorColorpickerRedPattern": "#DC004E",
+  "formColorColorpickerRedLabelDefault": "#F50058",
+  "formColorColorpickerPinkBorder": "#C8269A",
+  "formColorColorpickerPinkBgAlt": "#C8269A",
+  "formColorColorpickerPinkBgDefault": "#3C002C",
+  "formColorColorpickerPinkPattern": "#C8269A",
+  "formColorColorpickerPinkLabelDefault": "#DD2BAB",
+  "formColorColorpickerPurpleBorder": "#8F4CD7",
+  "formColorColorpickerPurpleBgAlt": "#8F4CD7",
+  "formColorColorpickerPurpleBgDefault": "#270E41",
+  "formColorColorpickerPurplePattern": "#8F4CD7",
+  "formColorColorpickerPurpleLabelDefault": "#985FDC",
+  "formColorColorpickerSlateBorder": "#527386",
+  "formColorColorpickerSlateBgAlt": "#527386",
+  "formColorColorpickerSlateBgDefault": "#121D23",
+  "formColorColorpickerSlatePattern": "#527386",
+  "formColorColorpickerSlateLabelDefault": "#5C8196",
+  "formColorColorpickerGrayBorder": "#6F6F6F",
+  "formColorColorpickerGrayBgAlt": "#6F6F6F",
+  "formColorColorpickerGrayBgDefault": "#1b1b1b",
+  "formColorColorpickerGrayPattern": "#6F6F6F",
+  "formColorColorpickerGrayLabelDefault": "#7C7C7C",
   "formColorDropdownBgHover": "#ffffff14",
   "formColorDropdownLabelActive": "#000000",
   "formColorDropdownLabelAlt": "#ffffffe6",

package/json/flat/frozenproduct/large/dark/components/tab.json

@@ -17,6 +17,7 @@
   "tabColorBgActive": "#000000",
   "tabColorBgEnabled": "#fff0",
   "tabColorBgHover": "#ffffff14",
+  "tabColorBorderActivealt": "#282828",
   "tabColorBorderActive": "#FFFFFF",
   "tabColorBorderEnabled": "#282828",
   "tabColorBorderHover": "#777",
@@ -42,6 +43,7 @@
   "tabRadiusNone": "0",
   "tabBorderwidthNavigationBottom": 2,
   "tabBorderwidthNavigationSide": 2,
+  "tabBorderwidthNavigationTop": 2,
   "tabTypographyAdaptiveLabelS": {"fontFamily":"Sage UI","fontWeight":"500","lineHeight":1.5,"fontSize":"14px","paragraphSpacing":"0"},
   "tabTypographyAdaptiveLabelM": {"fontFamily":"Sage UI","fontWeight":"500","lineHeight":1.5,"fontSize":"16px","paragraphSpacing":"0"},
   "tabTypographyAdaptiveLabelL": {"fontFamily":"Sage UI","fontWeight":"500","lineHeight":1.5,"fontSize":"19px","paragraphSpacing":"0"},

package/json/flat/frozenproduct/large/dark/mode.json

@@ -8,6 +8,36 @@
   "modesColorBrandCopilotNoBgMonochrome": "#FFFFFF",
   "modesColorCustomDefault": "#00D639",
   "modesColorCustomFrozen": "#00D639",
+  "modesColorColorcodeBlueDeep": "#007FD9",
+  "modesColorColorcodeBlueMuted": "#00293F",
+  "modesColorColorcodeBlueRich": "#0071c3",
+  "modesColorColorcodeTealDeep": "#008A89",
+  "modesColorColorcodeTealMuted": "#002B2A",
+  "modesColorColorcodeTealRich": "#007C7B",
+  "modesColorColorcodeGreenDeep": "#009023",
+  "modesColorColorcodeGreenMuted": "#002D05",
+  "modesColorColorcodeGreenRich": "#00811F",
+  "modesColorColorcodeLimeDeep": "#6E8500",
+  "modesColorColorcodeLimeMuted": "#171e00",
+  "modesColorColorcodeLimeRich": "#637700",
+  "modesColorColorcodeOrangeDeep": "#DB4B00",
+  "modesColorColorcodeOrangeMuted": "#380D00",
+  "modesColorColorcodeOrangeRich": "#C54300",
+  "modesColorColorcodeRedDeep": "#F50058",
+  "modesColorColorcodeRedMuted": "#400011",
+  "modesColorColorcodeRedRich": "#DC004E",
+  "modesColorColorcodePinkDeep": "#DD2BAB",
+  "modesColorColorcodePinkMuted": "#3C002C",
+  "modesColorColorcodePinkRich": "#C8269A",
+  "modesColorColorcodePurpleDeep": "#985FDC",
+  "modesColorColorcodePurpleMuted": "#270E41",
+  "modesColorColorcodePurpleRich": "#8F4CD7",
+  "modesColorColorcodeSlateDeep": "#5C8196",
+  "modesColorColorcodeSlateMuted": "#121D23",
+  "modesColorColorcodeSlateRich": "#527386",
+  "modesColorColorcodeGrayDeep": "#7C7C7C",
+  "modesColorColorcodeGrayMuted": "#1b1b1b",
+  "modesColorColorcodeGrayRich": "#6F6F6F",
   "modesColorGenericBgNought": "#000000",
   "modesColorGenericBgFaint": "#0e0e0e",
   "modesColorGenericBgDelicate": "#181818",