@primer/primitives 7.17.0-rc.132f02a7 → 7.17.0-rc.34cd1021

package/dist/figma/typography/typography.json

@@ -0,0 +1,370 @@
+[
+  {
+    "name": "text/codeBlock/lineHeight",
+    "value": "20px",
+    "type": "FLOAT",
+    "refId": "typography/text/codeBlock/lineHeight",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/codeBlock/size",
+    "value": 13,
+    "type": "FLOAT",
+    "refId": "typography/text/codeBlock/size",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/caption/lineHeight",
+    "value": "16px",
+    "type": "FLOAT",
+    "refId": "typography/text/caption/lineHeight",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/caption/size",
+    "value": 12,
+    "type": "FLOAT",
+    "refId": "typography/text/caption/size",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/body/lineHeight/small",
+    "value": "20px",
+    "type": "FLOAT",
+    "refId": "typography/text/body/lineHeight/small",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/body/lineHeight/medium",
+    "value": "20px",
+    "type": "FLOAT",
+    "refId": "typography/text/body/lineHeight/medium",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/body/lineHeight/large",
+    "value": "24px",
+    "type": "FLOAT",
+    "refId": "typography/text/body/lineHeight/large",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/body/size/small",
+    "value": 12,
+    "type": "FLOAT",
+    "refId": "typography/text/body/size/small",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/body/size/medium",
+    "value": 14,
+    "type": "FLOAT",
+    "refId": "typography/text/body/size/medium",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/body/size/large",
+    "value": 16,
+    "type": "FLOAT",
+    "refId": "typography/text/body/size/large",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/subtitle/lineHeight",
+    "value": 1.6,
+    "type": "FLOAT",
+    "refId": "typography/text/subtitle/lineHeight",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/subtitle/size",
+    "value": 20,
+    "type": "FLOAT",
+    "refId": "typography/text/subtitle/size",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/lineHeight/small",
+    "value": "24px",
+    "type": "FLOAT",
+    "refId": "typography/text/title/lineHeight/small",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/lineHeight/medium",
+    "value": "32px",
+    "type": "FLOAT",
+    "refId": "typography/text/title/lineHeight/medium",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/lineHeight/large",
+    "value": "48px",
+    "type": "FLOAT",
+    "refId": "typography/text/title/lineHeight/large",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/size/small",
+    "value": 16,
+    "type": "FLOAT",
+    "refId": "typography/text/title/size/small",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/size/medium",
+    "value": 20,
+    "type": "FLOAT",
+    "refId": "typography/text/title/size/medium",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/size/large",
+    "value": 32,
+    "type": "FLOAT",
+    "refId": "typography/text/title/size/large",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/display/lineHeight",
+    "value": "56px",
+    "type": "FLOAT",
+    "refId": "typography/text/display/lineHeight",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/display/size",
+    "value": 40,
+    "type": "FLOAT",
+    "refId": "typography/text/display/size",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/display/lineBoxHeight",
+    "value": "56px",
+    "type": "FLOAT",
+    "refId": "typography/text/display/lineBoxHeight",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "fontStack/monospace",
+    "value": "SF Mono",
+    "type": "STRING",
+    "refId": "typography/fontStack/monospace",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "fontStack/sansSerif",
+    "value": "SF Pro Text",
+    "type": "STRING",
+    "refId": "typography/fontStack/sansSerif",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "fontStack/system",
+    "value": "SF Pro Text",
+    "type": "STRING",
+    "refId": "typography/fontStack/system",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "base/text/weight/semibold",
+    "value": 600,
+    "type": "FLOAT",
+    "refId": "base/typography/base/text/weight/semibold",
+    "collection": "base/typography",
+    "mode": "default",
+    "group": "base/typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "base/text/weight/medium",
+    "value": 500,
+    "type": "FLOAT",
+    "refId": "base/typography/base/text/weight/medium",
+    "collection": "base/typography",
+    "mode": "default",
+    "group": "base/typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "base/text/weight/normal",
+    "value": 400,
+    "type": "FLOAT",
+    "refId": "base/typography/base/text/weight/normal",
+    "collection": "base/typography",
+    "mode": "default",
+    "group": "base/typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "base/text/weight/light",
+    "value": 300,
+    "type": "FLOAT",
+    "refId": "base/typography/base/text/weight/light",
+    "collection": "base/typography",
+    "mode": "default",
+    "group": "base/typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/codeInline/weight",
+    "value": 400,
+    "type": "FLOAT",
+    "refId": "typography/text/codeInline/weight",
+    "reference": "base/typography/base/text/weight/normal",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/codeBlock/weight",
+    "value": 400,
+    "type": "FLOAT",
+    "refId": "typography/text/codeBlock/weight",
+    "reference": "base/typography/base/text/weight/normal",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/caption/weight",
+    "value": 400,
+    "type": "FLOAT",
+    "refId": "typography/text/caption/weight",
+    "reference": "base/typography/base/text/weight/normal",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/subtitle/weight",
+    "value": 400,
+    "type": "FLOAT",
+    "refId": "typography/text/subtitle/weight",
+    "reference": "base/typography/base/text/weight/normal",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/weight/small",
+    "value": 600,
+    "type": "FLOAT",
+    "refId": "typography/text/title/weight/small",
+    "reference": "base/typography/base/text/weight/semibold",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/weight/medium",
+    "value": 600,
+    "type": "FLOAT",
+    "refId": "typography/text/title/weight/medium",
+    "reference": "base/typography/base/text/weight/semibold",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/title/weight/large",
+    "value": 600,
+    "type": "FLOAT",
+    "refId": "typography/text/title/weight/large",
+    "reference": "base/typography/base/text/weight/semibold",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  },
+  {
+    "name": "text/display/weight",
+    "value": 500,
+    "type": "FLOAT",
+    "refId": "typography/text/display/weight",
+    "reference": "base/typography/base/text/weight/medium",
+    "collection": "typography",
+    "mode": "default",
+    "group": "typography",
+    "scopes": ["ALL_SCOPES"]
+  }
+]

package/dist/internalCss/dark-colorblind.css

@@ -5,16 +5,16 @@
   --base-color-black: #010409;
   --base-color-white: #ffffff;
   --base-color-transparent: #00000000;
-  --base-color-gray-0: #f0f6fc;
-  --base-color-gray-1: #c9d1d9;
-  --base-color-gray-2: #b1bac4;
-  --base-color-gray-3: #8b949e;
-  --base-color-gray-4: #6e7681;
-  --base-color-gray-5: #484f58;
-  --base-color-gray-6: #30363d;
-  --base-color-gray-7: #21262d;
-  --base-color-gray-8: #161b22;
-  --base-color-gray-9: #0d1117;
+  --base-color-neutral-0: #f0f6fc;
+  --base-color-neutral-1: #c9d1d9;
+  --base-color-neutral-2: #b1bac4;
+  --base-color-neutral-3: #8b949e;
+  --base-color-neutral-4: #6e7681;
+  --base-color-neutral-5: #484f58;
+  --base-color-neutral-6: #30363d;
+  --base-color-neutral-7: #21262d;
+  --base-color-neutral-8: #161b22;
+  --base-color-neutral-9: #0d1117;
   --base-color-blue-0: #cae8ff;
   --base-color-blue-1: #a5d6ff;
   --base-color-blue-2: #79c0ff;
@@ -417,6 +417,11 @@
   --display-indigo-fgColor: #9899ec;
   --display-indigo-borderColor-muted: #25215f;
   --display-indigo-borderColor-emphasis: #7070e1;
+  --display-pink-bgColor-muted: #2d1524;
+  --display-pink-bgColor-emphasis: #d34591;
+  --display-pink-fgColor: #e57bb2;
+  --display-pink-borderColor-muted: #451c35;
+  --display-pink-borderColor-emphasis: #d34591;
   --avatar-bgColor: #ffffff1a;
   --avatar-borderColor: #ffffff26;
   --avatar-shadow: 0px 0px 0px 2px #0d1117;
@@ -828,16 +833,16 @@
     --base-color-black: #010409;
     --base-color-white: #ffffff;
     --base-color-transparent: #00000000;
-    --base-color-gray-0: #f0f6fc;
-    --base-color-gray-1: #c9d1d9;
-    --base-color-gray-2: #b1bac4;
-    --base-color-gray-3: #8b949e;
-    --base-color-gray-4: #6e7681;
-    --base-color-gray-5: #484f58;
-    --base-color-gray-6: #30363d;
-    --base-color-gray-7: #21262d;
-    --base-color-gray-8: #161b22;
-    --base-color-gray-9: #0d1117;
+    --base-color-neutral-0: #f0f6fc;
+    --base-color-neutral-1: #c9d1d9;
+    --base-color-neutral-2: #b1bac4;
+    --base-color-neutral-3: #8b949e;
+    --base-color-neutral-4: #6e7681;
+    --base-color-neutral-5: #484f58;
+    --base-color-neutral-6: #30363d;
+    --base-color-neutral-7: #21262d;
+    --base-color-neutral-8: #161b22;
+    --base-color-neutral-9: #0d1117;
     --base-color-blue-0: #cae8ff;
     --base-color-blue-1: #a5d6ff;
     --base-color-blue-2: #79c0ff;
@@ -1240,6 +1245,11 @@
     --display-indigo-fgColor: #9899ec;
     --display-indigo-borderColor-muted: #25215f;
     --display-indigo-borderColor-emphasis: #7070e1;
+    --display-pink-bgColor-muted: #2d1524;
+    --display-pink-bgColor-emphasis: #d34591;
+    --display-pink-fgColor: #e57bb2;
+    --display-pink-borderColor-muted: #451c35;
+    --display-pink-borderColor-emphasis: #d34591;
     --avatar-bgColor: #ffffff1a;
     --avatar-borderColor: #ffffff26;
     --avatar-shadow: 0px 0px 0px 2px #0d1117;

package/dist/internalCss/dark-dimmed.css

@@ -5,16 +5,16 @@
   --base-color-black: #1c2128;
   --base-color-white: #cdd9e5;
   --base-color-transparent: #00000000;
-  --base-color-gray-0: #cdd9e5;
-  --base-color-gray-1: #adbac7;
-  --base-color-gray-2: #909dab;
-  --base-color-gray-3: #768390;
-  --base-color-gray-4: #636e7b;
-  --base-color-gray-5: #545d68;
-  --base-color-gray-6: #444c56;
-  --base-color-gray-7: #373e47;
-  --base-color-gray-8: #2d333b;
-  --base-color-gray-9: #22272e;
+  --base-color-neutral-0: #cdd9e5;
+  --base-color-neutral-1: #adbac7;
+  --base-color-neutral-2: #909dab;
+  --base-color-neutral-3: #768390;
+  --base-color-neutral-4: #636e7b;
+  --base-color-neutral-5: #545d68;
+  --base-color-neutral-6: #444c56;
+  --base-color-neutral-7: #373e47;
+  --base-color-neutral-8: #2d333b;
+  --base-color-neutral-9: #22272e;
   --base-color-blue-0: #c6e6ff;
   --base-color-blue-1: #96d0ff;
   --base-color-blue-2: #6cb6ff;
@@ -417,6 +417,11 @@
   --display-indigo-fgColor: #9899ec;
   --display-indigo-borderColor-muted: #25215f;
   --display-indigo-borderColor-emphasis: #7070e1;
+  --display-pink-bgColor-muted: #2d1524;
+  --display-pink-bgColor-emphasis: #d34591;
+  --display-pink-fgColor: #e57bb2;
+  --display-pink-borderColor-muted: #451c35;
+  --display-pink-borderColor-emphasis: #d34591;
   --avatar-bgColor: #cdd9e51a;
   --avatar-borderColor: #cdd9e526;
   --avatar-shadow: 0px 0px 0px 2px #22272e;
@@ -828,16 +833,16 @@
     --base-color-black: #1c2128;
     --base-color-white: #cdd9e5;
     --base-color-transparent: #00000000;
-    --base-color-gray-0: #cdd9e5;
-    --base-color-gray-1: #adbac7;
-    --base-color-gray-2: #909dab;
-    --base-color-gray-3: #768390;
-    --base-color-gray-4: #636e7b;
-    --base-color-gray-5: #545d68;
-    --base-color-gray-6: #444c56;
-    --base-color-gray-7: #373e47;
-    --base-color-gray-8: #2d333b;
-    --base-color-gray-9: #22272e;
+    --base-color-neutral-0: #cdd9e5;
+    --base-color-neutral-1: #adbac7;
+    --base-color-neutral-2: #909dab;
+    --base-color-neutral-3: #768390;
+    --base-color-neutral-4: #636e7b;
+    --base-color-neutral-5: #545d68;
+    --base-color-neutral-6: #444c56;
+    --base-color-neutral-7: #373e47;
+    --base-color-neutral-8: #2d333b;
+    --base-color-neutral-9: #22272e;
     --base-color-blue-0: #c6e6ff;
     --base-color-blue-1: #96d0ff;
     --base-color-blue-2: #6cb6ff;
@@ -1240,6 +1245,11 @@
     --display-indigo-fgColor: #9899ec;
     --display-indigo-borderColor-muted: #25215f;
     --display-indigo-borderColor-emphasis: #7070e1;
+    --display-pink-bgColor-muted: #2d1524;
+    --display-pink-bgColor-emphasis: #d34591;
+    --display-pink-fgColor: #e57bb2;
+    --display-pink-borderColor-muted: #451c35;
+    --display-pink-borderColor-emphasis: #d34591;
     --avatar-bgColor: #cdd9e51a;
     --avatar-borderColor: #cdd9e526;
     --avatar-shadow: 0px 0px 0px 2px #22272e;

package/dist/internalCss/dark-high-contrast.css

@@ -5,16 +5,16 @@
   --base-color-black: #010409;
   --base-color-white: #ffffff;
   --base-color-transparent: #00000000;
-  --base-color-gray-0: #ffffff;
-  --base-color-gray-1: #f0f3f6;
-  --base-color-gray-2: #d9dee3;
-  --base-color-gray-3: #bdc4cc;
-  --base-color-gray-4: #9ea7b3;
-  --base-color-gray-5: #7a828e;
-  --base-color-gray-6: #525964;
-  --base-color-gray-7: #3d424d;
-  --base-color-gray-8: #272b33;
-  --base-color-gray-9: #0a0c10;
+  --base-color-neutral-0: #ffffff;
+  --base-color-neutral-1: #f0f3f6;
+  --base-color-neutral-2: #d9dee3;
+  --base-color-neutral-3: #bdc4cc;
+  --base-color-neutral-4: #9ea7b3;
+  --base-color-neutral-5: #7a828e;
+  --base-color-neutral-6: #525964;
+  --base-color-neutral-7: #3d424d;
+  --base-color-neutral-8: #272b33;
+  --base-color-neutral-9: #0a0c10;
   --base-color-blue-0: #caeaff;
   --base-color-blue-1: #addcff;
   --base-color-blue-2: #91cbff;
@@ -417,6 +417,11 @@
   --display-indigo-fgColor: #9899ec;
   --display-indigo-borderColor-muted: #25215f;
   --display-indigo-borderColor-emphasis: #7070e1;
+  --display-pink-bgColor-muted: #2d1524;
+  --display-pink-bgColor-emphasis: #d34591;
+  --display-pink-fgColor: #e57bb2;
+  --display-pink-borderColor-muted: #451c35;
+  --display-pink-borderColor-emphasis: #d34591;
   --avatar-bgColor: #ffffff1a;
   --avatar-borderColor: #ffffffe6;
   --avatar-shadow: 0px 0px 0px 2px #0a0c10;
@@ -828,16 +833,16 @@
     --base-color-black: #010409;
     --base-color-white: #ffffff;
     --base-color-transparent: #00000000;
-    --base-color-gray-0: #ffffff;
-    --base-color-gray-1: #f0f3f6;
-    --base-color-gray-2: #d9dee3;
-    --base-color-gray-3: #bdc4cc;
-    --base-color-gray-4: #9ea7b3;
-    --base-color-gray-5: #7a828e;
-    --base-color-gray-6: #525964;
-    --base-color-gray-7: #3d424d;
-    --base-color-gray-8: #272b33;
-    --base-color-gray-9: #0a0c10;
+    --base-color-neutral-0: #ffffff;
+    --base-color-neutral-1: #f0f3f6;
+    --base-color-neutral-2: #d9dee3;
+    --base-color-neutral-3: #bdc4cc;
+    --base-color-neutral-4: #9ea7b3;
+    --base-color-neutral-5: #7a828e;
+    --base-color-neutral-6: #525964;
+    --base-color-neutral-7: #3d424d;
+    --base-color-neutral-8: #272b33;
+    --base-color-neutral-9: #0a0c10;
     --base-color-blue-0: #caeaff;
     --base-color-blue-1: #addcff;
     --base-color-blue-2: #91cbff;
@@ -1240,6 +1245,11 @@
     --display-indigo-fgColor: #9899ec;
     --display-indigo-borderColor-muted: #25215f;
     --display-indigo-borderColor-emphasis: #7070e1;
+    --display-pink-bgColor-muted: #2d1524;
+    --display-pink-bgColor-emphasis: #d34591;
+    --display-pink-fgColor: #e57bb2;
+    --display-pink-borderColor-muted: #451c35;
+    --display-pink-borderColor-emphasis: #d34591;
     --avatar-bgColor: #ffffff1a;
     --avatar-borderColor: #ffffffe6;
     --avatar-shadow: 0px 0px 0px 2px #0a0c10;

package/dist/internalCss/dark-tritanopia.css

@@ -5,16 +5,16 @@
   --base-color-black: #010409;
   --base-color-white: #ffffff;
   --base-color-transparent: #00000000;
-  --base-color-gray-0: #f0f6fc;
-  --base-color-gray-1: #c9d1d9;
-  --base-color-gray-2: #b1bac4;
-  --base-color-gray-3: #8b949e;
-  --base-color-gray-4: #6e7681;
-  --base-color-gray-5: #484f58;
-  --base-color-gray-6: #30363d;
-  --base-color-gray-7: #21262d;
-  --base-color-gray-8: #161b22;
-  --base-color-gray-9: #0d1117;
+  --base-color-neutral-0: #f0f6fc;
+  --base-color-neutral-1: #c9d1d9;
+  --base-color-neutral-2: #b1bac4;
+  --base-color-neutral-3: #8b949e;
+  --base-color-neutral-4: #6e7681;
+  --base-color-neutral-5: #484f58;
+  --base-color-neutral-6: #30363d;
+  --base-color-neutral-7: #21262d;
+  --base-color-neutral-8: #161b22;
+  --base-color-neutral-9: #0d1117;
   --base-color-blue-0: #cae8ff;
   --base-color-blue-1: #a5d6ff;
   --base-color-blue-2: #79c0ff;
@@ -417,6 +417,11 @@
   --display-indigo-fgColor: #9899ec;
   --display-indigo-borderColor-muted: #25215f;
   --display-indigo-borderColor-emphasis: #7070e1;
+  --display-pink-bgColor-muted: #2d1524;
+  --display-pink-bgColor-emphasis: #d34591;
+  --display-pink-fgColor: #e57bb2;
+  --display-pink-borderColor-muted: #451c35;
+  --display-pink-borderColor-emphasis: #d34591;
   --avatar-bgColor: #ffffff1a;
   --avatar-borderColor: #ffffff26;
   --avatar-shadow: 0px 0px 0px 2px #0d1117;
@@ -828,16 +833,16 @@
     --base-color-black: #010409;
     --base-color-white: #ffffff;
     --base-color-transparent: #00000000;
-    --base-color-gray-0: #f0f6fc;
-    --base-color-gray-1: #c9d1d9;
-    --base-color-gray-2: #b1bac4;
-    --base-color-gray-3: #8b949e;
-    --base-color-gray-4: #6e7681;
-    --base-color-gray-5: #484f58;
-    --base-color-gray-6: #30363d;
-    --base-color-gray-7: #21262d;
-    --base-color-gray-8: #161b22;
-    --base-color-gray-9: #0d1117;
+    --base-color-neutral-0: #f0f6fc;
+    --base-color-neutral-1: #c9d1d9;
+    --base-color-neutral-2: #b1bac4;
+    --base-color-neutral-3: #8b949e;
+    --base-color-neutral-4: #6e7681;
+    --base-color-neutral-5: #484f58;
+    --base-color-neutral-6: #30363d;
+    --base-color-neutral-7: #21262d;
+    --base-color-neutral-8: #161b22;
+    --base-color-neutral-9: #0d1117;
     --base-color-blue-0: #cae8ff;
     --base-color-blue-1: #a5d6ff;
     --base-color-blue-2: #79c0ff;
@@ -1240,6 +1245,11 @@
     --display-indigo-fgColor: #9899ec;
     --display-indigo-borderColor-muted: #25215f;
     --display-indigo-borderColor-emphasis: #7070e1;
+    --display-pink-bgColor-muted: #2d1524;
+    --display-pink-bgColor-emphasis: #d34591;
+    --display-pink-fgColor: #e57bb2;
+    --display-pink-borderColor-muted: #451c35;
+    --display-pink-borderColor-emphasis: #d34591;
     --avatar-bgColor: #ffffff1a;
     --avatar-borderColor: #ffffff26;
     --avatar-shadow: 0px 0px 0px 2px #0d1117;