npm - @primer/primitives - Versions diffs - 11.4.1-rc.edbe0e39 → 11.5.0-rc.14eaeb12 - Mend

@primer/primitives 11.4.1-rc.edbe0e39 → 11.5.0-rc.14eaeb12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (138) hide show

package/DESIGN_TOKENS_SPEC.md +14 -5
package/dist/build/schemas/borderToken.d.ts +45 -3
package/dist/build/schemas/borderToken.js +2 -1
package/dist/build/schemas/colorToken.d.ts +639 -30
package/dist/build/schemas/colorToken.js +3 -2
package/dist/build/schemas/colorW3cValue.d.ts +28 -0
package/dist/build/schemas/colorW3cValue.js +42 -0
package/dist/build/schemas/cubicBezierToken.d.ts +1 -1
package/dist/build/schemas/dimensionToken.d.ts +1 -1
package/dist/build/schemas/durationToken.d.ts +1 -1
package/dist/build/schemas/fontFamilyToken.d.ts +1 -1
package/dist/build/schemas/fontWeightToken.d.ts +1 -1
package/dist/build/schemas/gradientToken.d.ts +23 -2
package/dist/build/schemas/gradientToken.js +2 -1
package/dist/build/schemas/numberToken.d.ts +1 -1
package/dist/build/schemas/shadowToken.d.ts +1079 -43
package/dist/build/schemas/shadowToken.js +8 -2
package/dist/build/schemas/stringToken.d.ts +1 -1
package/dist/build/schemas/tokenType.d.ts +1 -1
package/dist/build/schemas/transitionToken.d.ts +1 -1
package/dist/build/schemas/typographyToken.d.ts +1 -1
package/dist/build/schemas/viewportRangeToken.d.ts +1 -1
package/dist/build/transformers/borderToCss.js +3 -1
package/dist/build/transformers/colorAlphaToCss.js +6 -3
package/dist/build/transformers/colorToHex.js +5 -2
package/dist/build/transformers/colorToRgbAlpha.js +5 -2
package/dist/build/transformers/colorToRgbaFloat.js +5 -0
package/dist/build/transformers/durationToCss.js +4 -4
package/dist/build/transformers/gradientToCss.js +2 -1
package/dist/build/transformers/shadowToCss.js +4 -1
package/dist/build/transformers/utilities/normalizeColorValue.d.ts +23 -0
package/dist/build/transformers/utilities/normalizeColorValue.js +74 -0
package/dist/build/types/borderTokenValue.d.ts +2 -1
package/dist/build/types/shadowTokenValue.d.ts +2 -1
package/dist/css/base/motion/motion.css +1 -1
package/dist/css/functional/size/radius.css +1 -1
package/dist/css/functional/size/size-coarse.css +1 -0
package/dist/css/functional/size/size-fine.css +1 -0
package/dist/css/functional/size/size.css +5 -0
package/dist/css/functional/themes/dark-colorblind-high-contrast.css +22 -10
package/dist/css/functional/themes/dark-colorblind.css +22 -10
package/dist/css/functional/themes/dark-dimmed-high-contrast.css +22 -10
package/dist/css/functional/themes/dark-dimmed.css +22 -10
package/dist/css/functional/themes/dark-high-contrast.css +22 -10
package/dist/css/functional/themes/dark-tritanopia-high-contrast.css +22 -10
package/dist/css/functional/themes/dark-tritanopia.css +22 -10
package/dist/css/functional/themes/dark.css +22 -10
package/dist/css/functional/themes/light-colorblind-high-contrast.css +14 -2
package/dist/css/functional/themes/light-colorblind.css +20 -8
package/dist/css/functional/themes/light-high-contrast.css +14 -2
package/dist/css/functional/themes/light-tritanopia-high-contrast.css +14 -2
package/dist/css/functional/themes/light-tritanopia.css +20 -8
package/dist/css/functional/themes/light.css +20 -8
package/dist/docs/functional/size/radius.json +2 -2
package/dist/docs/functional/size/size-coarse.json +55 -2
package/dist/docs/functional/size/size-fine.json +55 -2
package/dist/docs/functional/size/size.json +135 -0
package/dist/docs/functional/themes/dark-colorblind-high-contrast.json +2502 -372
package/dist/docs/functional/themes/dark-colorblind.json +2492 -370
package/dist/docs/functional/themes/dark-dimmed-high-contrast.json +2355 -205
package/dist/docs/functional/themes/dark-dimmed.json +2382 -212
package/dist/docs/functional/themes/dark-high-contrast.json +2507 -373
package/dist/docs/functional/themes/dark-tritanopia-high-contrast.json +2517 -375
package/dist/docs/functional/themes/dark-tritanopia.json +2499 -353
package/dist/docs/functional/themes/dark.json +2501 -371
package/dist/docs/functional/themes/light-colorblind-high-contrast.json +2354 -204
package/dist/docs/functional/themes/light-colorblind.json +2344 -202
package/dist/docs/functional/themes/light-high-contrast.json +2359 -205
package/dist/docs/functional/themes/light-tritanopia-high-contrast.json +2359 -205
package/dist/docs/functional/themes/light-tritanopia.json +2354 -204
package/dist/docs/functional/themes/light.json +2359 -205
package/dist/fallbacks/functional/size/size-coarse.json +2 -1
package/dist/fallbacks/functional/size/size-fine.json +2 -1
package/dist/fallbacks/functional/size/size.json +5 -0
package/dist/figma/dimension/dimension.json +56 -1
package/dist/figma/themes/dark-colorblind.json +49 -1
package/dist/figma/themes/dark-dimmed.json +51 -3
package/dist/figma/themes/dark-high-contrast.json +49 -1
package/dist/figma/themes/dark-tritanopia.json +49 -1
package/dist/figma/themes/dark.json +49 -1
package/dist/figma/themes/light-colorblind.json +49 -1
package/dist/figma/themes/light-high-contrast.json +49 -1
package/dist/figma/themes/light-tritanopia.json +49 -1
package/dist/figma/themes/light.json +49 -1
package/dist/internalCss/dark-colorblind-high-contrast.css +22 -10
package/dist/internalCss/dark-colorblind.css +22 -10
package/dist/internalCss/dark-dimmed-high-contrast.css +22 -10
package/dist/internalCss/dark-dimmed.css +22 -10
package/dist/internalCss/dark-high-contrast.css +22 -10
package/dist/internalCss/dark-tritanopia-high-contrast.css +22 -10
package/dist/internalCss/dark-tritanopia.css +22 -10
package/dist/internalCss/dark.css +22 -10
package/dist/internalCss/light-colorblind-high-contrast.css +14 -2
package/dist/internalCss/light-colorblind.css +20 -8
package/dist/internalCss/light-high-contrast.css +14 -2
package/dist/internalCss/light-tritanopia-high-contrast.css +14 -2
package/dist/internalCss/light-tritanopia.css +20 -8
package/dist/internalCss/light.css +20 -8
package/dist/styleLint/functional/size/radius.json +2 -2
package/dist/styleLint/functional/size/size-coarse.json +57 -4
package/dist/styleLint/functional/size/size-fine.json +57 -4
package/dist/styleLint/functional/size/size.json +135 -0
package/dist/styleLint/functional/themes/dark-colorblind-high-contrast.json +2491 -349
package/dist/styleLint/functional/themes/dark-colorblind.json +2481 -347
package/dist/styleLint/functional/themes/dark-dimmed-high-contrast.json +2516 -354
package/dist/styleLint/functional/themes/dark-dimmed.json +2543 -361
package/dist/styleLint/functional/themes/dark-high-contrast.json +2496 -350
package/dist/styleLint/functional/themes/dark-tritanopia-high-contrast.json +2506 -352
package/dist/styleLint/functional/themes/dark-tritanopia.json +2511 -353
package/dist/styleLint/functional/themes/dark.json +2491 -349
package/dist/styleLint/functional/themes/light-colorblind-high-contrast.json +2514 -352
package/dist/styleLint/functional/themes/light-colorblind.json +2505 -351
package/dist/styleLint/functional/themes/light-high-contrast.json +2371 -205
package/dist/styleLint/functional/themes/light-tritanopia-high-contrast.json +2519 -353
package/dist/styleLint/functional/themes/light-tritanopia.json +2515 -353
package/dist/styleLint/functional/themes/light.json +2520 -354
package/package.json +4 -3
package/src/tokens/base/color/dark/dark.dimmed.json5 +405 -81
package/src/tokens/base/color/dark/dark.high-contrast.json5 +405 -81
package/src/tokens/base/color/dark/dark.json5 +475 -95
package/src/tokens/base/color/dark/display-dark.json5 +960 -192
package/src/tokens/base/color/light/display-light.json5 +960 -192
package/src/tokens/base/color/light/light.high-contrast.json5 +405 -81
package/src/tokens/base/color/light/light.json5 +475 -95
package/src/tokens/base/size/size.json5 +194 -194
package/src/tokens/component/button.json5 +368 -65
package/src/tokens/component/reactionButton.json5 +20 -4
package/src/tokens/functional/border/border.json5 +29 -1
package/src/tokens/functional/color/bgColor.json5 +10 -2
package/src/tokens/functional/color/borderColor.json5 +8 -1
package/src/tokens/functional/color/control.json5 +160 -32
package/src/tokens/functional/color/fgColor.json5 +5 -1
package/src/tokens/functional/color/syntax.json5 +10 -2
package/src/tokens/functional/shadow/shadow.json5 +576 -0
package/src/tokens/functional/size/radius.json5 +1 -1
package/src/tokens/functional/size/size-coarse.json5 +15 -0
package/src/tokens/functional/size/size-fine.json5 +15 -0
package/src/tokens/functional/size/size.json5 +50 -0

package/dist/docs/functional/themes/light-high-contrast.json CHANGED Viewed

@@ -2075,7 +2075,11 @@
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#db61a2",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [328, 62.9, 62],
+            "hex": "#db61a2"
+          },
           "alpha": 0.1,
           "filePath": "src/tokens/functional/color/bgColor.json5",
           "isSource": true,
@@ -2111,7 +2115,11 @@
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#db61a2",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [328, 62.9, 62],
+              "hex": "#db61a2"
+            },
             "alpha": 0.1,
             "filePath": "src/tokens/functional/color/bgColor.json5",
             "isSource": true,
@@ -2732,6 +2740,44 @@
     "value": "0.0625rem solid #a371f7",
     "type": "border"
   },
+  "border-draft-emphasis": {
+    "key": "{border.draft.emphasis}",
+    "filePath": "src/tokens/functional/border/border.json5",
+    "isSource": true,
+    "original": {
+      "$value": {
+        "color": "{borderColor.draft.emphasis}",
+        "style": "solid",
+        "width": "{borderWidth.default}"
+      },
+      "$type": "border",
+      "key": "{border.draft.emphasis}"
+    },
+    "name": "border-draft-emphasis",
+    "attributes": {},
+    "path": ["border", "draft", "emphasis"],
+    "value": "0.0625rem solid #59636e",
+    "type": "border"
+  },
+  "border-draft-muted": {
+    "key": "{border.draft.muted}",
+    "filePath": "src/tokens/functional/border/border.json5",
+    "isSource": true,
+    "original": {
+      "$value": {
+        "color": "{borderColor.draft.muted}",
+        "style": "solid",
+        "width": "{borderWidth.default}"
+      },
+      "$type": "border",
+      "key": "{border.draft.muted}"
+    },
+    "name": "border-draft-muted",
+    "attributes": {},
+    "path": ["border", "draft", "muted"],
+    "value": "0.0625rem solid #454c54",
+    "type": "border"
+  },
   "border-emphasis": {
     "key": "{border.emphasis}",
     "filePath": "src/tokens/functional/border/border.json5",
@@ -2952,6 +2998,27 @@
     "value": "0.0625rem solid #26a148",
     "type": "border"
   },
+  "border-translucent": {
+    "key": "{border.translucent}",
+    "filePath": "src/tokens/functional/border/border.json5",
+    "isSource": true,
+    "original": {
+      "$description": "Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design.",
+      "$value": {
+        "color": "{borderColor.translucent}",
+        "style": "solid",
+        "width": "{borderWidth.default}"
+      },
+      "$type": "border",
+      "key": "{border.translucent}"
+    },
+    "name": "border-translucent",
+    "attributes": {},
+    "path": ["border", "translucent"],
+    "value": "0.0625rem solid #59636e",
+    "type": "border",
+    "description": "Semi-transparent border shorthand for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design."
+  },
   "border-transparent": {
     "key": "{border.transparent}",
     "filePath": "src/tokens/functional/border/border.json5",
@@ -5809,7 +5876,7 @@
     "original": {
       "$value": "{base.color.neutral.9}",
       "$type": "color",
-      "$description": "Semi-transparent border for overlays and layered elements",
+      "$description": "Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design.",
       "$extensions": {
         "org.primer.figma": {
           "collection": "mode",
@@ -5880,7 +5947,7 @@
     "path": ["borderColor", "translucent"],
     "value": "#59636e",
     "type": "color",
-    "description": "Semi-transparent border for overlays and layered elements"
+    "description": "Semi-transparent border for overlays and layered elements. Border-specific token — no bgColor-translucent counterpart exists by design."
   },
   "borderColor-transparent": {
     "key": "{borderColor.transparent}",
@@ -6604,13 +6671,21 @@
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -6636,13 +6711,21 @@
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -6722,13 +6805,21 @@
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -6754,13 +6845,21 @@
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -6785,13 +6884,21 @@
       },
       "org.primer.overrides": {
         "dark": {
-          "$value": "#FA5E55",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [3.3, 94.3, 65.7],
+            "hex": "#FA5E55"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#ea5c53",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [3.6, 78.2, 62.2],
+            "hex": "#ea5c53"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -6841,13 +6948,21 @@
         },
         "org.primer.overrides": {
           "dark": {
-            "$value": "#FA5E55",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [3.3, 94.3, 65.7],
+              "hex": "#FA5E55"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#ea5c53",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [3.6, 78.2, 62.2],
+              "hex": "#ea5c53"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -6892,6 +7007,35 @@
     "value": "#86061d",
     "type": "color"
   },
+  "button-danger-iconColor-disabled": {
+    "key": "{button.danger.iconColor.disabled}",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component (internal)",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/component/button.json5",
+    "isSource": true,
+    "original": {
+      "$value": "{button.danger.fgColor.disabled}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component (internal)",
+          "scopes": ["fgColor"]
+        }
+      },
+      "key": "{button.danger.iconColor.disabled}"
+    },
+    "name": "button-danger-iconColor-disabled",
+    "attributes": {},
+    "path": ["button", "danger", "iconColor", "disabled"],
+    "value": "#86061d80",
+    "type": "color"
+  },
   "button-danger-iconColor-hover": {
     "key": "{button.danger.iconColor.hover}",
     "$extensions": {
@@ -6908,7 +7052,11 @@
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -6934,7 +7082,11 @@
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -7456,6 +7608,35 @@
     "value": "#454c54",
     "type": "color"
   },
+  "button-default-fgColor-disabled": {
+    "key": "{button.default.fgColor.disabled}",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component (internal)",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/component/button.json5",
+    "isSource": true,
+    "original": {
+      "$value": "{control.fgColor.disabled}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component (internal)",
+          "scopes": ["fgColor"]
+        }
+      },
+      "key": "{button.default.fgColor.disabled}"
+    },
+    "name": "button-default-fgColor-disabled",
+    "attributes": {},
+    "path": ["button", "default", "fgColor", "disabled"],
+    "value": "#59636e",
+    "type": "color"
+  },
   "button-default-fgColor-rest": {
     "key": "{button.default.fgColor.rest}",
     "$extensions": {
@@ -8742,31 +8923,51 @@
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#0d419d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [218.3, 84.7, 33.3],
+            "hex": "#0d419d"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#0d419d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [218.3, 84.7, 33.3],
+            "hex": "#0d419d"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -8776,7 +8977,11 @@
     "filePath": "src/tokens/component/button.json5",
     "isSource": true,
     "original": {
-      "$value": "#033f9d",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [216.6, 96.3, 31.4],
+        "hex": "#033f9d"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -8792,31 +8997,51 @@
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#0d419d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [218.3, 84.7, 33.3],
+              "hex": "#0d419d"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#0d419d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [218.3, 84.7, 33.3],
+              "hex": "#0d419d"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -8847,7 +9072,11 @@
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#212830",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212, 18.5, 15.9],
+            "hex": "#212830"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -8873,7 +9102,11 @@
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#212830",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212, 18.5, 15.9],
+              "hex": "#212830"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -8904,7 +9137,11 @@
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#262c36",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [217.5, 17.4, 18],
+            "hex": "#262c36"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -8930,7 +9167,11 @@
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#262c36",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [217.5, 17.4, 18],
+              "hex": "#262c36"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9162,7 +9403,12 @@
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#478be680",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [214.3, 76.1, 59],
+            "hex": "#478be6"
+          },
+          "alpha": 0.502,
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9190,7 +9436,12 @@
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#478be680",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [214.3, 76.1, 59],
+              "hex": "#478be6"
+            },
+            "alpha": 0.502,
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9415,13 +9666,21 @@
       },
       "org.primer.overrides": {
         "dark": {
-          "$value": "#2E9A40",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [130, 54, 39.2],
+            "hex": "#2E9A40"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#428f46",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [123.1, 36.8, 41],
+            "hex": "#428f46"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9433,61 +9692,101 @@
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#3685f3",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [214.9, 88.7, 58.2],
+            "hex": "#3685f3"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#3685f3",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [214.9, 88.7, 58.2],
+            "hex": "#3685f3"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia": {
-          "$value": "#3685f3",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [214.9, 88.7, 58.2],
+            "hex": "#3685f3"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia-high-contrast": {
-          "$value": "#3685f3",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [214.9, 88.7, 58.2],
+            "hex": "#3685f3"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-high-contrast": {
-          "$value": "#109135",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [137.2, 80.1, 31.6],
+            "hex": "#109135"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia": {
-          "$value": "#075fc8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.6, 93.2, 40.6],
+            "hex": "#075fc8"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#075fc8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.6, 93.2, 40.6],
+            "hex": "#075fc8"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia": {
-          "$value": "#075fc8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.6, 93.2, 40.6],
+            "hex": "#075fc8"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#075fc8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.6, 93.2, 40.6],
+            "hex": "#075fc8"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#03501b",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [138.7, 92.8, 16.3],
+            "hex": "#03501b"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9497,7 +9796,11 @@
     "filePath": "src/tokens/component/button.json5",
     "isSource": true,
     "original": {
-      "$value": "#03501b",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [138.7, 92.8, 16.3],
+        "hex": "#03501b"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -9507,13 +9810,21 @@
         },
         "org.primer.overrides": {
           "dark": {
-            "$value": "#2E9A40",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [130, 54, 39.2],
+              "hex": "#2E9A40"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#428f46",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [123.1, 36.8, 41],
+              "hex": "#428f46"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9525,61 +9836,101 @@
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#3685f3",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [214.9, 88.7, 58.2],
+              "hex": "#3685f3"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#3685f3",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [214.9, 88.7, 58.2],
+              "hex": "#3685f3"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia": {
-            "$value": "#3685f3",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [214.9, 88.7, 58.2],
+              "hex": "#3685f3"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia-high-contrast": {
-            "$value": "#3685f3",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [214.9, 88.7, 58.2],
+              "hex": "#3685f3"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-high-contrast": {
-            "$value": "#109135",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [137.2, 80.1, 31.6],
+              "hex": "#109135"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia": {
-            "$value": "#075fc8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.6, 93.2, 40.6],
+              "hex": "#075fc8"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#075fc8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.6, 93.2, 40.6],
+              "hex": "#075fc8"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia": {
-            "$value": "#075fc8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.6, 93.2, 40.6],
+              "hex": "#075fc8"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#075fc8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.6, 93.2, 40.6],
+              "hex": "#075fc8"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#03501b",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [138.7, 92.8, 16.3],
+              "hex": "#03501b"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9604,25 +9955,41 @@
       },
       "org.primer.overrides": {
         "dark": {
-          "$value": "#105823",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [135.8, 69.2, 20.4],
+            "hex": "#105823"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#105823",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [135.8, 69.2, 20.4],
+            "hex": "#105823"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#5fabfe",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [211.3, 98.8, 68.4],
+            "hex": "#5fabfe"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#5fabfe",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [211.3, 98.8, 68.4],
+            "hex": "#5fabfe"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9640,37 +10007,61 @@
           "$type": "color"
         },
         "dark-high-contrast": {
-          "$value": "#048f2f",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [138.6, 94.6, 28.8],
+            "hex": "#048f2f"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia": {
-          "$value": "#92caff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [209.2, 100, 78.6],
+            "hex": "#92caff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#92caff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [209.2, 100, 78.6],
+            "hex": "#92caff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia": {
-          "$value": "#92caff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [209.2, 100, 78.6],
+            "hex": "#92caff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#92caff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [209.2, 100, 78.6],
+            "hex": "#92caff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#85cb97",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [135.4, 40.2, 65.9],
+            "hex": "#85cb97"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9680,7 +10071,11 @@
     "filePath": "src/tokens/component/button.json5",
     "isSource": true,
     "original": {
-      "$value": "#85cb97",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [135.4, 40.2, 65.9],
+        "hex": "#85cb97"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -9690,25 +10085,41 @@
         },
         "org.primer.overrides": {
           "dark": {
-            "$value": "#105823",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [135.8, 69.2, 20.4],
+              "hex": "#105823"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#105823",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [135.8, 69.2, 20.4],
+              "hex": "#105823"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#5fabfe",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [211.3, 98.8, 68.4],
+              "hex": "#5fabfe"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#5fabfe",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [211.3, 98.8, 68.4],
+              "hex": "#5fabfe"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9726,37 +10137,61 @@
             "$type": "color"
           },
           "dark-high-contrast": {
-            "$value": "#048f2f",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [138.6, 94.6, 28.8],
+              "hex": "#048f2f"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia": {
-            "$value": "#92caff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [209.2, 100, 78.6],
+              "hex": "#92caff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#92caff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [209.2, 100, 78.6],
+              "hex": "#92caff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia": {
-            "$value": "#92caff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [209.2, 100, 78.6],
+              "hex": "#92caff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#92caff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [209.2, 100, 78.6],
+              "hex": "#92caff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#85cb97",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [135.4, 40.2, 65.9],
+              "hex": "#85cb97"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9781,13 +10216,21 @@
       },
       "org.primer.overrides": {
         "dark": {
-          "$value": "#29903B",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [130.5, 55.7, 36.3],
+            "hex": "#29903B"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#3b8640",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [124, 38.9, 37.8],
+            "hex": "#3b8640"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9799,61 +10242,101 @@
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#2a7aef",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.6, 86, 55.1],
+            "hex": "#2a7aef"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#2a7aef",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.6, 86, 55.1],
+            "hex": "#2a7aef"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia": {
-          "$value": "#2a7aef",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.6, 86, 55.1],
+            "hex": "#2a7aef"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia-high-contrast": {
-          "$value": "#2a7aef",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.6, 86, 55.1],
+            "hex": "#2a7aef"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-high-contrast": {
-          "$value": "#08792b",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [138.6, 87.6, 25.3],
+            "hex": "#08792b"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia": {
-          "$value": "#0864d1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.5, 92.6, 42.5],
+            "hex": "#0864d1"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#0864d1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.5, 92.6, 42.5],
+            "hex": "#0864d1"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia": {
-          "$value": "#0864d1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.5, 92.6, 42.5],
+            "hex": "#0864d1"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#0864d1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [212.5, 92.6, 42.5],
+            "hex": "#0864d1"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#04571e",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [138.8, 91.2, 17.8],
+            "hex": "#04571e"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -9863,7 +10346,11 @@
     "filePath": "src/tokens/component/button.json5",
     "isSource": true,
     "original": {
-      "$value": "#04571e",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [138.8, 91.2, 17.8],
+        "hex": "#04571e"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -9873,13 +10360,21 @@
         },
         "org.primer.overrides": {
           "dark": {
-            "$value": "#29903B",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [130.5, 55.7, 36.3],
+              "hex": "#29903B"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#3b8640",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [124, 38.9, 37.8],
+              "hex": "#3b8640"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -9891,61 +10386,101 @@
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#2a7aef",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.6, 86, 55.1],
+              "hex": "#2a7aef"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#2a7aef",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.6, 86, 55.1],
+              "hex": "#2a7aef"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia": {
-            "$value": "#2a7aef",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.6, 86, 55.1],
+              "hex": "#2a7aef"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia-high-contrast": {
-            "$value": "#2a7aef",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.6, 86, 55.1],
+              "hex": "#2a7aef"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-high-contrast": {
-            "$value": "#08792b",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [138.6, 87.6, 25.3],
+              "hex": "#08792b"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia": {
-            "$value": "#0864d1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.5, 92.6, 42.5],
+              "hex": "#0864d1"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#0864d1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.5, 92.6, 42.5],
+              "hex": "#0864d1"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia": {
-            "$value": "#0864d1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.5, 92.6, 42.5],
+              "hex": "#0864d1"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#0864d1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [212.5, 92.6, 42.5],
+              "hex": "#0864d1"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#04571e",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [138.8, 91.2, 17.8],
+              "hex": "#04571e"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -10056,37 +10591,61 @@
       },
       "org.primer.overrides": {
         "dark": {
-          "$value": "#105823",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [135.8, 69.2, 20.4],
+            "hex": "#105823"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#105823",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [135.8, 69.2, 20.4],
+            "hex": "#105823"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia": {
-          "$value": "#5fabfe",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [211.3, 98.8, 68.4],
+            "hex": "#5fabfe"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#5fabfe",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [211.3, 98.8, 68.4],
+            "hex": "#5fabfe"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia": {
-          "$value": "#1158c7",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 84.3, 42.4],
+            "hex": "#1158c7"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia-high-contrast": {
-          "$value": "#1158c7",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 84.3, 42.4],
+            "hex": "#1158c7"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -10099,7 +10658,11 @@
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#85cb97",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [135.4, 40.2, 65.9],
+            "hex": "#85cb97"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -10109,7 +10672,11 @@
     "filePath": "src/tokens/component/button.json5",
     "isSource": true,
     "original": {
-      "$value": "#85cb97",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [135.4, 40.2, 65.9],
+        "hex": "#85cb97"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -10119,37 +10686,61 @@
         },
         "org.primer.overrides": {
           "dark": {
-            "$value": "#105823",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [135.8, 69.2, 20.4],
+              "hex": "#105823"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#105823",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [135.8, 69.2, 20.4],
+              "hex": "#105823"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia": {
-            "$value": "#5fabfe",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [211.3, 98.8, 68.4],
+              "hex": "#5fabfe"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#5fabfe",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [211.3, 98.8, 68.4],
+              "hex": "#5fabfe"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia": {
-            "$value": "#1158c7",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 84.3, 42.4],
+              "hex": "#1158c7"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia-high-contrast": {
-            "$value": "#1158c7",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 84.3, 42.4],
+              "hex": "#1158c7"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -10162,7 +10753,11 @@
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#85cb97",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [135.4, 40.2, 65.9],
+              "hex": "#85cb97"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -10404,13 +10999,21 @@
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -10436,13 +11039,21 @@
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -10457,6 +11068,35 @@
     "value": "#ffffff",
     "type": "color"
   },
+  "button-primary-iconColor-disabled": {
+    "key": "{button.primary.iconColor.disabled}",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component (internal)",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/component/button.json5",
+    "isSource": true,
+    "original": {
+      "$value": "{button.primary.fgColor.disabled}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component (internal)",
+          "scopes": ["fgColor"]
+        }
+      },
+      "key": "{button.primary.iconColor.disabled}"
+    },
+    "name": "button-primary-iconColor-disabled",
+    "attributes": {},
+    "path": ["button", "primary", "iconColor", "disabled"],
+    "value": "#ffffffcc",
+    "type": "color"
+  },
   "button-primary-iconColor-rest": {
     "key": "{button.primary.iconColor.rest}",
     "$extensions": {
@@ -10480,13 +11120,21 @@
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#ffffff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [0, 0, 100],
+            "hex": "#ffffff"
+          },
           "filePath": "src/tokens/component/button.json5",
           "isSource": true,
           "$type": "color"
@@ -10520,13 +11168,21 @@
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#ffffff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [0, 0, 100],
+              "hex": "#ffffff"
+            },
             "filePath": "src/tokens/component/button.json5",
             "isSource": true,
             "$type": "color"
@@ -13998,7 +14654,11 @@
     "filePath": "src/tokens/functional/color/syntax.json5",
     "isSource": true,
     "original": {
-      "$value": "#1b7c83",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [184, 65.8, 31],
+        "hex": "#1b7c83"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -14031,7 +14691,11 @@
     "filePath": "src/tokens/functional/color/syntax.json5",
     "isSource": true,
     "original": {
-      "$value": "#3192aa",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [191.9, 55.3, 42.9],
+        "hex": "#3192aa"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -16896,7 +17560,11 @@
       "org.primer.overrides": {
         "dark": "#454c54",
         "dark-dimmed": {
-          "$value": "#3d444d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [213.8, 11.6, 27.1],
+            "hex": "#3d444d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -16917,7 +17585,11 @@
         "org.primer.overrides": {
           "dark": "{borderColor.default}",
           "dark-dimmed": {
-            "$value": "#3d444d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [213.8, 11.6, 27.1],
+              "hex": "#3d444d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17048,49 +17720,81 @@
       "org.primer.overrides": {
         "dark": "#3685F3",
         "dark-high-contrast": {
-          "$value": "#3c79d0",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.3, 61.2, 52.5],
+            "hex": "#3c79d0"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia-high-contrast": {
-          "$value": "#3c79d0",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.3, 61.2, 52.5],
+            "hex": "#3c79d0"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#3c79d0",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.3, 61.2, 52.5],
+            "hex": "#3c79d0"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#3f7fdb",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.4, 68.4, 55.3],
+            "hex": "#3f7fdb"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#3c79d0",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.3, 61.2, 52.5],
+            "hex": "#3c79d0"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17100,7 +17804,11 @@
     "filePath": "src/tokens/functional/color/control.json5",
     "isSource": true,
     "original": {
-      "$value": "#033f9d",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [216.6, 96.3, 31.4],
+        "hex": "#033f9d"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -17111,49 +17819,81 @@
         "org.primer.overrides": {
           "dark": "#3685F3",
           "dark-high-contrast": {
-            "$value": "#3c79d0",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.3, 61.2, 52.5],
+              "hex": "#3c79d0"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia-high-contrast": {
-            "$value": "#3c79d0",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.3, 61.2, 52.5],
+              "hex": "#3c79d0"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#3c79d0",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.3, 61.2, 52.5],
+              "hex": "#3c79d0"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#3f7fdb",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.4, 68.4, 55.3],
+              "hex": "#3f7fdb"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#3c79d0",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.3, 61.2, 52.5],
+              "hex": "#3c79d0"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17214,49 +17954,81 @@
       "org.primer.overrides": {
         "dark": "#2A7AEF",
         "dark-high-contrast": {
-          "$value": "#2b64c1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [217.2, 63.6, 46.3],
+            "hex": "#2b64c1"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#2b64c1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [217.2, 63.6, 46.3],
+            "hex": "#2b64c1"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-protanopia-deuteranopia-high-contrast": {
-          "$value": "#2b64c1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [217.2, 63.6, 46.3],
+            "hex": "#2b64c1"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#3876d3",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216, 63.8, 52.4],
+            "hex": "#3876d3"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#2b64c1",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [217.2, 63.6, 46.3],
+            "hex": "#2b64c1"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#0344a8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.4, 96.5, 33.5],
+            "hex": "#0344a8"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#0344a8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.4, 96.5, 33.5],
+            "hex": "#0344a8"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#0344a8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.4, 96.5, 33.5],
+            "hex": "#0344a8"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17266,7 +18038,11 @@
     "filePath": "src/tokens/functional/color/control.json5",
     "isSource": true,
     "original": {
-      "$value": "#0344a8",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [216.4, 96.5, 33.5],
+        "hex": "#0344a8"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -17277,49 +18053,81 @@
         "org.primer.overrides": {
           "dark": "#2A7AEF",
           "dark-high-contrast": {
-            "$value": "#2b64c1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [217.2, 63.6, 46.3],
+              "hex": "#2b64c1"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#2b64c1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [217.2, 63.6, 46.3],
+              "hex": "#2b64c1"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-protanopia-deuteranopia-high-contrast": {
-            "$value": "#2b64c1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [217.2, 63.6, 46.3],
+              "hex": "#2b64c1"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#3876d3",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216, 63.8, 52.4],
+              "hex": "#3876d3"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#2b64c1",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [217.2, 63.6, 46.3],
+              "hex": "#2b64c1"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#0344a8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.4, 96.5, 33.5],
+              "hex": "#0344a8"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#0344a8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.4, 96.5, 33.5],
+              "hex": "#0344a8"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#0344a8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.4, 96.5, 33.5],
+              "hex": "#0344a8"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17398,7 +18206,11 @@
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#3f7fdb",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.4, 68.4, 55.3],
+            "hex": "#3f7fdb"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17410,19 +18222,31 @@
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#033f9d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.6, 96.3, 31.4],
+            "hex": "#033f9d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17432,7 +18256,11 @@
     "filePath": "src/tokens/functional/color/control.json5",
     "isSource": true,
     "original": {
-      "$value": "#033f9d",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [216.6, 96.3, 31.4],
+        "hex": "#033f9d"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -17461,7 +18289,11 @@
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#3f7fdb",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.4, 68.4, 55.3],
+              "hex": "#3f7fdb"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17473,19 +18305,31 @@
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#033f9d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.6, 96.3, 31.4],
+              "hex": "#033f9d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17564,7 +18408,11 @@
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#3876d3",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216, 63.8, 52.4],
+            "hex": "#3876d3"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17576,19 +18424,31 @@
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#0344a8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.4, 96.5, 33.5],
+            "hex": "#0344a8"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#0344a8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.4, 96.5, 33.5],
+            "hex": "#0344a8"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-protanopia-deuteranopia-high-contrast": {
-          "$value": "#0344a8",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [216.4, 96.5, 33.5],
+            "hex": "#0344a8"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17598,7 +18458,11 @@
     "filePath": "src/tokens/functional/color/control.json5",
     "isSource": true,
     "original": {
-      "$value": "#0344a8",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [216.4, 96.5, 33.5],
+        "hex": "#0344a8"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -17627,7 +18491,11 @@
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#3876d3",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216, 63.8, 52.4],
+              "hex": "#3876d3"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17639,19 +18507,31 @@
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#0344a8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.4, 96.5, 33.5],
+              "hex": "#0344a8"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#0344a8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.4, 96.5, 33.5],
+              "hex": "#0344a8"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-protanopia-deuteranopia-high-contrast": {
-            "$value": "#0344a8",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [216.4, 96.5, 33.5],
+              "hex": "#0344a8"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -17843,21 +18723,33 @@
           "$type": "color"
         },
         "dark-high-contrast": {
-          "$value": "#c51120",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [355, 84.1, 42],
+            "hex": "#c51120"
+          },
           "alpha": 1,
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed-high-contrast": {
-          "$value": "#c51120",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [355, 84.1, 42],
+            "hex": "#c51120"
+          },
           "alpha": 1,
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-tritanopia-high-contrast": {
-          "$value": "#c51120",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [355, 84.1, 42],
+            "hex": "#c51120"
+          },
           "alpha": 1,
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
@@ -17870,13 +18762,21 @@
           "$type": "color"
         },
         "light-high-contrast": {
-          "$value": "#8c0b1d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [351.6, 85.4, 29.6],
+            "hex": "#8c0b1d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
         },
         "light-tritanopia-high-contrast": {
-          "$value": "#8c0b1d",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [351.6, 85.4, 29.6],
+            "hex": "#8c0b1d"
+          },
           "filePath": "src/tokens/functional/color/control.json5",
           "isSource": true,
           "$type": "color"
@@ -17892,7 +18792,11 @@
     "filePath": "src/tokens/functional/color/control.json5",
     "isSource": true,
     "original": {
-      "$value": "#8c0b1d",
+      "$value": {
+        "colorSpace": "hsl",
+        "components": [351.6, 85.4, 29.6],
+        "hex": "#8c0b1d"
+      },
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -17916,21 +18820,33 @@
             "$type": "color"
           },
           "dark-high-contrast": {
-            "$value": "#c51120",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [355, 84.1, 42],
+              "hex": "#c51120"
+            },
             "alpha": 1,
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed-high-contrast": {
-            "$value": "#c51120",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [355, 84.1, 42],
+              "hex": "#c51120"
+            },
             "alpha": 1,
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-tritanopia-high-contrast": {
-            "$value": "#c51120",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [355, 84.1, 42],
+              "hex": "#c51120"
+            },
             "alpha": 1,
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
@@ -17943,13 +18859,21 @@
             "$type": "color"
           },
           "light-high-contrast": {
-            "$value": "#8c0b1d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [351.6, 85.4, 29.6],
+              "hex": "#8c0b1d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
           },
           "light-tritanopia-high-contrast": {
-            "$value": "#8c0b1d",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [351.6, 85.4, 29.6],
+              "hex": "#8c0b1d"
+            },
             "filePath": "src/tokens/functional/color/control.json5",
             "isSource": true,
             "$type": "color"
@@ -47355,14 +48279,22 @@
       },
       "org.primer.overrides": {
         "dark": {
-          "$value": "#3a8cfd",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [214.8, 98, 61],
+            "hex": "#3a8cfd"
+          },
           "alpha": 0.36,
           "filePath": "src/tokens/component/reactionButton.json5",
           "isSource": true,
           "$type": "color"
         },
         "dark-dimmed": {
-          "$value": "#4285e5",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [215.3, 75.8, 57.8],
+            "hex": "#4285e5"
+          },
           "alpha": 0.36,
           "filePath": "src/tokens/component/reactionButton.json5",
           "isSource": true,
@@ -47370,7 +48302,11 @@
         },
         "light-high-contrast": "#c7e9ff",
         "dark-high-contrast": {
-          "$value": "#5dadff",
+          "$value": {
+            "colorSpace": "hsl",
+            "components": [210.4, 100, 68.2],
+            "hex": "#5dadff"
+          },
           "alpha": 0.36,
           "filePath": "src/tokens/component/reactionButton.json5",
           "isSource": true,
@@ -47391,14 +48327,22 @@
         },
         "org.primer.overrides": {
           "dark": {
-            "$value": "#3a8cfd",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [214.8, 98, 61],
+              "hex": "#3a8cfd"
+            },
             "alpha": 0.36,
             "filePath": "src/tokens/component/reactionButton.json5",
             "isSource": true,
             "$type": "color"
           },
           "dark-dimmed": {
-            "$value": "#4285e5",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [215.3, 75.8, 57.8],
+              "hex": "#4285e5"
+            },
             "alpha": 0.36,
             "filePath": "src/tokens/component/reactionButton.json5",
             "isSource": true,
@@ -47406,7 +48350,11 @@
           },
           "light-high-contrast": "#c7e9ff",
           "dark-high-contrast": {
-            "$value": "#5dadff",
+            "$value": {
+              "colorSpace": "hsl",
+              "components": [210.4, 100, 68.2],
+              "hex": "#5dadff"
+            },
             "alpha": 0.36,
             "filePath": "src/tokens/component/reactionButton.json5",
             "isSource": true,
@@ -47736,6 +48684,147 @@
           "filePath": "src/tokens/functional/shadow/shadow.json5",
           "isSource": true,
           "$type": "shadow"
+        },
+        "light-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.24,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 40,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 80,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 0,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
+        },
+        "light-protanopia-deuteranopia-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.24,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 40,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 80,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 0,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
+        },
+        "light-tritanopia-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.24,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 40,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 80,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 0,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
         }
       },
       "org.primer.llm": {
@@ -47749,7 +48838,7 @@
       "$value": [
         {
           "color": "{overlay.borderColor}",
-          "alpha": 0,
+          "alpha": 1,
           "offsetX": {
             "value": 0,
             "unit": "px"
@@ -47842,6 +48931,147 @@
             "filePath": "src/tokens/functional/shadow/shadow.json5",
             "isSource": true,
             "$type": "shadow"
+          },
+          "light-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.24,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 40,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 80,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 0,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
+          },
+          "light-protanopia-deuteranopia-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.24,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 40,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 80,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 0,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
+          },
+          "light-tritanopia-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.24,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 40,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 80,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 0,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
           }
         },
         "org.primer.llm": {
@@ -48142,6 +49372,327 @@
           "filePath": "src/tokens/functional/shadow/shadow.json5",
           "isSource": true,
           "$type": "shadow"
+        },
+        "light-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 8,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 16,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -4,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 4,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 32,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -4,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 24,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 48,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -12,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 48,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 96,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -24,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
+        },
+        "light-protanopia-deuteranopia-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 8,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 16,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -4,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 4,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 32,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -4,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 24,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 48,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -12,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 48,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 96,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -24,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
+        },
+        "light-tritanopia-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 8,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 16,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -4,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 4,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 32,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -4,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 24,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 48,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -12,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.08,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 48,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 96,
+                "unit": "px"
+              },
+              "spread": {
+                "value": -24,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
         }
       },
       "org.primer.llm": {
@@ -48155,7 +49706,7 @@
       "$value": [
         {
           "color": "{overlay.borderColor}",
-          "alpha": 0,
+          "alpha": 1,
           "offsetX": {
             "value": 0,
             "unit": "px"
@@ -48368,6 +49919,327 @@
             "filePath": "src/tokens/functional/shadow/shadow.json5",
             "isSource": true,
             "$type": "shadow"
+          },
+          "light-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 8,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 16,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -4,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 4,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 32,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -4,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 24,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 48,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -12,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 48,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 96,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -24,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
+          },
+          "light-protanopia-deuteranopia-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 8,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 16,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -4,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 4,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 32,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -4,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 24,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 48,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -12,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 48,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 96,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -24,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
+          },
+          "light-tritanopia-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 8,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 16,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -4,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 4,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 32,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -4,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 24,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 48,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -12,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.08,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 48,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 96,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": -24,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
           }
         },
         "org.primer.llm": {
@@ -48674,6 +50546,147 @@
           "filePath": "src/tokens/functional/shadow/shadow.json5",
           "isSource": true,
           "$type": "shadow"
+        },
+        "light-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.32,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 56,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 112,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 0,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
+        },
+        "light-protanopia-deuteranopia-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.32,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 56,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 112,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 0,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
+        },
+        "light-tritanopia-high-contrast": {
+          "$value": [
+            {
+              "color": "#454c54",
+              "alpha": 1,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 0,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 0,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 1,
+                "unit": "px"
+              }
+            },
+            {
+              "color": "#25292e",
+              "alpha": 0.32,
+              "offsetX": {
+                "value": 0,
+                "unit": "px"
+              },
+              "offsetY": {
+                "value": 56,
+                "unit": "px"
+              },
+              "blur": {
+                "value": 112,
+                "unit": "px"
+              },
+              "spread": {
+                "value": 0,
+                "unit": "px"
+              }
+            }
+          ],
+          "filePath": "src/tokens/functional/shadow/shadow.json5",
+          "isSource": true,
+          "$type": "shadow"
         }
       },
       "org.primer.llm": {
@@ -48687,7 +50700,7 @@
       "$value": [
         {
           "color": "{overlay.borderColor}",
-          "alpha": 0,
+          "alpha": 1,
           "offsetX": {
             "value": 0,
             "unit": "px"
@@ -48780,6 +50793,147 @@
             "filePath": "src/tokens/functional/shadow/shadow.json5",
             "isSource": true,
             "$type": "shadow"
+          },
+          "light-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.32,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 56,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 112,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 0,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
+          },
+          "light-protanopia-deuteranopia-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.32,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 56,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 112,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 0,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
+          },
+          "light-tritanopia-high-contrast": {
+            "$value": [
+              {
+                "color": "{overlay.borderColor}",
+                "alpha": 1,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 1,
+                  "unit": "px"
+                }
+              },
+              {
+                "color": "{base.color.neutral.12}",
+                "alpha": 0.32,
+                "offsetX": {
+                  "value": 0,
+                  "unit": "px"
+                },
+                "offsetY": {
+                  "value": 56,
+                  "unit": "px"
+                },
+                "blur": {
+                  "value": 112,
+                  "unit": "px"
+                },
+                "spread": {
+                  "value": 0,
+                  "unit": "px"
+                }
+              }
+            ],
+            "filePath": "src/tokens/functional/shadow/shadow.json5",
+            "isSource": true,
+            "$type": "shadow"
           }
         },
         "org.primer.llm": {