Color experiment #1070

lukasoppermann · 2024-10-04T12:01:09Z

Summary

List of notable changes:

What should reviewers focus on?

Steps to test:

changeset-bot · 2024-10-04T12:01:12Z

⚠️ No Changeset found

Latest commit: 9acb72d

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 · 2024-10-04T12:02:19Z

Design Token Diff

/css/functional/themes/dark-colorblind.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/dark-colorblind.css	2024-10-08 13:34:52.190886553 +0000
@@ -283,7 +283,7 @@
 --button-star-iconColor: #e3b341;
 --buttonCounter-default-bgColor-rest: #2f3742;
 --buttonCounter-invisible-bgColor-rest: #656c7633;
-  --buttonCounter-primary-bgColor-rest: #04260f33;
+  --buttonCounter-primary-bgColor-rest: #00291833;
 --buttonCounter-outline-bgColor-rest: #051d4d33;
 --buttonCounter-outline-bgColor-hover: #051d4d33;
 --buttonCounter-outline-bgColor-disabled: #1f6feb0d;
@@ -852,7 +852,7 @@
   --button-star-iconColor: #e3b341;
   --buttonCounter-default-bgColor-rest: #2f3742;
   --buttonCounter-invisible-bgColor-rest: #656c7633;
-    --buttonCounter-primary-bgColor-rest: #04260f33;
+    --buttonCounter-primary-bgColor-rest: #00291833;
   --buttonCounter-outline-bgColor-rest: #051d4d33;
   --buttonCounter-outline-bgColor-hover: #051d4d33;
   --buttonCounter-outline-bgColor-disabled: #1f6feb0d;

/css/functional/themes/dark-tritanopia.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/dark-tritanopia.css	2024-10-08 13:34:51.296875332 +0000
@@ -283,7 +283,7 @@
 --button-star-iconColor: #e3b341;
 --buttonCounter-default-bgColor-rest: #2f3742;
 --buttonCounter-invisible-bgColor-rest: #656c7633;
-  --buttonCounter-primary-bgColor-rest: #04260f33;
+  --buttonCounter-primary-bgColor-rest: #00291833;
 --buttonCounter-outline-bgColor-rest: #051d4d33;
 --buttonCounter-outline-bgColor-hover: #051d4d33;
 --buttonCounter-outline-bgColor-disabled: #1f6feb0d;
@@ -852,7 +852,7 @@
   --button-star-iconColor: #e3b341;
   --buttonCounter-default-bgColor-rest: #2f3742;
   --buttonCounter-invisible-bgColor-rest: #656c7633;
-    --buttonCounter-primary-bgColor-rest: #04260f33;
+    --buttonCounter-primary-bgColor-rest: #00291833;
   --buttonCounter-outline-bgColor-rest: #051d4d33;
   --buttonCounter-outline-bgColor-hover: #051d4d33;
   --buttonCounter-outline-bgColor-disabled: #1f6feb0d;

/css/functional/themes/dark.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/dark.css	2024-10-08 13:34:49.466852363 +0000
@@ -7,9 +7,9 @@
 --page-header-bgColor: #0d1117;
 --diffBlob-addition-fgColor-text: #f0f6fc;
 --diffBlob-addition-fgColor-num: #f0f6fc;
-  --diffBlob-addition-bgColor-num: #3fb9504d;
-  --diffBlob-addition-bgColor-line: #2ea04326;
-  --diffBlob-addition-bgColor-word: #2ea04366;
+  --diffBlob-addition-bgColor-num: #0cb64d4d;
+  --diffBlob-addition-bgColor-line: #048f3e26;
+  --diffBlob-addition-bgColor-word: #048f3e66;
 --diffBlob-deletion-fgColor-text: #f0f6fc;
 --diffBlob-deletion-fgColor-num: #f0f6fc;
 --diffBlob-deletion-bgColor-num: #f851494d;
@@ -174,7 +174,7 @@
 --control-borderColor-emphasis: #656c76;
 --control-borderColor-disabled: #656c761a;
 --control-borderColor-selected: #f0f6fc;
-  --control-borderColor-success: #238636;
+  --control-borderColor-success: #00873d;
 --control-borderColor-danger: #da3633;
 --control-borderColor-warning: #9e6a03;
 --control-iconColor-rest: #9198a1;
@@ -231,14 +231,14 @@
 --button-primary-fgColor-rest: #ffffff;
 --button-primary-fgColor-disabled: #ffffff66;
 --button-primary-iconColor-rest: #ffffff;
-  --button-primary-bgColor-rest: #238636;
-  --button-primary-bgColor-hover: #29903b;
-  --button-primary-bgColor-active: #2e9a40;
-  --button-primary-bgColor-disabled: #105823;
+  --button-primary-bgColor-rest: #00873d;
+  --button-primary-bgColor-hover: #029040;
+  --button-primary-bgColor-active: #059a43;
+  --button-primary-bgColor-disabled: #005529;
 --button-primary-borderColor-rest: #ffffff1a;
 --button-primary-borderColor-hover: #ffffff1a;
 --button-primary-borderColor-active: #ffffff1a;
-  --button-primary-borderColor-disabled: #105823;
+  --button-primary-borderColor-disabled: #005529;
 --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
 --button-invisible-fgColor-rest: #f0f6fc;
 --button-invisible-fgColor-hover: #f0f6fc;
@@ -283,7 +283,7 @@
 --button-star-iconColor: #e3b341;
 --buttonCounter-default-bgColor-rest: #2f3742;
 --buttonCounter-invisible-bgColor-rest: #656c7633;
-  --buttonCounter-primary-bgColor-rest: #04260f33;
+  --buttonCounter-primary-bgColor-rest: #00291833;
 --buttonCounter-outline-bgColor-rest: #051d4d33;
 --buttonCounter-outline-bgColor-hover: #051d4d33;
 --buttonCounter-outline-bgColor-disabled: #1f6feb0d;
@@ -442,8 +442,8 @@
 --fgColor-link: #4493f8;
 --fgColor-neutral: #9198a1;
 --fgColor-accent: #4493f8;
-  --fgColor-success: #3fb950;
-  --fgColor-open: #3fb950;
+  --fgColor-success: #0cb64d;
+  --fgColor-open: #0cb64d;
 --fgColor-attention: #d29922;
 --fgColor-severe: #db6d28;
 --fgColor-danger: #f85149;
@@ -464,10 +464,10 @@
 --bgColor-neutral-emphasis: #656c76;
 --bgColor-accent-muted: #388bfd1a;
 --bgColor-accent-emphasis: #1f6feb;
-  --bgColor-success-muted: #2ea04326;
-  --bgColor-success-emphasis: #238636;
-  --bgColor-open-muted: #2ea04326;
-  --bgColor-open-emphasis: #238636;
+  --bgColor-success-muted: #048f3e26;
+  --bgColor-success-emphasis: #00873d;
+  --bgColor-open-muted: #048f3e26;
+  --bgColor-open-emphasis: #00873d;
 --bgColor-attention-muted: #bb800926;
 --bgColor-attention-emphasis: #9e6a03;
 --bgColor-severe-muted: #db6d281a;
@@ -492,10 +492,10 @@
 --borderColor-neutral-emphasis: #656c76;
 --borderColor-accent-muted: #388bfd66;
 --borderColor-accent-emphasis: #1f6feb;
-  --borderColor-success-muted: #2ea04366;
-  --borderColor-success-emphasis: #238636;
-  --borderColor-open-muted: #2ea04366;
-  --borderColor-open-emphasis: #238636;
+  --borderColor-success-muted: #048f3e66;
+  --borderColor-success-emphasis: #00873d;
+  --borderColor-open-muted: #048f3e66;
+  --borderColor-open-emphasis: #00873d;
 --borderColor-attention-muted: #bb800966;
 --borderColor-attention-emphasis: #9e6a03;
 --borderColor-severe-muted: #db6d2866;
@@ -517,8 +517,8 @@
 --color-ansi-gray: #656c76;
 --color-ansi-red: #ff7b72;
 --color-ansi-red-bright: #ffa198;
-  --color-ansi-green: #3fb950;
-  --color-ansi-green-bright: #56d364;
+  --color-ansi-green: #0cb64d;
+  --color-ansi-green-bright: #13c351;
 --color-ansi-yellow: #d29922;
 --color-ansi-yellow-bright: #e3b341;
 --color-ansi-blue: #58a6ff;
@@ -532,7 +532,7 @@
 --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
 --color-prettylights-syntax-entity: #d2a8ff;
 --color-prettylights-syntax-storage-modifier-import: #f0f6fc;
-  --color-prettylights-syntax-entity-tag: #7ee787;
+  --color-prettylights-syntax-entity-tag: #1edc5a;
 --color-prettylights-syntax-keyword: #ff7b72;
 --color-prettylights-syntax-string: #a5d6ff;
 --color-prettylights-syntax-variable: #ffa657;
@@ -542,15 +542,15 @@
 --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
 --color-prettylights-syntax-carriage-return-text: #f0f6fc;
 --color-prettylights-syntax-carriage-return-bg: #b62324;
-  --color-prettylights-syntax-string-regexp: #7ee787;
+  --color-prettylights-syntax-string-regexp: #1edc5a;
 --color-prettylights-syntax-markup-list: #f2cc60;
 --color-prettylights-syntax-markup-heading: #1f6feb;
 --color-prettylights-syntax-markup-italic: #f0f6fc;
 --color-prettylights-syntax-markup-bold: #f0f6fc;
 --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
 --color-prettylights-syntax-markup-deleted-bg: #67060c;
-  --color-prettylights-syntax-markup-inserted-text: #aff5b4;
-  --color-prettylights-syntax-markup-inserted-bg: #033a16;
+  --color-prettylights-syntax-markup-inserted-text: #70e691;
+  --color-prettylights-syntax-markup-inserted-bg: #00331c;
 --color-prettylights-syntax-markup-changed-text: #ffdfb6;
 --color-prettylights-syntax-markup-changed-bg: #5a1e02;
 --color-prettylights-syntax-markup-ignored-text: #f0f6fc;
@@ -576,9 +576,9 @@
   --page-header-bgColor: #0d1117;
   --diffBlob-addition-fgColor-text: #f0f6fc;
   --diffBlob-addition-fgColor-num: #f0f6fc;
-    --diffBlob-addition-bgColor-num: #3fb9504d;
-    --diffBlob-addition-bgColor-line: #2ea04326;
-    --diffBlob-addition-bgColor-word: #2ea04366;
+    --diffBlob-addition-bgColor-num: #0cb64d4d;
+    --diffBlob-addition-bgColor-line: #048f3e26;
+    --diffBlob-addition-bgColor-word: #048f3e66;
   --diffBlob-deletion-fgColor-text: #f0f6fc;
   --diffBlob-deletion-fgColor-num: #f0f6fc;
   --diffBlob-deletion-bgColor-num: #f851494d;
@@ -743,7 +743,7 @@
   --control-borderColor-emphasis: #656c76;
   --control-borderColor-disabled: #656c761a;
   --control-borderColor-selected: #f0f6fc;
-    --control-borderColor-success: #238636;
+    --control-borderColor-success: #00873d;
   --control-borderColor-danger: #da3633;
   --control-borderColor-warning: #9e6a03;
   --control-iconColor-rest: #9198a1;
@@ -800,14 +800,14 @@
   --button-primary-fgColor-rest: #ffffff;
   --button-primary-fgColor-disabled: #ffffff66;
   --button-primary-iconColor-rest: #ffffff;
-    --button-primary-bgColor-rest: #238636;
-    --button-primary-bgColor-hover: #29903b;
-    --button-primary-bgColor-active: #2e9a40;
-    --button-primary-bgColor-disabled: #105823;
+    --button-primary-bgColor-rest: #00873d;
+    --button-primary-bgColor-hover: #029040;
+    --button-primary-bgColor-active: #059a43;
+    --button-primary-bgColor-disabled: #005529;
   --button-primary-borderColor-rest: #ffffff1a;
   --button-primary-borderColor-hover: #ffffff1a;
   --button-primary-borderColor-active: #ffffff1a;
-    --button-primary-borderColor-disabled: #105823;
+    --button-primary-borderColor-disabled: #005529;
   --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
   --button-invisible-fgColor-rest: #f0f6fc;
   --button-invisible-fgColor-hover: #f0f6fc;
@@ -852,7 +852,7 @@
   --button-star-iconColor: #e3b341;
   --buttonCounter-default-bgColor-rest: #2f3742;
   --buttonCounter-invisible-bgColor-rest: #656c7633;
-    --buttonCounter-primary-bgColor-rest: #04260f33;
+    --buttonCounter-primary-bgColor-rest: #00291833;
   --buttonCounter-outline-bgColor-rest: #051d4d33;
   --buttonCounter-outline-bgColor-hover: #051d4d33;
   --buttonCounter-outline-bgColor-disabled: #1f6feb0d;
@@ -1011,8 +1011,8 @@
   --fgColor-link: #4493f8;
   --fgColor-neutral: #9198a1;
   --fgColor-accent: #4493f8;
-    --fgColor-success: #3fb950;
-    --fgColor-open: #3fb950;
+    --fgColor-success: #0cb64d;
+    --fgColor-open: #0cb64d;
   --fgColor-attention: #d29922;
   --fgColor-severe: #db6d28;
   --fgColor-danger: #f85149;
@@ -1033,10 +1033,10 @@
   --bgColor-neutral-emphasis: #656c76;
   --bgColor-accent-muted: #388bfd1a;
   --bgColor-accent-emphasis: #1f6feb;
-    --bgColor-success-muted: #2ea04326;
-    --bgColor-success-emphasis: #238636;
-    --bgColor-open-muted: #2ea04326;
-    --bgColor-open-emphasis: #238636;
+    --bgColor-success-muted: #048f3e26;
+    --bgColor-success-emphasis: #00873d;
+    --bgColor-open-muted: #048f3e26;
+    --bgColor-open-emphasis: #00873d;
   --bgColor-attention-muted: #bb800926;
   --bgColor-attention-emphasis: #9e6a03;
   --bgColor-severe-muted: #db6d281a;
@@ -1061,10 +1061,10 @@
   --borderColor-neutral-emphasis: #656c76;
   --borderColor-accent-muted: #388bfd66;
   --borderColor-accent-emphasis: #1f6feb;
-    --borderColor-success-muted: #2ea04366;
-    --borderColor-success-emphasis: #238636;
-    --borderColor-open-muted: #2ea04366;
-    --borderColor-open-emphasis: #238636;
+    --borderColor-success-muted: #048f3e66;
+    --borderColor-success-emphasis: #00873d;
+    --borderColor-open-muted: #048f3e66;
+    --borderColor-open-emphasis: #00873d;
   --borderColor-attention-muted: #bb800966;
   --borderColor-attention-emphasis: #9e6a03;
   --borderColor-severe-muted: #db6d2866;
@@ -1086,8 +1086,8 @@
   --color-ansi-gray: #656c76;
   --color-ansi-red: #ff7b72;
   --color-ansi-red-bright: #ffa198;
-    --color-ansi-green: #3fb950;
-    --color-ansi-green-bright: #56d364;
+    --color-ansi-green: #0cb64d;
+    --color-ansi-green-bright: #13c351;
   --color-ansi-yellow: #d29922;
   --color-ansi-yellow-bright: #e3b341;
   --color-ansi-blue: #58a6ff;
@@ -1101,7 +1101,7 @@
   --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
   --color-prettylights-syntax-entity: #d2a8ff;
   --color-prettylights-syntax-storage-modifier-import: #f0f6fc;
-    --color-prettylights-syntax-entity-tag: #7ee787;
+    --color-prettylights-syntax-entity-tag: #1edc5a;
   --color-prettylights-syntax-keyword: #ff7b72;
   --color-prettylights-syntax-string: #a5d6ff;
   --color-prettylights-syntax-variable: #ffa657;
@@ -1111,15 +1111,15 @@
   --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
   --color-prettylights-syntax-carriage-return-text: #f0f6fc;
   --color-prettylights-syntax-carriage-return-bg: #b62324;
-    --color-prettylights-syntax-string-regexp: #7ee787;
+    --color-prettylights-syntax-string-regexp: #1edc5a;
   --color-prettylights-syntax-markup-list: #f2cc60;
   --color-prettylights-syntax-markup-heading: #1f6feb;
   --color-prettylights-syntax-markup-italic: #f0f6fc;
   --color-prettylights-syntax-markup-bold: #f0f6fc;
   --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
   --color-prettylights-syntax-markup-deleted-bg: #67060c;
-    --color-prettylights-syntax-markup-inserted-text: #aff5b4;
-    --color-prettylights-syntax-markup-inserted-bg: #033a16;
+    --color-prettylights-syntax-markup-inserted-text: #70e691;
+    --color-prettylights-syntax-markup-inserted-bg: #00331c;
   --color-prettylights-syntax-markup-changed-text: #ffdfb6;
   --color-prettylights-syntax-markup-changed-bg: #5a1e02;
   --color-prettylights-syntax-markup-ignored-text: #f0f6fc;

/css/functional/themes/light-colorblind.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/light-colorblind.css	2024-10-08 13:34:47.721830461 +0000
@@ -283,7 +283,7 @@
 --button-star-iconColor: #eac54f;
 --buttonCounter-default-bgColor-rest: #818b981f;
 --buttonCounter-invisible-bgColor-rest: #818b981f;
-  --buttonCounter-primary-bgColor-rest: #002d1133;
+  --buttonCounter-primary-bgColor-rest: #00382133;
 --buttonCounter-outline-bgColor-rest: #0969da1a;
 --buttonCounter-outline-bgColor-hover: #ffffff33;
 --buttonCounter-outline-bgColor-disabled: #0969da0d;
@@ -312,7 +312,7 @@
 --skeletonLoader-bgColor: #818b981a;
 --timelineBadge-bgColor: #f6f8fa;
 --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
-  --underlineNav-borderColor-active: #fd8c73;
+  --underlineNav-borderColor-active: #fd794f;
 --underlineNav-borderColor-hover: #d1d9e0b3;
 --underlineNav-iconColor-rest: #59636e;
 --selection-bgColor: #0969da33;
@@ -852,7 +852,7 @@
   --button-star-iconColor: #eac54f;
   --buttonCounter-default-bgColor-rest: #818b981f;
   --buttonCounter-invisible-bgColor-rest: #818b981f;
-    --buttonCounter-primary-bgColor-rest: #002d1133;
+    --buttonCounter-primary-bgColor-rest: #00382133;
   --buttonCounter-outline-bgColor-rest: #0969da1a;
   --buttonCounter-outline-bgColor-hover: #ffffff33;
   --buttonCounter-outline-bgColor-disabled: #0969da0d;
@@ -881,7 +881,7 @@
   --skeletonLoader-bgColor: #818b981a;
   --timelineBadge-bgColor: #f6f8fa;
   --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
-    --underlineNav-borderColor-active: #fd8c73;
+    --underlineNav-borderColor-active: #fd794f;
   --underlineNav-borderColor-hover: #d1d9e0b3;
   --underlineNav-iconColor-rest: #59636e;
   --selection-bgColor: #0969da33;

/css/functional/themes/light-high-contrast.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/light-high-contrast.css	2024-10-08 13:34:48.522840515 +0000
@@ -312,7 +312,7 @@
 --skeletonLoader-bgColor: #dae0e7;
 --timelineBadge-bgColor: #e6eaef;
 --treeViewItem-leadingVisual-iconColor-rest: #368cf9;
-  --underlineNav-borderColor-active: #cd3425;
+  --underlineNav-borderColor-active: #fd794f;
 --underlineNav-borderColor-hover: #454c54;
 --underlineNav-iconColor-rest: #454c54;
 --selection-bgColor: #0349b433;
@@ -881,7 +881,7 @@
   --skeletonLoader-bgColor: #dae0e7;
   --timelineBadge-bgColor: #e6eaef;
   --treeViewItem-leadingVisual-iconColor-rest: #368cf9;
-    --underlineNav-borderColor-active: #cd3425;
+    --underlineNav-borderColor-active: #fd794f;
   --underlineNav-borderColor-hover: #454c54;
   --underlineNav-iconColor-rest: #454c54;
   --selection-bgColor: #0349b433;

/css/functional/themes/light-tritanopia.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/light-tritanopia.css	2024-10-08 13:34:46.841819416 +0000
@@ -283,7 +283,7 @@
 --button-star-iconColor: #eac54f;
 --buttonCounter-default-bgColor-rest: #818b981f;
 --buttonCounter-invisible-bgColor-rest: #818b981f;
-  --buttonCounter-primary-bgColor-rest: #002d1133;
+  --buttonCounter-primary-bgColor-rest: #00382133;
 --buttonCounter-outline-bgColor-rest: #0969da1a;
 --buttonCounter-outline-bgColor-hover: #ffffff33;
 --buttonCounter-outline-bgColor-disabled: #0969da0d;
@@ -312,7 +312,7 @@
 --skeletonLoader-bgColor: #818b981a;
 --timelineBadge-bgColor: #f6f8fa;
 --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
-  --underlineNav-borderColor-active: #fd8c73;
+  --underlineNav-borderColor-active: #fd794f;
 --underlineNav-borderColor-hover: #d1d9e0b3;
 --underlineNav-iconColor-rest: #59636e;
 --selection-bgColor: #0969da33;
@@ -852,7 +852,7 @@
   --button-star-iconColor: #eac54f;
   --buttonCounter-default-bgColor-rest: #818b981f;
   --buttonCounter-invisible-bgColor-rest: #818b981f;
-    --buttonCounter-primary-bgColor-rest: #002d1133;
+    --buttonCounter-primary-bgColor-rest: #00382133;
   --buttonCounter-outline-bgColor-rest: #0969da1a;
   --buttonCounter-outline-bgColor-hover: #ffffff33;
   --buttonCounter-outline-bgColor-disabled: #0969da0d;
@@ -881,7 +881,7 @@
   --skeletonLoader-bgColor: #818b981a;
   --timelineBadge-bgColor: #f6f8fa;
   --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
-    --underlineNav-borderColor-active: #fd8c73;
+    --underlineNav-borderColor-active: #fd794f;
   --underlineNav-borderColor-hover: #d1d9e0b3;
   --underlineNav-iconColor-rest: #59636e;
   --selection-bgColor: #0969da33;

/css/functional/themes/light.css

+++ /home/runner/work/primitives/primitives/dist/css/functional/themes/light.css	2024-10-08 13:34:45.141798067 +0000
@@ -7,9 +7,9 @@
 --page-header-bgColor: #f6f8fa;
 --diffBlob-addition-fgColor-text: #1f2328;
 --diffBlob-addition-fgColor-num: #1f2328;
-  --diffBlob-addition-bgColor-num: #d1f8d9;
-  --diffBlob-addition-bgColor-line: #dafbe1;
-  --diffBlob-addition-bgColor-word: #aceebb;
+  --diffBlob-addition-bgColor-num: #bef5ce;
+  --diffBlob-addition-bgColor-line: #cbf6d7;
+  --diffBlob-addition-bgColor-word: #8aefaa;
 --diffBlob-deletion-fgColor-text: #1f2328;
 --diffBlob-deletion-fgColor-num: #1f2328;
 --diffBlob-deletion-bgColor-num: #ffcecb;
@@ -174,7 +174,7 @@
 --control-borderColor-emphasis: #818b98;
 --control-borderColor-disabled: #818b981a;
 --control-borderColor-selected: #f6f8fa;
-  --control-borderColor-success: #1a7f37;
+  --control-borderColor-success: #00873d;
 --control-borderColor-danger: #cf222e;
 --control-borderColor-warning: #9a6700;
 --control-iconColor-rest: #59636e;
@@ -231,15 +231,15 @@
 --button-primary-fgColor-rest: #ffffff;
 --button-primary-fgColor-disabled: #ffffffcc;
 --button-primary-iconColor-rest: #ffffffcc;
-  --button-primary-bgColor-rest: #1f883d;
-  --button-primary-bgColor-hover: #1c8139;
-  --button-primary-bgColor-active: #197935;
-  --button-primary-bgColor-disabled: #95d8a6;
+  --button-primary-bgColor-rest: #00873d;
+  --button-primary-bgColor-hover: #00823c;
+  --button-primary-bgColor-active: #007e3a;
+  --button-primary-bgColor-disabled: #7cd59d;
 --button-primary-borderColor-rest: #1f232826;
 --button-primary-borderColor-hover: #1f232826;
 --button-primary-borderColor-active: #1f232826;
-  --button-primary-borderColor-disabled: #95d8a6;
-  --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
+  --button-primary-borderColor-disabled: #7cd59d;
+  --button-primary-shadow-selected: inset 0px 1px 0px 0px #0038214d;
 --button-invisible-fgColor-rest: #25292e;
 --button-invisible-fgColor-hover: #25292e;
 --button-invisible-fgColor-disabled: #818b98;
@@ -283,7 +283,7 @@
 --button-star-iconColor: #eac54f;
 --buttonCounter-default-bgColor-rest: #818b981f;
 --buttonCounter-invisible-bgColor-rest: #818b981f;
-  --buttonCounter-primary-bgColor-rest: #002d1133;
+  --buttonCounter-primary-bgColor-rest: #00382133;
 --buttonCounter-outline-bgColor-rest: #0969da1a;
 --buttonCounter-outline-bgColor-hover: #ffffff33;
 --buttonCounter-outline-bgColor-disabled: #0969da0d;
@@ -312,7 +312,7 @@
 --skeletonLoader-bgColor: #818b981a;
 --timelineBadge-bgColor: #f6f8fa;
 --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
-  --underlineNav-borderColor-active: #fd8c73;
+  --underlineNav-borderColor-active: #fd794f;
 --underlineNav-borderColor-hover: #d1d9e0b3;
 --underlineNav-iconColor-rest: #59636e;
 --selection-bgColor: #0969da33;
@@ -443,8 +443,8 @@
 --fgColor-link: #0969da;
 --fgColor-neutral: #59636e;
 --fgColor-accent: #0969da;
-  --fgColor-success: #1a7f37;
-  --fgColor-open: #1a7f37;
+  --fgColor-success: #007036;
+  --fgColor-open: #007036;
 --fgColor-attention: #9a6700;
 --fgColor-severe: #bc4c00;
 --fgColor-danger: #d1242f;
@@ -465,10 +465,10 @@
 --bgColor-neutral-emphasis: #59636e;
 --bgColor-accent-muted: #ddf4ff;
 --bgColor-accent-emphasis: #0969da;
-  --bgColor-success-muted: #dafbe1;
-  --bgColor-success-emphasis: #1f883d;
-  --bgColor-open-muted: #dafbe1;
-  --bgColor-open-emphasis: #1f883d;
+  --bgColor-success-muted: #cbf6d7;
+  --bgColor-success-emphasis: #00873d;
+  --bgColor-open-muted: #cbf6d7;
+  --bgColor-open-emphasis: #00873d;
 --bgColor-attention-muted: #fff8c5;
 --bgColor-attention-emphasis: #9a6700;
 --bgColor-severe-muted: #fff1e5;
@@ -493,10 +493,10 @@
 --borderColor-neutral-emphasis: #59636e;
 --borderColor-accent-muted: #54aeff66;
 --borderColor-accent-emphasis: #0969da;
-  --borderColor-success-muted: #4ac26b66;
-  --borderColor-success-emphasis: #1a7f37;
-  --borderColor-open-muted: #4ac26b66;
-  --borderColor-open-emphasis: #1a7f37;
+  --borderColor-success-muted: #0cc05166;
+  --borderColor-success-emphasis: #00873d;
+  --borderColor-open-muted: #0cc05166;
+  --borderColor-open-emphasis: #00873d;
 --borderColor-attention-muted: #d4a72c66;
 --borderColor-attention-emphasis: #9a6700;
 --borderColor-severe-muted: #fb8f4466;
@@ -518,8 +518,8 @@
 --color-ansi-gray: #59636e;
 --color-ansi-red: #cf222e;
 --color-ansi-red-bright: #a40e26;
-  --color-ansi-green: #116329;
-  --color-ansi-green-bright: #1a7f37;
+  --color-ansi-green: #007036;
+  --color-ansi-green-bright: #00873d;
 --color-ansi-yellow: #4d2d00;
 --color-ansi-yellow-bright: #633c01;
 --color-ansi-blue: #0969da;
@@ -543,15 +543,15 @@
 --color-prettylights-syntax-invalid-illegal-bg: #82071e;
 --color-prettylights-syntax-carriage-return-text: #f6f8fa;
 --color-prettylights-syntax-carriage-return-bg: #cf222e;
-  --color-prettylights-syntax-string-regexp: #116329;
+  --color-prettylights-syntax-string-regexp: #007036;
 --color-prettylights-syntax-markup-list: #3b2300;
 --color-prettylights-syntax-markup-heading: #0550ae;
 --color-prettylights-syntax-markup-italic: #1f2328;
 --color-prettylights-syntax-markup-bold: #1f2328;
 --color-prettylights-syntax-markup-deleted-text: #82071e;
 --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
-  --color-prettylights-syntax-markup-inserted-text: #116329;
-  --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
+  --color-prettylights-syntax-markup-inserted-text: #007036;
+  --color-prettylights-syntax-markup-inserted-bg: #cbf6d7;
 --color-prettylights-syntax-markup-changed-text: #953800;
 --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
 --color-prettylights-syntax-markup-ignored-text: #d1d9e0;
@@ -576,9 +576,9 @@
   --page-header-bgColor: #f6f8fa;
   --diffBlob-addition-fgColor-text: #1f2328;
   --diffBlob-addition-fgColor-num: #1f2328;
-    --diffBlob-addition-bgColor-num: #d1f8d9;
-    --diffBlob-addition-bgColor-line: #dafbe1;
-    --diffBlob-addition-bgColor-word: #aceebb;
+    --diffBlob-addition-bgColor-num: #bef5ce;
+    --diffBlob-addition-bgColor-line: #cbf6d7;
+    --diffBlob-addition-bgColor-word: #8aefaa;
   --diffBlob-deletion-fgColor-text: #1f2328;
   --diffBlob-deletion-fgColor-num: #1f2328;
   --diffBlob-deletion-bgColor-num: #ffcecb;
@@ -743,7 +743,7 @@
   --control-borderColor-emphasis: #818b98;
   --control-borderColor-disabled: #818b981a;
   --control-borderColor-selected: #f6f8fa;
-    --control-borderColor-success: #1a7f37;
+    --control-borderColor-success: #00873d;
   --control-borderColor-danger: #cf222e;
   --control-borderColor-warning: #9a6700;
   --control-iconColor-rest: #59636e;
@@ -800,15 +800,15 @@
   --button-primary-fgColor-rest: #ffffff;
   --button-primary-fgColor-disabled: #ffffffcc;
   --button-primary-iconColor-rest: #ffffffcc;
-    --button-primary-bgColor-rest: #1f883d;
-    --button-primary-bgColor-hover: #1c8139;
-    --button-primary-bgColor-active: #197935;
-    --button-primary-bgColor-disabled: #95d8a6;
+    --button-primary-bgColor-rest: #00873d;
+    --button-primary-bgColor-hover: #00823c;
+    --button-primary-bgColor-active: #007e3a;
+    --button-primary-bgColor-disabled: #7cd59d;
   --button-primary-borderColor-rest: #1f232826;
   --button-primary-borderColor-hover: #1f232826;
   --button-primary-borderColor-active: #1f232826;
-    --button-primary-borderColor-disabled: #95d8a6;
-    --button-primary-shadow-selected: inset 0px 1px 0px 0px #002d114d;
+    --button-primary-borderColor-disabled: #7cd59d;
+    --button-primary-shadow-selected: inset 0px 1px 0px 0px #0038214d;
   --button-invisible-fgColor-rest: #25292e;
   --button-invisible-fgColor-hover: #25292e;
   --button-invisible-fgColor-disabled: #818b98;
@@ -852,7 +852,7 @@
   --button-star-iconColor: #eac54f;
   --buttonCounter-default-bgColor-rest: #818b981f;
   --buttonCounter-invisible-bgColor-rest: #818b981f;
-    --buttonCounter-primary-bgColor-rest: #002d1133;
+    --buttonCounter-primary-bgColor-rest: #00382133;
   --buttonCounter-outline-bgColor-rest: #0969da1a;
   --buttonCounter-outline-bgColor-hover: #ffffff33;
   --buttonCounter-outline-bgColor-disabled: #0969da0d;
@@ -881,7 +881,7 @@
   --skeletonLoader-bgColor: #818b981a;
   --timelineBadge-bgColor: #f6f8fa;
   --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
-    --underlineNav-borderColor-active: #fd8c73;
+    --underlineNav-borderColor-active: #fd794f;
   --underlineNav-borderColor-hover: #d1d9e0b3;
   --underlineNav-iconColor-rest: #59636e;
   --selection-bgColor: #0969da33;
@@ -1012,8 +1012,8 @@
   --fgColor-link: #0969da;
   --fgColor-neutral: #59636e;
   --fgColor-accent: #0969da;
-    --fgColor-success: #1a7f37;
-    --fgColor-open: #1a7f37;
+    --fgColor-success: #007036;
+    --fgColor-open: #007036;
   --fgColor-attention: #9a6700;
   --fgColor-severe: #bc4c00;
   --fgColor-danger: #d1242f;
@@ -1034,10 +1034,10 @@
   --bgColor-neutral-emphasis: #59636e;
   --bgColor-accent-muted: #ddf4ff;
   --bgColor-accent-emphasis: #0969da;
-    --bgColor-success-muted: #dafbe1;
-    --bgColor-success-emphasis: #1f883d;
-    --bgColor-open-muted: #dafbe1;
-    --bgColor-open-emphasis: #1f883d;
+    --bgColor-success-muted: #cbf6d7;
+    --bgColor-success-emphasis: #00873d;
+    --bgColor-open-muted: #cbf6d7;
+    --bgColor-open-emphasis: #00873d;
   --bgColor-attention-muted: #fff8c5;
   --bgColor-attention-emphasis: #9a6700;
   --bgColor-severe-muted: #fff1e5;
@@ -1062,10 +1062,10 @@
   --borderColor-neutral-emphasis: #59636e;
   --borderColor-accent-muted: #54aeff66;
   --borderColor-accent-emphasis: #0969da;
-    --borderColor-success-muted: #4ac26b66;
-    --borderColor-success-emphasis: #1a7f37;
-    --borderColor-open-muted: #4ac26b66;
-    --borderColor-open-emphasis: #1a7f37;
+    --borderColor-success-muted: #0cc05166;
+    --borderColor-success-emphasis: #00873d;
+    --borderColor-open-muted: #0cc05166;
+    --borderColor-open-emphasis: #00873d;
   --borderColor-attention-muted: #d4a72c66;
   --borderColor-attention-emphasis: #9a6700;
   --borderColor-severe-muted: #fb8f4466;
@@ -1087,8 +1087,8 @@
   --color-ansi-gray: #59636e;
   --color-ansi-red: #cf222e;
   --color-ansi-red-bright: #a40e26;
-    --color-ansi-green: #116329;
-    --color-ansi-green-bright: #1a7f37;
+    --color-ansi-green: #007036;
+    --color-ansi-green-bright: #00873d;
   --color-ansi-yellow: #4d2d00;
   --color-ansi-yellow-bright: #633c01;
   --color-ansi-blue: #0969da;
@@ -1112,15 +1112,15 @@
   --color-prettylights-syntax-invalid-illegal-bg: #82071e;
   --color-prettylights-syntax-carriage-return-text: #f6f8fa;
   --color-prettylights-syntax-carriage-return-bg: #cf222e;
-    --color-prettylights-syntax-string-regexp: #116329;
+    --color-prettylights-syntax-string-regexp: #007036;
   --color-prettylights-syntax-markup-list: #3b2300;
   --color-prettylights-syntax-markup-heading: #0550ae;
   --color-prettylights-syntax-markup-italic: #1f2328;
   --color-prettylights-syntax-markup-bold: #1f2328;
   --color-prettylights-syntax-markup-deleted-text: #82071e;
   --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
-    --color-prettylights-syntax-markup-inserted-text: #116329;
-    --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
+    --color-prettylights-syntax-markup-inserted-text: #007036;
+    --color-prettylights-syntax-markup-inserted-bg: #cbf6d7;
   --color-prettylights-syntax-markup-changed-text: #953800;
   --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
   --color-prettylights-syntax-markup-ignored-text: #d1d9e0;

lukasoppermann added the primitives label Oct 4, 2024

lukasoppermann self-assigned this Oct 4, 2024

lukasoppermann added the update snapshots Update visual regression test snapshots label Oct 4, 2024

lukasoppermann temporarily deployed to github-pages October 4, 2024 12:02 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 4, 2024 12:03 Inactive

github-actions bot removed the update snapshots Update visual regression test snapshots label Oct 4, 2024

lukasoppermann force-pushed the brand-color branch from 4a85891 to 18aae87 Compare October 4, 2024 16:17

lukasoppermann temporarily deployed to github-pages October 4, 2024 16:19 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 4, 2024 16:19 Inactive

lukasoppermann changed the title ~~testing~~ Color experiment Oct 7, 2024

lukasoppermann force-pushed the brand-color branch from 18aae87 to 8c27df6 Compare October 8, 2024 07:10

lukasoppermann temporarily deployed to github-pages October 8, 2024 07:12 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 07:14 Inactive

lukasoppermann temporarily deployed to github-pages October 8, 2024 10:20 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 10:20 Inactive

primer deleted a comment from github-actions bot Oct 8, 2024

lukasoppermann temporarily deployed to github-pages October 8, 2024 11:10 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 11:10 Inactive

lukasoppermann temporarily deployed to github-pages October 8, 2024 11:14 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 11:15 Inactive

lukasoppermann temporarily deployed to github-pages October 8, 2024 11:21 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 11:22 Inactive

lukasoppermann force-pushed the brand-color branch from 0f0a6e8 to b2e9316 Compare October 8, 2024 11:22

lukasoppermann temporarily deployed to github-pages October 8, 2024 11:24 — with GitHub Actions Inactive

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 11:24 Inactive

lukasoppermann force-pushed the brand-color branch from b2e9316 to 9e10b71 Compare October 8, 2024 13:33

update dark and light green scales

9acb72d

lukasoppermann force-pushed the brand-color branch from 9e10b71 to 9acb72d Compare October 8, 2024 13:34

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 13:35 Inactive

lukasoppermann deployed to github-pages October 8, 2024 13:35 — with GitHub Actions View deployment

github-actions bot temporarily deployed to Preview (Storybook) October 8, 2024 13:36 Inactive

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Color experiment #1070

Color experiment #1070

lukasoppermann commented Oct 4, 2024

changeset-bot bot commented Oct 4, 2024 •

edited

Loading

github-actions bot commented Oct 4, 2024 •

edited

Loading

/css/functional/themes/dark-colorblind.css

/css/functional/themes/dark-tritanopia.css

/css/functional/themes/dark.css

/css/functional/themes/light-colorblind.css

/css/functional/themes/light-high-contrast.css

/css/functional/themes/light-tritanopia.css

/css/functional/themes/light.css

Color experiment #1070

Are you sure you want to change the base?

Color experiment #1070

Conversation

lukasoppermann commented Oct 4, 2024

Summary

List of notable changes:

What should reviewers focus on?

Steps to test:

changeset-bot bot commented Oct 4, 2024 • edited Loading

⚠️ No Changeset found

github-actions bot commented Oct 4, 2024 • edited Loading

Design Token Diff

/css/functional/themes/dark-colorblind.css

/css/functional/themes/dark-tritanopia.css

/css/functional/themes/dark.css

/css/functional/themes/light-colorblind.css

/css/functional/themes/light-high-contrast.css

/css/functional/themes/light-tritanopia.css

/css/functional/themes/light.css

changeset-bot bot commented Oct 4, 2024 •

edited

Loading

github-actions bot commented Oct 4, 2024 •

edited

Loading