Update base green 5 by lukasoppermann · Pull Request #1246 · primer/primitives

lukasoppermann · 2025-08-20T12:58:30Z

Summary

update base green 5 and 0
use base green 5 for bgColor-success-emphasis

This would fixes https://github.com/github/primer/issues/5737

What should reviewers focus on?

Steps to test:

changeset-bot · 2025-08-20T12:58:35Z

🦋 Changeset detected

Latest commit: f707815

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/primitives	Patch

Not sure what this means? Click here to learn what changesets are.

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

Copilot

Pull Request Overview

This PR updates the base green 5 color value and refactors the success emphasis background color to use a design token reference instead of a hardcoded value.

Updates base green 5 color from #1a7f37 to #1B8238
Replaces hardcoded color value with token reference {base.color.green.5} for bgColor-success-emphasis

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.

File	Description
src/tokens/base/color/light/light.json5	Updates the base green 5 color value
src/tokens/functional/color/bgColor.json5	Refactors success emphasis to use green 5 token reference

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
You can also share your feedback on Copilot code review for a chance to win a $100 gift card. Take the survey.}

github-actions · 2025-08-20T13:00:52Z

Design Token Diff (CSS)

/css/functional/themes/light.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/light.css	2025-08-20 13:06:23.136383967 +0000
@@ -2,7 +2,6 @@
[data-color-mode="light"][data-light-theme="light"] ::backdrop,
[data-color-mode="auto"][data-light-theme="light"],
[data-color-mode="auto"][data-light-theme="light"] ::backdrop {
-  --bgColor-success-emphasis: #1f883d;
 --button-outline-bgColor-active: #0757ba;
 --button-primary-bgColor-active: #197935;
 --button-primary-bgColor-disabled: #95d8a6;
@@ -30,12 +29,12 @@
 --bgColor-muted: #f6f8fa;
 --bgColor-neutral-emphasis: #59636e;
 --bgColor-neutral-muted: #818b981f;
-  --bgColor-open-emphasis: var(--bgColor-success-emphasis);
 --bgColor-severe-emphasis: #bc4c00;
 --bgColor-severe-muted: #fff1e5;
 --bgColor-sponsors-emphasis: #bf3989;
 --bgColor-sponsors-muted: #ffeff7;
-  --bgColor-success-muted: #dafbe1;
+  --bgColor-success-emphasis: #1b8238;
+  --bgColor-success-muted: #e3fce9;
 --bgColor-transparent: #ffffff00;
 --borderColor-accent-emphasis: #0969da;
 --borderColor-accent-muted: #54aeff66;
@@ -53,7 +52,7 @@
 --borderColor-severe-muted: #fb8f4466;
 --borderColor-sponsors-emphasis: #bf3989;
 --borderColor-sponsors-muted: #ff80c866;
-  --borderColor-success-emphasis: #1a7f37;
+  --borderColor-success-emphasis: #1b8238;
 --borderColor-success-muted: #4ac26b66;
 --borderColor-transparent: #ffffff00;
 --button-danger-bgColor-active: #a40e26;
@@ -65,7 +64,6 @@
 --button-invisible-bgColor-disabled: #ffffff00;
 --button-invisible-borderColor-disabled: #ffffff00;
 --button-outline-shadow-selected: inset 0px 1px 0px 0px #00215533;
-  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
 --button-primary-borderColor-disabled: var(--button-primary-bgColor-disabled);
 --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
 --button-star-iconColor: #eac54f;
@@ -84,7 +82,7 @@
 --color-ansi-blue-bright: #218bff;
 --color-ansi-gray: #59636e;
 --color-ansi-green: #116329;
-  --color-ansi-green-bright: #1a7f37;
+  --color-ansi-green-bright: #1b8238;
 --color-ansi-magenta: #8250df;
 --color-ansi-magenta-bright: #a475f9;
 --color-ansi-red: #cf222e;
@@ -112,7 +110,7 @@
 --color-prettylights-syntax-markup-heading: #0550ae;
 --color-prettylights-syntax-markup-ignored-bg: #0550ae;
 --color-prettylights-syntax-markup-ignored-text: #d1d9e0;
-  --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
+  --color-prettylights-syntax-markup-inserted-bg: #e3fce9;
 --color-prettylights-syntax-markup-inserted-text: #116329;
 --color-prettylights-syntax-markup-list: #3b2300;
 --color-prettylights-syntax-meta-diff-range: #8250df;
@@ -487,7 +485,7 @@
 --fgColor-neutral: #59636e;
 --fgColor-severe: #bc4c00;
 --fgColor-sponsors: #bf3989;
-  --fgColor-success: #1a7f37;
+  --fgColor-success: #1b8238;
 --header-bgColor: #25292e;
 --header-borderColor-divider: #818b98;
 --headerSearch-bgColor: #25292e;
@@ -628,7 +626,6 @@
 --label-yellow-fgColor-rest: #805900;
 --menu-bgColor-active: #ffffff00;
 --overlay-backdrop-bgColor: #c8d1da66;
-  --progressBar-bgColor-success: var(--bgColor-success-emphasis);
 --progressBar-track-borderColor: #ffffff00;
 --reactionButton-selected-bgColor-rest: #ddf4ff;
 --reactionButton-selected-fgColor-hover: #0550ae;
@@ -647,6 +644,7 @@
 --bgColor-closed-muted: var(--bgColor-danger-muted);
 --bgColor-default: #ffffff;
 --bgColor-inset: var(--bgColor-muted);
+  --bgColor-open-emphasis: var(--bgColor-success-emphasis);
 --bgColor-open-muted: var(--bgColor-success-muted);
 --bgColor-upsell-emphasis: var(--bgColor-done-emphasis);
 --bgColor-upsell-muted: var(--bgColor-done-muted);
@@ -667,7 +665,7 @@
 --border-severe-muted: 0.0625rem solid #fb8f4466;
 --border-sponsors-emphasis: 0.0625rem solid #bf3989;
 --border-sponsors-muted: 0.0625rem solid #ff80c866;
-  --border-success-emphasis: 0.0625rem solid #1a7f37;
+  --border-success-emphasis: 0.0625rem solid #1b8238;
 --border-success-muted: 0.0625rem solid #4ac26b66;
 --border-transparent: 0.0625rem solid #ffffff00;
 --borderColor-closed-emphasis: var(--borderColor-danger-emphasis);
@@ -706,6 +704,7 @@
 --button-outline-fgColor-disabled: #0969da80;
 --button-outline-fgColor-hover: #ffffff;
 --button-outline-fgColor-rest: var(--fgColor-accent);
+  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
 --button-primary-fgColor-disabled: #ffffffcc;
 --buttonCounter-danger-bgColor-disabled: #cf222e0d;
 --buttonCounter-danger-bgColor-hover: #ffffff33;
@@ -782,6 +781,7 @@
 --progressBar-bgColor-neutral: var(--bgColor-neutral-emphasis);
 --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
 --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+  --progressBar-bgColor-success: var(--bgColor-success-emphasis);
 --progressBar-track-bgColor: var(--borderColor-default);
 --selection-bgColor: #0969da33;
 --shadow-inset: inset 0px 1px 0px 0px #1f23280a;
@@ -859,7 +859,6 @@
@media (prefers-color-scheme: dark) {
 [data-color-mode][data-color-mode="auto"][data-dark-theme="light"],
 [data-color-mode][data-color-mode="auto"][data-dark-theme="light"] ::backdrop {
-    --bgColor-success-emphasis: #1f883d;
   --button-outline-bgColor-active: #0757ba;
   --button-primary-bgColor-active: #197935;
   --button-primary-bgColor-disabled: #95d8a6;
@@ -887,12 +886,12 @@
   --bgColor-muted: #f6f8fa;
   --bgColor-neutral-emphasis: #59636e;
   --bgColor-neutral-muted: #818b981f;
-    --bgColor-open-emphasis: var(--bgColor-success-emphasis);
   --bgColor-severe-emphasis: #bc4c00;
   --bgColor-severe-muted: #fff1e5;
   --bgColor-sponsors-emphasis: #bf3989;
   --bgColor-sponsors-muted: #ffeff7;
-    --bgColor-success-muted: #dafbe1;
+    --bgColor-success-emphasis: #1b8238;
+    --bgColor-success-muted: #e3fce9;
   --bgColor-transparent: #ffffff00;
   --borderColor-accent-emphasis: #0969da;
   --borderColor-accent-muted: #54aeff66;
@@ -910,7 +909,7 @@
   --borderColor-severe-muted: #fb8f4466;
   --borderColor-sponsors-emphasis: #bf3989;
   --borderColor-sponsors-muted: #ff80c866;
-    --borderColor-success-emphasis: #1a7f37;
+    --borderColor-success-emphasis: #1b8238;
   --borderColor-success-muted: #4ac26b66;
   --borderColor-transparent: #ffffff00;
   --button-danger-bgColor-active: #a40e26;
@@ -922,7 +921,6 @@
   --button-invisible-bgColor-disabled: #ffffff00;
   --button-invisible-borderColor-disabled: #ffffff00;
   --button-outline-shadow-selected: inset 0px 1px 0px 0px #00215533;
-    --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
   --button-primary-borderColor-disabled: var(--button-primary-bgColor-disabled);
   --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
   --button-star-iconColor: #eac54f;
@@ -941,7 +939,7 @@
   --color-ansi-blue-bright: #218bff;
   --color-ansi-gray: #59636e;
   --color-ansi-green: #116329;
-    --color-ansi-green-bright: #1a7f37;
+    --color-ansi-green-bright: #1b8238;
   --color-ansi-magenta: #8250df;
   --color-ansi-magenta-bright: #a475f9;
   --color-ansi-red: #cf222e;
@@ -969,7 +967,7 @@
   --color-prettylights-syntax-markup-heading: #0550ae;
   --color-prettylights-syntax-markup-ignored-bg: #0550ae;
   --color-prettylights-syntax-markup-ignored-text: #d1d9e0;
-    --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
+    --color-prettylights-syntax-markup-inserted-bg: #e3fce9;
   --color-prettylights-syntax-markup-inserted-text: #116329;
   --color-prettylights-syntax-markup-list: #3b2300;
   --color-prettylights-syntax-meta-diff-range: #8250df;
@@ -1344,7 +1342,7 @@
   --fgColor-neutral: #59636e;
   --fgColor-severe: #bc4c00;
   --fgColor-sponsors: #bf3989;
-    --fgColor-success: #1a7f37;
+    --fgColor-success: #1b8238;
   --header-bgColor: #25292e;
   --header-borderColor-divider: #818b98;
   --headerSearch-bgColor: #25292e;
@@ -1485,7 +1483,6 @@
   --label-yellow-fgColor-rest: #805900;
   --menu-bgColor-active: #ffffff00;
   --overlay-backdrop-bgColor: #c8d1da66;
-    --progressBar-bgColor-success: var(--bgColor-success-emphasis);
   --progressBar-track-borderColor: #ffffff00;
   --reactionButton-selected-bgColor-rest: #ddf4ff;
   --reactionButton-selected-fgColor-hover: #0550ae;
@@ -1504,6 +1501,7 @@
   --bgColor-closed-muted: var(--bgColor-danger-muted);
   --bgColor-default: #ffffff;
   --bgColor-inset: var(--bgColor-muted);
+    --bgColor-open-emphasis: var(--bgColor-success-emphasis);
   --bgColor-open-muted: var(--bgColor-success-muted);
   --bgColor-upsell-emphasis: var(--bgColor-done-emphasis);
   --bgColor-upsell-muted: var(--bgColor-done-muted);
@@ -1524,7 +1522,7 @@
   --border-severe-muted: 0.0625rem solid #fb8f4466;
   --border-sponsors-emphasis: 0.0625rem solid #bf3989;
   --border-sponsors-muted: 0.0625rem solid #ff80c866;
-    --border-success-emphasis: 0.0625rem solid #1a7f37;
+    --border-success-emphasis: 0.0625rem solid #1b8238;
   --border-success-muted: 0.0625rem solid #4ac26b66;
   --border-transparent: 0.0625rem solid #ffffff00;
   --borderColor-closed-emphasis: var(--borderColor-danger-emphasis);
@@ -1563,6 +1561,7 @@
   --button-outline-fgColor-disabled: #0969da80;
   --button-outline-fgColor-hover: #ffffff;
   --button-outline-fgColor-rest: var(--fgColor-accent);
+    --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
   --button-primary-fgColor-disabled: #ffffffcc;
   --buttonCounter-danger-bgColor-disabled: #cf222e0d;
   --buttonCounter-danger-bgColor-hover: #ffffff33;
@@ -1639,6 +1638,7 @@
   --progressBar-bgColor-neutral: var(--bgColor-neutral-emphasis);
   --progressBar-bgColor-severe: var(--bgColor-severe-emphasis);
   --progressBar-bgColor-sponsors: var(--bgColor-sponsors-emphasis);
+    --progressBar-bgColor-success: var(--bgColor-success-emphasis);
   --progressBar-track-bgColor: var(--borderColor-default);
   --selection-bgColor: #0969da33;
   --shadow-inset: inset 0px 1px 0px 0px #1f23280a;

github-actions · 2025-08-20T13:00:53Z

Design Token Diff (StyleLint)

/styleLint/functional/themes/light-colorblind.json

+++ /home/runner/work/primitives/primitives/dist/styleLint/functional/themes/light-colorblind.json	2025-08-20 13:06:30.107459773 +0000
@@ -1718,7 +1718,7 @@
       }
     },
     "org.primer.overrides": {
-        "dark": "#1a7f37",
+        "dark": "#1b8238",
       "light-tritanopia": "#0969da",
       "light-tritanopia-high-contrast": "#0969da",
       "dark-tritanopia": "#0969da",
@@ -1727,7 +1727,7 @@
       "light-protanopia-deuteranopia-high-contrast": "#0969da",
       "dark-protanopia-deuteranopia": "#0969da",
       "dark-protanopia-deuteranopia-high-contrast": "#002155",
-        "light-high-contrast": "#1a7f37",
+        "light-high-contrast": "#1b8238",
       "dark-high-contrast": "#002d11",
       "dark-dimmed-high-contrast": "#044f1e"
     }
@@ -8333,7 +8333,7 @@
         "$type": "color"
       },
       "dark-dimmed-high-contrast": {
-          "$value": "#1a7f37",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
@@ -8882,7 +8882,7 @@
         "$type": "color"
       },
       "light-high-contrast": {
-          "$value": "#1a7f37",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
@@ -12697,7 +12697,7 @@
       "group": "syntax"
     },
     "org.primer.overrides": {
-        "dark": "#dafbe1",
+        "dark": "#e3fce9",
       "dark-tritanopia": "#ddf4ff",
       "dark-tritanopia-high-contrast": "#ddf4ff",
       "light-tritanopia": "#0550ae",
@@ -19279,7 +19279,7 @@
       },
       "light-protanopia-deuteranopia": "#b6e3ff",
       "light-protanopia-deuteranopia-high-contrast": "#0969da",
-        "light-high-contrast": "#1a7f37",
+        "light-high-contrast": "#1b8238",
       "light-tritanopia": "#b6e3ff",
       "light-tritanopia-high-contrast": "#0969da",
       "dark-protanopia-deuteranopia": {
@@ -35521,7 +35521,7 @@
     "org.primer.overrides": {
       "dark": "#4ac26b",
       "dark-high-contrast": "#2BD853",
-        "dark-dimmed-high-contrast": "#dafbe1",
+        "dark-dimmed-high-contrast": "#e3fce9",
       "light-high-contrast": "#116329",
       "dark-protanopia-deuteranopia": "#54aeff",
       "dark-protanopia-deuteranopia-high-contrast": "#b6e3ff",

/styleLint/functional/themes/light-tritanopia.json

+++ /home/runner/work/primitives/primitives/dist/styleLint/functional/themes/light-tritanopia.json	2025-08-20 13:06:26.466418762 +0000
@@ -1718,7 +1718,7 @@
       }
     },
     "org.primer.overrides": {
-        "dark": "#1a7f37",
+        "dark": "#1b8238",
       "light-tritanopia": "#0969da",
       "light-tritanopia-high-contrast": "#0969da",
       "dark-tritanopia": "#0969da",
@@ -1727,7 +1727,7 @@
       "light-protanopia-deuteranopia-high-contrast": "#0969da",
       "dark-protanopia-deuteranopia": "#0969da",
       "dark-protanopia-deuteranopia-high-contrast": "#002155",
-        "light-high-contrast": "#1a7f37",
+        "light-high-contrast": "#1b8238",
       "dark-high-contrast": "#002d11",
       "dark-dimmed-high-contrast": "#044f1e"
     }
@@ -8333,7 +8333,7 @@
         "$type": "color"
       },
       "dark-dimmed-high-contrast": {
-          "$value": "#1a7f37",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
@@ -8882,7 +8882,7 @@
         "$type": "color"
       },
       "light-high-contrast": {
-          "$value": "#1a7f37",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
@@ -12697,7 +12697,7 @@
       "group": "syntax"
     },
     "org.primer.overrides": {
-        "dark": "#dafbe1",
+        "dark": "#e3fce9",
       "dark-tritanopia": "#ddf4ff",
       "dark-tritanopia-high-contrast": "#ddf4ff",
       "light-tritanopia": "#0550ae",
@@ -19279,7 +19279,7 @@
       },
       "light-protanopia-deuteranopia": "#b6e3ff",
       "light-protanopia-deuteranopia-high-contrast": "#0969da",
-        "light-high-contrast": "#1a7f37",
+        "light-high-contrast": "#1b8238",
       "light-tritanopia": "#b6e3ff",
       "light-tritanopia-high-contrast": "#0969da",
       "dark-protanopia-deuteranopia": {
@@ -35521,7 +35521,7 @@
     "org.primer.overrides": {
       "dark": "#4ac26b",
       "dark-high-contrast": "#2BD853",
-        "dark-dimmed-high-contrast": "#dafbe1",
+        "dark-dimmed-high-contrast": "#e3fce9",
       "light-high-contrast": "#116329",
       "dark-protanopia-deuteranopia": "#54aeff",
       "dark-protanopia-deuteranopia-high-contrast": "#b6e3ff",

/styleLint/functional/themes/light.json

+++ /home/runner/work/primitives/primitives/dist/styleLint/functional/themes/light.json	2025-08-20 13:06:24.685400152 +0000
@@ -1310,7 +1310,7 @@
 },
 "bgColor-open-emphasis": {
   "key": "{bgColor.open.emphasis}",
-    "$value": "#1f883d",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -1365,7 +1365,7 @@
 },
 "bgColor-open-muted": {
   "key": "{bgColor.open.muted}",
-    "$value": "#dafbe1",
+    "$value": "#e3fce9",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -1706,7 +1706,7 @@
 },
 "bgColor-success-emphasis": {
   "key": "{bgColor.success.emphasis}",
-    "$value": "#1f883d",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -1718,7 +1718,7 @@
       }
     },
     "org.primer.overrides": {
-        "dark": "#1a7f37",
+        "dark": "#1b8238",
       "light-tritanopia": "#0969da",
       "light-tritanopia-high-contrast": "#0969da",
       "dark-tritanopia": "#0969da",
@@ -1727,7 +1727,7 @@
       "light-protanopia-deuteranopia-high-contrast": "#0969da",
       "dark-protanopia-deuteranopia": "#0969da",
       "dark-protanopia-deuteranopia-high-contrast": "#002155",
-        "light-high-contrast": "#1a7f37",
+        "light-high-contrast": "#1b8238",
       "dark-high-contrast": "#002d11",
       "dark-dimmed-high-contrast": "#044f1e"
     }
@@ -1735,7 +1735,7 @@
   "filePath": "src/tokens/functional/color/bgColor.json5",
   "isSource": true,
   "original": {
-      "$value": "#1f883d",
+      "$value": "{base.color.green.5}",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -1769,7 +1769,7 @@
 },
 "bgColor-success-muted": {
   "key": "{bgColor.success.muted}",
-    "$value": "#dafbe1",
+    "$value": "#e3fce9",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -2322,7 +2322,7 @@
 },
 "border-open-emphasis": {
   "key": "{border.open.emphasis}",
-    "$value": "0.00390625rem,0.0625px solid #1a7f37",
+    "$value": "0.00390625rem,0.0625px solid #1b8238",
   "$type": "border",
   "filePath": "src/tokens/functional/border/border.json5",
   "isSource": true,
@@ -2428,7 +2428,7 @@
 },
 "border-success-emphasis": {
   "key": "{border.success.emphasis}",
-    "$value": "0.00390625rem,0.0625px solid #1a7f37",
+    "$value": "0.00390625rem,0.0625px solid #1b8238",
   "$type": "border",
   "filePath": "src/tokens/functional/border/border.json5",
   "isSource": true,
@@ -3989,7 +3989,7 @@
 },
 "borderColor-open-emphasis": {
   "key": "{borderColor.open.emphasis}",
-    "$value": "#1a7f37",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -4555,7 +4555,7 @@
 },
 "borderColor-success-emphasis": {
   "key": "{borderColor.success.emphasis}",
-    "$value": "#1a7f37",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -8329,7 +8329,7 @@
         "$type": "color"
       },
       "dark-dimmed-high-contrast": {
-          "$value": "#1a7f37",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
@@ -8862,7 +8862,7 @@
 },
 "button-primary-bgColor-rest": {
   "key": "{button.primary.bgColor.rest}",
-    "$value": "#1f883d",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -8872,13 +8872,13 @@
     },
     "org.primer.overrides": {
       "dark": {
-          "$value": "#1f883d",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
       },
       "light-high-contrast": {
-          "$value": "#1a7f37",
+          "$value": "#1b8238",
         "filePath": "src/tokens/component/button.json5",
         "isSource": true,
         "$type": "color"
@@ -11575,7 +11575,7 @@
 },
 "color-ansi-green-bright": {
   "key": "{color.ansi.green-bright}",
-    "$value": "#1a7f37",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -12636,7 +12636,7 @@
 },
 "color-prettylights-syntax-markup-inserted-bg": {
   "key": "{color.prettylights.syntax.markup.inserted.bg}",
-    "$value": "#dafbe1",
+    "$value": "#e3fce9",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -12693,7 +12693,7 @@
       "group": "syntax"
     },
     "org.primer.overrides": {
-        "dark": "#dafbe1",
+        "dark": "#e3fce9",
       "dark-tritanopia": "#ddf4ff",
       "dark-tritanopia-high-contrast": "#ddf4ff",
       "light-tritanopia": "#0550ae",
@@ -14430,7 +14430,7 @@
 },
 "control-borderColor-success": {
   "key": "{control.borderColor.success}",
-    "$value": "#1a7f37",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -14439,7 +14439,7 @@
       "scopes": ["borderColor"]
     },
     "org.primer.overrides": {
-        "dark": "#1a7f37"
+        "dark": "#1b8238"
     }
   },
   "filePath": "src/tokens/functional/color/control.json5",
@@ -18997,7 +18997,7 @@
 },
 "diffBlob-additionLine-bgColor": {
   "key": "{diffBlob.additionLine.bgColor}",
-    "$value": "#dafbe1",
+    "$value": "#e3fce9",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -19010,21 +19010,21 @@
         "alpha": 0.15
       },
       "dark-high-contrast": {
-          "$value": "#dafbe1",
+          "$value": "#e3fce9",
         "alpha": 0.2,
         "filePath": "src/tokens/component/diffBlob.json5",
         "isSource": true,
         "$type": "color"
       },
       "dark-tritanopia-high-contrast": {
-          "$value": "#dafbe1",
+          "$value": "#e3fce9",
         "alpha": 0.2,
         "filePath": "src/tokens/component/diffBlob.json5",
         "isSource": true,
         "$type": "color"
       },
       "dark-protanopia-deuteranopia-high-contrast": {
-          "$value": "#dafbe1",
+          "$value": "#e3fce9",
         "alpha": 0.2,
         "filePath": "src/tokens/component/diffBlob.json5",
         "isSource": true,
@@ -19275,7 +19275,7 @@
       },
       "light-protanopia-deuteranopia": "#b6e3ff",
       "light-protanopia-deuteranopia-high-contrast": "#0969da",
-        "light-high-contrast": "#1a7f37",
+        "light-high-contrast": "#1b8238",
       "light-tritanopia": "#b6e3ff",
       "light-tritanopia-high-contrast": "#0969da",
       "dark-protanopia-deuteranopia": {
@@ -19285,7 +19285,7 @@
         "isSource": true,
         "$type": "color"
       },
-        "dark-protanopia-deuteranopia-high-contrast": "#1f883d",
+        "dark-protanopia-deuteranopia-high-contrast": "#1b8238",
       "dark-tritanopia": {
         "$value": "#218bff",
         "alpha": 0.4,
@@ -19293,8 +19293,8 @@
         "isSource": true,
         "$type": "color"
       },
-        "dark-tritanopia-high-contrast": "#1f883d",
-        "dark-high-contrast": "#1f883d"
+        "dark-tritanopia-high-contrast": "#1b8238",
+        "dark-high-contrast": "#1b8238"
     }
   },
   "filePath": "src/tokens/component/diffBlob.json5",
@@ -35334,7 +35334,7 @@
 },
 "fgColor-open": {
   "key": "{fgColor.open}",
-    "$value": "#1a7f37",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -35503,7 +35503,7 @@
 },
 "fgColor-success": {
   "key": "{fgColor.success}",
-    "$value": "#1a7f37",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {
@@ -35517,7 +35517,7 @@
     "org.primer.overrides": {
       "dark": "#4ac26b",
       "dark-high-contrast": "#2BD853",
-        "dark-dimmed-high-contrast": "#dafbe1",
+        "dark-dimmed-high-contrast": "#e3fce9",
       "light-high-contrast": "#116329",
       "dark-protanopia-deuteranopia": "#54aeff",
       "dark-protanopia-deuteranopia-high-contrast": "#b6e3ff",
@@ -44316,7 +44316,7 @@
 },
 "progressBar-bgColor-success": {
   "key": "{progressBar.bgColor.success}",
-    "$value": "#1f883d",
+    "$value": "#1b8238",
   "$type": "color",
   "$extensions": {
     "org.primer.figma": {

github-actions · 2025-08-20T13:00:54Z

Design Token Diff (Figma)

/figma/scales/light.json

+++ /home/runner/work/primitives/primitives/dist/figma/scales/light.json	2025-08-20 13:06:50.558670660 +0000
@@ -426,9 +426,9 @@
 {
   "name": "base/color/green/0",
   "value": {
-      "r": 0.8549019607843137,
-      "g": 0.984313725490196,
-      "b": 0.8823529411764706,
+      "r": 0.8901960784313725,
+      "g": 0.9882352941176471,
+      "b": 0.9137254901960784,
     "a": 1
   },
   "type": "COLOR",
@@ -501,9 +501,9 @@
 {
   "name": "base/color/green/5",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",

/figma/themes/light.json

+++ /home/runner/work/primitives/primitives/dist/figma/themes/light.json	2025-08-20 13:06:51.606681323 +0000
@@ -1148,9 +1148,9 @@
 {
   "name": "bgColor/success-muted",
   "value": {
-      "r": 0.8549019607843137,
-      "g": 0.984313725490196,
-      "b": 0.8823529411764706,
+      "r": 0.8901960784313725,
+      "g": 0.9882352941176471,
+      "b": 0.9137254901960784,
     "a": 1
   },
   "type": "COLOR",
@@ -1167,13 +1167,14 @@
 {
   "name": "bgColor/success-emphasis",
   "value": {
-      "r": 0.12156862745098039,
-      "g": 0.5333333333333333,
-      "b": 0.23921568627450981,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
   "refId": "mode/bgColor/success-emphasis",
+    "reference": "base/color/light/base/color/green/5",
   "collection": "mode",
   "mode": "light",
   "group": "semantic",
@@ -1185,9 +1186,9 @@
 {
   "name": "bgColor/open-muted",
   "value": {
-      "r": 0.8549019607843137,
-      "g": 0.984313725490196,
-      "b": 0.8823529411764706,
+      "r": 0.8901960784313725,
+      "g": 0.9882352941176471,
+      "b": 0.9137254901960784,
     "a": 1
   },
   "type": "COLOR",
@@ -1204,9 +1205,9 @@
 {
   "name": "bgColor/open-emphasis",
   "value": {
-      "r": 0.12156862745098039,
-      "g": 0.5333333333333333,
-      "b": 0.23921568627450981,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -1685,9 +1686,9 @@
 {
   "name": "borderColor/success-emphasis",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -1723,9 +1724,9 @@
 {
   "name": "borderColor/open-emphasis",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -2205,9 +2206,9 @@
 {
   "name": "control/borderColor/success",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -8126,9 +8127,9 @@
 {
   "name": "fgColor/success",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -8145,9 +8146,9 @@
 {
   "name": "fgColor/open",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -8441,9 +8442,9 @@
 {
   "name": "color/ansi/green-bright",
   "value": {
-      "r": 0.10196078431372549,
-      "g": 0.4980392156862745,
-      "b": 0.21568627450980393,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -8951,9 +8952,9 @@
 {
   "name": "color/prettylights/syntax/markup/inserted/bg",
   "value": {
-      "r": 0.8549019607843137,
-      "g": 0.984313725490196,
-      "b": 0.8823529411764706,
+      "r": 0.8901960784313725,
+      "g": 0.9882352941176471,
+      "b": 0.9137254901960784,
     "a": 1
   },
   "type": "COLOR",
@@ -9421,9 +9422,9 @@
 {
   "name": "button/primary/bgColor/rest",
   "value": {
-      "r": 0.12156862745098039,
-      "g": 0.5333333333333333,
-      "b": 0.23921568627450981,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",
@@ -11258,9 +11259,9 @@
 {
   "name": "diffBlob/additionLine/bgColor",
   "value": {
-      "r": 0.8549019607843137,
-      "g": 0.984313725490196,
-      "b": 0.8823529411764706,
+      "r": 0.8901960784313725,
+      "g": 0.9882352941176471,
+      "b": 0.9137254901960784,
     "a": 1
   },
   "type": "COLOR",
@@ -14013,9 +14014,9 @@
 {
   "name": "progressBar/bgColor/success",
   "value": {
-      "r": 0.12156862745098039,
-      "g": 0.5333333333333333,
-      "b": 0.23921568627450981,
+      "r": 0.10588235294117647,
+      "g": 0.5098039215686274,
+      "b": 0.2196078431372549,
     "a": 1
   },
   "type": "COLOR",

lesliecdubs · 2026-05-18T18:04:41Z

👋 @lukasoppermann is this PR still relevant? If so, can you update the tagged reviewers?

lukasoppermann · 2026-05-18T18:25:37Z

I think we won't merge it, since a11y token work is not on our plate ATM and I don't have capacity for testing

mattobee

Change it

mattobee

Ship it

update base green 5

ef16c4b

lukasoppermann requested review from Copilot and langermank August 20, 2025 12:58

lukasoppermann requested review from a team as code owners August 20, 2025 12:58

Copilot AI reviewed Aug 20, 2025

View reviewed changes

add changeset

29a5928

github-actions Bot temporarily deployed to Preview (Storybook) August 20, 2025 13:01 Inactive

lukasoppermann temporarily deployed to github-pages August 20, 2025 13:02 — with GitHub Actions Inactive

github-actions Bot temporarily deployed to Preview (Storybook) August 20, 2025 13:02 Inactive

update base.green.0 for contrast against base.green.5

f707815

primer deleted a comment from github-actions Bot Aug 20, 2025

lukasoppermann temporarily deployed to github-pages August 20, 2025 13:07 — with GitHub Actions Inactive

github-actions Bot temporarily deployed to Preview (Storybook) August 20, 2025 13:07 Inactive

lukasoppermann added the update snapshots Update visual regression test snapshots label Aug 21, 2025

github-actions Bot removed the update snapshots Update visual regression test snapshots label Aug 21, 2025

mattobee requested changes May 21, 2026

View reviewed changes

mattobee approved these changes May 21, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update base green 5#1246

Update base green 5#1246
lukasoppermann wants to merge 3 commits into
mainfrom
update-bgColor-success-emphasis

lukasoppermann commented Aug 20, 2025 •

edited

Loading

Uh oh!

changeset-bot Bot commented Aug 20, 2025 •

edited

Loading

Uh oh!

Copilot AI left a comment

Uh oh!

github-actions Bot commented Aug 20, 2025 •

edited

Loading

/css/functional/themes/light.css

Uh oh!

github-actions Bot commented Aug 20, 2025 •

edited

Loading

/styleLint/functional/themes/light-colorblind.json

/styleLint/functional/themes/light-tritanopia.json

/styleLint/functional/themes/light.json

Uh oh!

github-actions Bot commented Aug 20, 2025 •

edited

Loading

/figma/scales/light.json

/figma/themes/light.json

Uh oh!

lesliecdubs commented May 18, 2026

Uh oh!

lukasoppermann commented May 18, 2026

Uh oh!

mattobee left a comment

Uh oh!

mattobee left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

lukasoppermann commented Aug 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

What should reviewers focus on?

Steps to test:

Uh oh!

changeset-bot Bot commented Aug 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

github-actions Bot commented Aug 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Design Token Diff (CSS)

/css/functional/themes/light.css

Uh oh!

github-actions Bot commented Aug 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Design Token Diff (StyleLint)

/styleLint/functional/themes/light-colorblind.json

/styleLint/functional/themes/light-tritanopia.json

/styleLint/functional/themes/light.json

Uh oh!

github-actions Bot commented Aug 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Design Token Diff (Figma)

/figma/scales/light.json

/figma/themes/light.json

Uh oh!

lesliecdubs commented May 18, 2026

Uh oh!

lukasoppermann commented May 18, 2026

Uh oh!

mattobee left a comment

Choose a reason for hiding this comment

Uh oh!

mattobee left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

lukasoppermann commented Aug 20, 2025 •

edited

Loading

changeset-bot Bot commented Aug 20, 2025 •

edited

Loading

github-actions Bot commented Aug 20, 2025 •

edited

Loading

github-actions Bot commented Aug 20, 2025 •

edited

Loading

github-actions Bot commented Aug 20, 2025 •

edited

Loading