Skip to content

High contrast themes PoC: DO NOT MERGE #1190

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Draft
wants to merge 32 commits into
base: main
Choose a base branch
from
Draft

High contrast themes PoC: DO NOT MERGE #1190

wants to merge 32 commits into from
+2,558 −486

Conversation

langermank
Copy link
Contributor

WIP

@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Feb 27, 2025 •
edited
Loading

⚠️ No Changeset found

Latest commit: 5c0cae4

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Feb 27, 2025 •
edited
Loading

Design Token Diff (StyleLint)

The message is too long to be displayed here. For more details, please check the job summary.

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Feb 27, 2025 •
edited
Loading

Design Token Diff (Figma)

/figma/figma.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/figma.json	2025-04-26 15:40:07.709041284 +0000
@@ -25,20 +25,20 @@
       "component"
     ]
   },
-    "base/color/dark-dimmed": {
+    "base/color/dark": {
     "modes": [
       "default"
     ],
     "groups": [
-        "base/color/dark-dimmed"
+        "base/color/dark"
     ]
   },
-    "base/color/dark": {
+    "base/color/dark-dimmed": {
     "modes": [
       "default"
     ],
     "groups": [
-        "base/color/dark"
+        "base/color/dark-dimmed"
     ]
   },
   "base/color/dark-high-contrast": {
@@ -75,7 +75,12 @@
       "light protanopia deuteranopia",
       "dark protanopia deuteranopia",
       "light tritanopia",
-        "dark tritanopia"
+        "dark tritanopia",
+        "dark protanopia deuteranopia high contrast",
+        "dark dimmed high contrast",
+        "dark tritanopia high contrast",
+        "light protanopia deuteranopia high contrast",
+        "light tritanopia high contrast"
     ],
     "groups": [
       "shadow",
@@ -110,13 +115,18 @@
   "dist/figma/scales/dark.json",
   "dist/figma/scales/light-high-constrast.json",
   "dist/figma/scales/light.json",
+    "dist/figma/themes/dark-colorblind-high-contrast.json",
   "dist/figma/themes/dark-colorblind.json",
+    "dist/figma/themes/dark-dimmed-high-contrast.json",
   "dist/figma/themes/dark-dimmed.json",
   "dist/figma/themes/dark-high-contrast.json",
+    "dist/figma/themes/dark-tritanopia-high-contrast.json",
   "dist/figma/themes/dark-tritanopia.json",
   "dist/figma/themes/dark.json",
+    "dist/figma/themes/light-colorblind-high-contrast.json",
   "dist/figma/themes/light-colorblind.json",
   "dist/figma/themes/light-high-contrast.json",
+    "dist/figma/themes/light-tritanopia-high-contrast.json",
   "dist/figma/themes/light-tritanopia.json",
   "dist/figma/themes/light.json",
   "dist/figma/typography/typography.json"

/figma/scales/dark-dimmed.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/scales/dark-dimmed.json	2025-04-26 15:39:57.973003699 +0000
@@ -2,29 +2,29 @@
 {
   "name": "base/color/black",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
-    "refId": "base/color/dark-dimmed/base/color/black",
-    "collection": "base/color/dark-dimmed",
+    "refId": "base/color/dark/base/color/black",
+    "collection": "base/color/dark",
   "mode": "default",
-    "group": "base/color/dark-dimmed",
+    "group": "base/color/dark",
   "scopes": ["ALL_SCOPES"]
 },
 {
   "name": "base/color/inset",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
   "refId": "base/color/dark/base/color/inset",
-    "reference": "base/color/dark-dimmed/base/color/black",
+    "reference": "base/color/dark/base/color/black",
   "collection": "base/color/dark",
   "mode": "default",
   "group": "base/color/dark",
@@ -64,14 +64,14 @@
 {
   "name": "base/color/neutral/0",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
   "refId": "base/color/dark/base/color/neutral/0",
-    "reference": "base/color/dark-dimmed/base/color/black",
+    "reference": "base/color/dark/base/color/black",
   "collection": "base/color/dark",
   "mode": "default",
   "group": "base/color/dark",

/figma/themes/dark-colorblind.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/dark-colorblind.json	2025-04-26 15:40:03.922038134 +0000
@@ -1341,12 +1341,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.1,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/dark/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -1358,7 +1357,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/hover",
@@ -1374,7 +1373,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/active",
@@ -1959,6 +1958,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -2015,13 +2015,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.7098039215686275,
-      "g": 0.3254901960784314,
+      "r": 0.7411764705882353,
+      "g": 0.33725490196078434,
     "b": 0.11372549019607843,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -2065,7 +2066,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/hover",
@@ -2081,7 +2082,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/active",
@@ -2844,12 +2845,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -2861,12 +2861,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -2878,12 +2877,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -2895,12 +2893,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",
@@ -2912,12 +2909,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark protanopia deuteranopia",
   "group": "component (internal)",

/figma/themes/dark-dimmed.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/dark-dimmed.json	2025-04-26 15:40:01.998007940 +0000
@@ -38,9 +38,9 @@
 {
   "name": "shadow/inset/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.24
   },
   "type": "COLOR",
@@ -88,9 +88,9 @@
 {
   "name": "shadow/resting/xsmall/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.8
   },
   "type": "COLOR",
@@ -138,9 +138,9 @@
 {
   "name": "shadow/resting/small/1/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.6
   },
   "type": "COLOR",
@@ -188,9 +188,9 @@
 {
   "name": "shadow/resting/small/2/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.6
   },
   "type": "COLOR",
@@ -238,9 +238,9 @@
 {
   "name": "shadow/resting/medium/1/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -288,9 +288,9 @@
 {
   "name": "shadow/resting/medium/2/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.8
   },
   "type": "COLOR",
@@ -388,9 +388,9 @@
 {
   "name": "shadow/floating/small/2/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -438,9 +438,9 @@
 {
   "name": "shadow/floating/small/3/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -538,9 +538,9 @@
 {
   "name": "shadow/floating/medium/2/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -588,9 +588,9 @@
 {
   "name": "shadow/floating/medium/3/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -638,9 +638,9 @@
 {
   "name": "shadow/floating/medium/4/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -688,9 +688,9 @@
 {
   "name": "shadow/floating/medium/5/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 0.4
   },
   "type": "COLOR",
@@ -788,9 +788,9 @@
 {
   "name": "shadow/floating/large/2/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
@@ -888,9 +888,9 @@
 {
   "name": "shadow/floating/xlarge/2/color",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
@@ -1320,9 +1320,9 @@
 {
   "name": "button/primary/bgColor/disabled",
   "value": {
-      "r": 0.3137254901960784,
-      "g": 0.6352941176470588,
-      "b": 0.32941176470588235,
+      "r": 0.06274509803921569,
+      "g": 0.34509803921568627,
+      "b": 0.13725490196078433,
     "a": 1
   },
   "type": "COLOR",
@@ -1338,12 +1338,11 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.1,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/dark/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -1355,7 +1354,7 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/hover",
@@ -1371,7 +1370,7 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/active",
@@ -1384,9 +1383,9 @@
 {
   "name": "button/primary/borderColor/disabled",
   "value": {
-      "r": 0.3137254901960784,
-      "g": 0.6352941176470588,
-      "b": 0.32941176470588235,
+      "r": 0.06274509803921569,
+      "g": 0.34509803921568627,
+      "b": 0.13725490196078433,
     "a": 1
   },
   "type": "COLOR",
@@ -1898,14 +1897,13 @@
 {
   "name": "button/danger/fgColor/hover",
   "value": {
-      "r": 0.803921568627451,
-      "g": 0.8509803921568627,
-      "b": 0.8980392156862745,
+      "r": 1,
+      "g": 1,
+      "b": 1,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/fgColor/hover",
-    "reference": "base/color/dark/base/color/neutral/13",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -1914,14 +1912,13 @@
 {
   "name": "button/danger/fgColor/active",
   "value": {
-      "r": 0.803921568627451,
-      "g": 0.8509803921568627,
-      "b": 0.8980392156862745,
+      "r": 1,
+      "g": 1,
+      "b": 1,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/fgColor/active",
-    "reference": "base/color/dark/base/color/neutral/13",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -1954,6 +1951,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -2010,13 +2008,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.7647058823529411,
-      "g": 0.23921568627450981,
-      "b": 0.2196078431372549,
+      "r": 0.788235294117647,
+      "g": 0.23529411764705882,
+      "b": 0.21568627450980393,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -2060,7 +2059,7 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/hover",
@@ -2076,7 +2075,7 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/active",
@@ -2839,12 +2838,11 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/dark-dimmed/base/color/white",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -2856,12 +2854,11 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/dark-dimmed/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -2873,12 +2870,11 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/dark-dimmed/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -2890,12 +2886,11 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/dark-dimmed/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -2907,12 +2902,11 @@
     "r": 0.803921568627451,
     "g": 0.8509803921568627,
     "b": 0.8980392156862745,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/dark-dimmed/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark dimmed",
   "group": "component (internal)",
@@ -5825,9 +5819,9 @@
 {
   "name": "bgColor/black",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
@@ -7351,9 +7345,9 @@
 {
   "name": "control/checked/fgColor/disabled",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
@@ -9774,9 +9768,9 @@
 {
   "name": "fgColor/onInverse",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
@@ -9806,9 +9800,9 @@
 {
   "name": "fgColor/black",
   "value": {
-      "r": 0.10980392156862745,
-      "g": 0.12941176470588237,
-      "b": 0.1568627450980392,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",

/figma/themes/dark-high-contrast.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/dark-high-contrast.json	2025-04-26 15:40:04.913038958 +0000
@@ -935,15 +935,14 @@
 {
   "name": "avatar/borderColor",
   "value": {
-      "r": 1,
-      "g": 1,
-      "b": 1,
-      "a": 0.9
+      "r": 0.7176470588235294,
+      "g": 0.7411764705882353,
+      "b": 0.7843137254901961,
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.9,
   "refId": "mode/avatar/borderColor",
-    "reference": "base/color/dark/base/color/neutral/13",
+    "reference": "mode/borderColor/emphasis",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -1361,9 +1360,8 @@
     "a": 1
   },
   "type": "COLOR",
-    "alpha": 1,
   "refId": "mode/button/primary/borderColor/hover",
-    "reference": "base/color/dark-high-contrast/base/color/green/2",
+    "reference": "mode/button/primary/borderColor/rest",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -1378,9 +1376,8 @@
     "a": 1
   },
   "type": "COLOR",
-    "alpha": 1,
   "refId": "mode/button/primary/borderColor/active",
-    "reference": "base/color/dark-high-contrast/base/color/green/2",
+    "reference": "mode/button/primary/borderColor/rest",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -1965,6 +1962,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -2012,7 +2010,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/hover",
-    "reference": "mode/bgColor/danger-emphasis",
+    "reference": "base/color/dark-high-contrast/base/color/red/9",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -2771,14 +2769,14 @@
 {
   "name": "contribution/default/bgColor/0",
   "value": {
-      "r": 0.08235294117647059,
-      "g": 0.10588235294117647,
-      "b": 0.13725490196078433,
+      "r": 0.00392156862745098,
+      "g": 0.01568627450980392,
+      "b": 0.03529411764705882,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/contribution/default/bgColor/0",
-    "reference": "base/color/dark/base/color/neutral/2",
+    "reference": "base/color/dark/base/color/neutral/0",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -2854,10 +2852,10 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
+    "alpha": 1,
   "refId": "mode/contribution/default/borderColor/0",
   "reference": "base/color/dark/base/color/white",
   "collection": "mode",
@@ -2871,12 +2869,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -2888,12 +2885,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -2905,12 +2901,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",
@@ -2922,12 +2917,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark high contrast",
   "group": "component (internal)",

/figma/themes/dark-tritanopia.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/dark-tritanopia.json	2025-04-26 15:40:02.967037339 +0000
@@ -1340,12 +1340,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.1,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/dark/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -1357,7 +1356,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/hover",
@@ -1373,7 +1372,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/active",
@@ -1954,6 +1953,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -2010,13 +2010,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.8156862745098039,
-      "g": 0.20784313725490197,
+      "r": 0.8549019607843137,
+      "g": 0.21176470588235294,
     "b": 0.2,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -2060,7 +2061,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/hover",
@@ -2076,7 +2077,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/active",
@@ -2839,12 +2840,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -2856,12 +2856,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -2873,12 +2872,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -2890,12 +2888,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",
@@ -2907,12 +2904,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark tritanopia",
   "group": "component (internal)",

/figma/themes/dark.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/dark.json	2025-04-26 15:40:01.517999017 +0000
@@ -6454,12 +6454,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.1,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/dark/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -6471,7 +6470,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/hover",
@@ -6487,7 +6486,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/primary/borderColor/active",
@@ -7071,6 +7070,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -7127,13 +7127,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.8156862745098039,
-      "g": 0.20784313725490197,
+      "r": 0.8549019607843137,
+      "g": 0.21176470588235294,
     "b": 0.2,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -7177,7 +7178,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/hover",
@@ -7193,7 +7194,7 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.1
+      "a": 0.15
   },
   "type": "COLOR",
   "refId": "mode/button/danger/borderColor/active",
@@ -7956,12 +7957,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -7973,12 +7973,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -7990,12 +7989,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -8007,12 +8005,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",
@@ -8024,12 +8021,11 @@
     "r": 1,
     "g": 1,
     "b": 1,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/dark/base/color/white",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "dark",
   "group": "component (internal)",

/figma/themes/light-colorblind.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/light-colorblind.json	2025-04-26 15:40:00.115000870 +0000
@@ -1343,9 +1343,8 @@
     "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.15,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/light/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -1958,7 +1957,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
-    "reference": "mode/fgColor/danger",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -1999,14 +1998,14 @@
 {
   "name": "button/danger/bgColor/hover",
   "value": {
-      "r": 0.5843137254901961,
-      "g": 0.2196078431372549,
+      "r": 0.7372549019607844,
+      "g": 0.2980392156862745,
     "b": 0,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/hover",
-    "reference": "base/color/light/base/color/orange/6",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2015,13 +2014,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.49411764705882355,
-      "g": 0.1843137254901961,
+      "r": 0.5843137254901961,
+      "g": 0.2196078431372549,
     "b": 0,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "base/color/light/base/color/orange/6",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2392,13 +2392,14 @@
 {
   "name": "buttonCounter/danger/fgColor/rest",
   "value": {
-      "r": 0.7607843137254902,
-      "g": 0.10980392156862745,
-      "b": 0.17254901960784313,
+      "r": 0.5843137254901961,
+      "g": 0.2196078431372549,
+      "b": 0,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/buttonCounter/danger/fgColor/rest",
+    "reference": "base/color/light/base/color/orange/6",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2843,12 +2844,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2860,12 +2860,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2877,12 +2876,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2894,12 +2892,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",
@@ -2911,12 +2908,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light protanopia deuteranopia",
   "group": "component (internal)",

/figma/themes/light-high-contrast.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/light-high-contrast.json	2025-04-26 15:40:01.048999637 +0000
@@ -934,15 +934,14 @@
 {
   "name": "avatar/borderColor",
   "value": {
-      "r": 0.00392156862745098,
-      "g": 0.01568627450980392,
-      "b": 0.03529411764705882,
-      "a": 0.9
+      "r": 0.27058823529411763,
+      "g": 0.2980392156862745,
+      "b": 0.32941176470588235,
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.9,
   "refId": "mode/avatar/borderColor",
-    "reference": "base/color/light/base/color/neutral/13",
+    "reference": "mode/borderColor/emphasis",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -1361,9 +1360,8 @@
     "a": 1
   },
   "type": "COLOR",
-    "alpha": 1,
   "refId": "mode/button/primary/borderColor/hover",
-    "reference": "base/color/light-high-contrast/base/color/green/7",
+    "reference": "mode/button/primary/borderColor/rest",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -1378,9 +1376,8 @@
     "a": 1
   },
   "type": "COLOR",
-    "alpha": 1,
   "refId": "mode/button/primary/borderColor/active",
-    "reference": "base/color/light-high-contrast/base/color/green/7",
+    "reference": "mode/button/primary/borderColor/rest",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -1806,14 +1803,14 @@
 {
   "name": "button/outline/borderColor/hover",
   "value": {
-      "r": 0.00392156862745098,
-      "g": 0.23921568627450981,
-      "b": 0.0784313725490196,
+      "r": 0.00784313725490196,
+      "g": 0.1843137254901961,
+      "b": 0.47843137254901963,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/outline/borderColor/hover",
-    "reference": "mode/button/primary/borderColor/hover",
+    "reference": "base/color/light-high-contrast/base/color/blue/7",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -1822,9 +1819,9 @@
 {
   "name": "button/outline/borderColor/active",
   "value": {
-      "r": 0.00392156862745098,
-      "g": 0.23921568627450981,
-      "b": 0.0784313725490196,
+      "r": 0.00784313725490196,
+      "g": 0.1843137254901961,
+      "b": 0.47843137254901963,
     "a": 1
   },
   "type": "COLOR",
@@ -1960,7 +1957,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
-    "reference": "mode/fgColor/danger",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2001,14 +1998,14 @@
 {
   "name": "button/danger/bgColor/hover",
   "value": {
-      "r": 0.5254901960784314,
-      "g": 0.023529411764705882,
-      "b": 0.11372549019607843,
+      "r": 0.6274509803921569,
+      "g": 0.06666666666666667,
+      "b": 0.12156862745098039,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/hover",
-    "reference": "base/color/light-high-contrast/base/color/red/6",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2017,13 +2014,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.4549019607843137,
-      "g": 0.01568627450980392,
-      "b": 0.10196078431372549,
+      "r": 0.5254901960784314,
+      "g": 0.023529411764705882,
+      "b": 0.11372549019607843,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "base/color/light-high-contrast/base/color/red/6",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2395,13 +2393,14 @@
 {
   "name": "buttonCounter/danger/fgColor/rest",
   "value": {
-      "r": 0.596078431372549,
-      "g": 0.054901960784313725,
-      "b": 0.11764705882352941,
+      "r": 0.5254901960784314,
+      "g": 0.023529411764705882,
+      "b": 0.11372549019607843,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/buttonCounter/danger/fgColor/rest",
+    "reference": "mode/fgColor/danger",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2763,14 +2762,14 @@
 {
   "name": "contribution/default/bgColor/0",
   "value": {
-      "r": 0.9372549019607843,
-      "g": 0.9490196078431372,
-      "b": 0.9607843137254902,
+      "r": 1,
+      "g": 1,
+      "b": 1,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/contribution/default/bgColor/0",
-    "reference": "base/color/light/base/color/neutral/2",
+    "reference": "base/color/light/base/color/neutral/0",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2846,10 +2845,10 @@
     "r": 0.00392156862745098,
     "g": 0.01568627450980392,
     "b": 0.03529411764705882,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
+    "alpha": 1,
   "refId": "mode/contribution/default/borderColor/0",
   "reference": "base/color/light-high-contrast/base/color/black",
   "collection": "mode",
@@ -2863,12 +2862,11 @@
     "r": 0.00392156862745098,
     "g": 0.01568627450980392,
     "b": 0.03529411764705882,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/light-high-contrast/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2880,12 +2878,11 @@
     "r": 0.00392156862745098,
     "g": 0.01568627450980392,
     "b": 0.03529411764705882,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/light-high-contrast/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2897,12 +2894,11 @@
     "r": 0.00392156862745098,
     "g": 0.01568627450980392,
     "b": 0.03529411764705882,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/light-high-contrast/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",
@@ -2914,12 +2910,11 @@
     "r": 0.00392156862745098,
     "g": 0.01568627450980392,
     "b": 0.03529411764705882,
-      "a": 0.05
+      "a": 1
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/light-high-contrast/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light high contrast",
   "group": "component (internal)",

/figma/themes/light-tritanopia.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/light-tritanopia.json	2025-04-26 15:39:59.115002191 +0000
@@ -1343,9 +1343,8 @@
     "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.15,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/light/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -1958,7 +1957,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
-    "reference": "mode/fgColor/danger",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -1999,14 +1998,14 @@
 {
   "name": "button/danger/bgColor/hover",
   "value": {
-      "r": 0.6431372549019608,
-      "g": 0.054901960784313725,
-      "b": 0.14901960784313725,
+      "r": 0.8117647058823529,
+      "g": 0.13333333333333333,
+      "b": 0.1803921568627451,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/hover",
-    "reference": "base/color/light/base/color/red/6",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -2015,13 +2014,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.5450980392156862,
-      "g": 0.03137254901960784,
-      "b": 0.12549019607843137,
+      "r": 0.6431372549019608,
+      "g": 0.054901960784313725,
+      "b": 0.14901960784313725,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "base/color/light/base/color/red/6",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -2843,12 +2843,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -2860,12 +2859,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -2877,12 +2875,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -2894,12 +2891,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",
@@ -2911,12 +2907,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light tritanopia",
   "group": "component (internal)",

/figma/themes/light.json

 
+++ /home/runner/work/primitives/primitives/dist/figma/themes/light.json	2025-04-26 15:39:58.558002927 +0000
@@ -1343,9 +1343,8 @@
     "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.15,
   "refId": "mode/button/primary/borderColor/rest",
-    "reference": "base/color/light/base/color/neutral/13",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -1958,7 +1957,7 @@
   },
   "type": "COLOR",
   "refId": "mode/button/danger/iconColor/rest",
-    "reference": "mode/fgColor/danger",
+    "reference": "mode/button/danger/fgColor/rest",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -1999,14 +1998,14 @@
 {
   "name": "button/danger/bgColor/hover",
   "value": {
-      "r": 0.6431372549019608,
-      "g": 0.054901960784313725,
-      "b": 0.14901960784313725,
+      "r": 0.8117647058823529,
+      "g": 0.13333333333333333,
+      "b": 0.1803921568627451,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/hover",
-    "reference": "base/color/light/base/color/red/6",
+    "reference": "mode/bgColor/danger-emphasis",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -2015,13 +2014,14 @@
 {
   "name": "button/danger/bgColor/active",
   "value": {
-      "r": 0.5450980392156862,
-      "g": 0.03137254901960784,
-      "b": 0.12549019607843137,
+      "r": 0.6431372549019608,
+      "g": 0.054901960784313725,
+      "b": 0.14901960784313725,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/button/danger/bgColor/active",
+    "reference": "base/color/light/base/color/red/6",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -2843,12 +2843,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/0",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/borderColor/translucent",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -2860,12 +2859,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/1",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -2877,12 +2875,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/2",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -2894,12 +2891,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/3",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",
@@ -2911,12 +2907,11 @@
     "r": 0.12156862745098039,
     "g": 0.13725490196078433,
     "b": 0.1568627450980392,
-      "a": 0.05
+      "a": 0.15
   },
   "type": "COLOR",
-    "alpha": 0.05,
   "refId": "mode/contribution/default/borderColor/4",
-    "reference": "base/color/light/base/color/black",
+    "reference": "mode/contribution/default/borderColor/0",
   "collection": "mode",
   "mode": "light",
   "group": "component (internal)",

@github-actions github-actions bot temporarily deployed to Preview (Storybook) February 27, 2025 01:59 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 13, 2025 01:07 Inactive
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Mar 14, 2025 •
edited
Loading

Design Token Diff (CSS)

The message is too long to be displayed here. For more details, please check the job summary.

@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 14, 2025 23:05 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 25, 2025 18:45 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 25, 2025 20:29 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 25, 2025 22:14 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 25, 2025 22:33 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) March 25, 2025 22:34 Inactive
@langermank langermank added the update snapshots Update visual regression test snapshots label Mar 25, 2025
@langermank langermank changed the title High contrast themes POC High contrast themes PoC: DO NOT MERGE Mar 28, 2025
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 22, 2025 23:18 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 01:28 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 01:42 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 15:03 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 15:13 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 15:25 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 15:26 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 15:35 Inactive
@github-actions github-actions bot temporarily deployed to Preview (Storybook) April 26, 2025 15:37 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@jonrohan jonrohan jonrohan approved these changes

Copilot code review Copilot Awaiting requested review from Copilot Copilot will automatically review once the pull request is marked ready for review

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@langermank @jonrohan