diff --git a/src/tokens/border.tokens.json b/src/tokens/border.tokens.json
index 61314cdc959e54769539416da8ee1236ea70cf81..6bd26018594331675a1b40a0721a4708b949b8d4 100644
--- a/src/tokens/border.tokens.json
+++ b/src/tokens/border.tokens.json
@@ -4,7 +4,7 @@
       "default": {
         "$value": {
           "default": "{color.neutral.100}",
-          "dark": "{color.neutral.800}"
+          "dark": "{color.neutral.900}"
         },
         "$type": "color",
         "$description": "Used for the default border color."
@@ -12,7 +12,7 @@
       "subtle": {
         "$value": {
           "default": "{color.neutral.50}",
-          "dark": "{color.neutral.900}"
+          "dark": "{color.neutral.800}"
         },
         "$type": "color",
         "$description": "Used for a subtle border in combination with the default background."
diff --git a/src/tokens/build/css/tokens.dark.css b/src/tokens/build/css/tokens.dark.css
index e542b83e7ee74b0e11cde44b2460a658bc04f2f6..30619b57bbe2b8c9f897904b10e5fd724b76158d 100644
--- a/src/tokens/build/css/tokens.dark.css
+++ b/src/tokens/build/css/tokens.dark.css
@@ -459,8 +459,8 @@
   --gl-background-color-overlap: var(--gl-color-neutral-900); /* Used for components, like tooltips and drawers, and content, like a sticky header, that overlap other content. */
   --gl-background-color-section: var(--gl-color-neutral-800); /* Used for containers, like a card header, that are visually distinct from the default page background only when necessary to maintain affordance and hierarchy in different modes. */
   --gl-background-color-overlay: rgba(0,0,0,0.64); /* Used for an overlay that covers other content. */
-  --gl-border-color-default: var(--gl-color-neutral-800); /* Used for the default border color. */
-  --gl-border-color-subtle: var(--gl-color-neutral-900); /* Used for a subtle border in combination with the default background. */
+  --gl-border-color-default: var(--gl-color-neutral-900); /* Used for the default border color. */
+  --gl-border-color-subtle: var(--gl-color-neutral-800); /* Used for a subtle border in combination with the default background. */
   --gl-border-color-strong: var(--gl-color-neutral-400); /* Used for a distinct border that emphasizes an edge or boundaries. */
   --gl-border-color-transparent: var(--gl-color-alpha-0); /* Used when a border needs to be present, but not visibly perceived. */
   --gl-alert-neutral-border-top-color: var(--gl-color-neutral-400); /* Used for the border center color of a neutral alert. */
diff --git a/src/tokens/build/js/tokens.dark.js b/src/tokens/build/js/tokens.dark.js
index 04d3d1a929fb11c90dc27d868235c5418479d7fa..1b247d9740dc8f405ad26d9647f6887eb14c4ae5 100644
--- a/src/tokens/build/js/tokens.dark.js
+++ b/src/tokens/build/js/tokens.dark.js
@@ -84,8 +84,8 @@ export const GL_BACKGROUND_COLOR_DISABLED = '#28272d';
 export const GL_BACKGROUND_COLOR_OVERLAP = '#28272d';
 export const GL_BACKGROUND_COLOR_SECTION = '#3a383f';
 export const GL_BACKGROUND_COLOR_OVERLAY = 'rgba(0,0,0,0.64)';
-export const GL_BORDER_COLOR_DEFAULT = '#3a383f';
-export const GL_BORDER_COLOR_SUBTLE = '#28272d';
+export const GL_BORDER_COLOR_DEFAULT = '#28272d';
+export const GL_BORDER_COLOR_SUBTLE = '#3a383f';
 export const GL_BORDER_COLOR_STRONG = '#89888d';
 export const GL_BORDER_COLOR_SECTION = '#18171d';
 export const GL_BORDER_COLOR_TRANSPARENT = 'transparent';
diff --git a/src/tokens/build/json/tokens.dark.json b/src/tokens/build/json/tokens.dark.json
index b73a7800b38950901866cc53d63662241bb5f26f..5e4dfc4d83b2bf18e38c2486772b51bda3c41582 100644
--- a/src/tokens/build/json/tokens.dark.json
+++ b/src/tokens/build/json/tokens.dark.json
@@ -1954,7 +1954,7 @@
   "border": {
     "color": {
       "default": {
-        "$value": "#3a383f",
+        "$value": "#28272d",
         "$type": "color",
         "$description": "Used for the default border color.",
         "filePath": "src/tokens/border.tokens.json",
@@ -1962,7 +1962,7 @@
         "original": {
           "$value": {
             "default": "{color.neutral.100}",
-            "dark": "{color.neutral.800}"
+            "dark": "{color.neutral.900}"
           },
           "$type": "color",
           "$description": "Used for the default border color."
@@ -1976,7 +1976,7 @@
         ]
       },
       "subtle": {
-        "$value": "#28272d",
+        "$value": "#3a383f",
         "$type": "color",
         "$description": "Used for a subtle border in combination with the default background.",
         "filePath": "src/tokens/border.tokens.json",
@@ -1984,7 +1984,7 @@
         "original": {
           "$value": {
             "default": "{color.neutral.50}",
-            "dark": "{color.neutral.900}"
+            "dark": "{color.neutral.800}"
           },
           "$type": "color",
           "$description": "Used for a subtle border in combination with the default background."
diff --git a/src/tokens/build/json/tokens.json b/src/tokens/build/json/tokens.json
index 6eb9552a6c077b987d8aa1ecacf8b3a50bf4865f..be4febdcfd6127f782974d32497ef5c1728f83bf 100644
--- a/src/tokens/build/json/tokens.json
+++ b/src/tokens/build/json/tokens.json
@@ -1962,7 +1962,7 @@
         "original": {
           "$value": {
             "default": "{color.neutral.100}",
-            "dark": "{color.neutral.800}"
+            "dark": "{color.neutral.900}"
           },
           "$type": "color",
           "$description": "Used for the default border color."
@@ -1984,7 +1984,7 @@
         "original": {
           "$value": {
             "default": "{color.neutral.50}",
-            "dark": "{color.neutral.900}"
+            "dark": "{color.neutral.800}"
           },
           "$type": "color",
           "$description": "Used for a subtle border in combination with the default background."
diff --git a/src/tokens/build/scss/_tokens.dark.scss b/src/tokens/build/scss/_tokens.dark.scss
index 2162f8d79264e950629260c47088c1421b9772c7..4e49fe80c4714cce39869a5b10b46be85259fe30 100644
--- a/src/tokens/build/scss/_tokens.dark.scss
+++ b/src/tokens/build/scss/_tokens.dark.scss
@@ -457,8 +457,8 @@ $gl-background-color-disabled: $gl-color-neutral-900; // Used to identify a disa
 $gl-background-color-overlap: $gl-color-neutral-900; // Used for components, like tooltips and drawers, and content, like a sticky header, that overlap other content.
 $gl-background-color-section: $gl-color-neutral-800; // Used for containers, like a card header, that are visually distinct from the default page background only when necessary to maintain affordance and hierarchy in different modes.
 $gl-background-color-overlay: rgba(0,0,0,0.64); // Used for an overlay that covers other content.
-$gl-border-color-default: $gl-color-neutral-800; // Used for the default border color.
-$gl-border-color-subtle: $gl-color-neutral-900; // Used for a subtle border in combination with the default background.
+$gl-border-color-default: $gl-color-neutral-900; // Used for the default border color.
+$gl-border-color-subtle: $gl-color-neutral-800; // Used for a subtle border in combination with the default background.
 $gl-border-color-strong: $gl-color-neutral-400; // Used for a distinct border that emphasizes an edge or boundaries.
 $gl-border-color-transparent: $gl-color-alpha-0; // Used when a border needs to be present, but not visibly perceived.
 $gl-alert-neutral-border-top-color: $gl-color-neutral-400; // Used for the border center color of a neutral alert.
diff --git a/src/tokens/examples.stories.js b/src/tokens/examples.stories.js
index 0bf73d1ae0aea0125dde0d39aedbc8f26231a08f..329c2945f883401a3dac85423a461270224335b4 100644
--- a/src/tokens/examples.stories.js
+++ b/src/tokens/examples.stories.js
@@ -23,6 +23,25 @@ export const Surfaces = () => ({
   `,
 });
 
+export const Pairs = () => ({
+  template: `
+    <div class="gl-grid md:gl-grid-cols-3 gl-gap-5 gl-text-base">
+      <div class="gl-grid gl-place-items-center gl-p-5 gl-rounded-lg gl-bg-default gl-border gl-border-default">
+        default
+      </div>
+      <div class="gl-grid gl-place-items-center gl-p-5 gl-rounded-lg gl-bg-subtle gl-border gl-border-subtle">
+        subtle
+      </div>
+      <div class="gl-grid gl-place-items-center gl-p-5 gl-rounded-lg gl-bg-strong gl-border gl-border-strong">
+        strong
+      </div>
+      <div class="gl-grid gl-place-items-center gl-p-5 gl-rounded-lg gl-bg-section gl-border gl-border-section">
+        section
+      </div>
+    </div>
+  `,
+});
+
 export const Section = () => ({
   template: `
     <div class="gl-border gl-border-section gl-rounded-lg gl-overflow-hidden gl-text-base">
diff --git a/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-border-dark-1-snap.png b/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-border-dark-1-snap.png
index fea6bc463cc523e83c285609b6ebb844ace60da0..a0cc85bb71a6b7231fecc5e08db18e3daabfa3e5 100644
Binary files a/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-border-dark-1-snap.png and b/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-border-dark-1-snap.png differ
diff --git a/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-examples-pairs-1-snap.png b/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-examples-pairs-1-snap.png
new file mode 100644
index 0000000000000000000000000000000000000000..7a667eef70d56530b73823fbb39f1eed225fa49a
Binary files /dev/null and b/tests/__image_snapshots__/storyshots-spec-js-image-storyshots-tokens-examples-pairs-1-snap.png differ