diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts b/core/src/components/tab-button/test/states/tab-button.e2e.ts
index bd10cad844b..5af2a6f660b 100644
--- a/core/src/components/tab-button/test/states/tab-button.e2e.ts
+++ b/core/src/components/tab-button/test/states/tab-button.e2e.ts
@@ -80,3 +80,25 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, screenshot, c
     });
   });
 });
+
+configs({ palettes: ['dark'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+  test.describe(title('tab-button: states in dark palette'), () => {
+    test.describe('focus', () => {
+      test('should render correct focus state in dark palette', async ({ page }) => {
+        await page.setContent(
+          `
+          <ion-tab-bar style="width: 300px">
+            <ion-tab-button href="#" class="ion-focused">
+              <ion-label>Favorites</ion-label>
+            </ion-tab-button>
+          </ion-tab-bar>
+        `,
+          config
+        );
+
+        const tabBar = page.locator('ion-tab-bar');
+        await expect(tabBar).toHaveScreenshot(screenshot('tab-button-focus'));
+      });
+    });
+  });
+});
diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Chrome-linux.png b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..e10ffc9234e
Binary files /dev/null and b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Firefox-linux.png b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..8e73480665e
Binary files /dev/null and b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Safari-linux.png b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..7f5e6822d7a
Binary files /dev/null and b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-ios-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Chrome-linux.png b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..47ac6ff6786
Binary files /dev/null and b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Firefox-linux.png b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..cede72558c0
Binary files /dev/null and b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Safari-linux.png b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..9119cb57fc1
Binary files /dev/null and b/core/src/components/tab-button/test/states/tab-button.e2e.ts-snapshots/tab-button-focus-md-ltr-dark-Mobile-Safari-linux.png differ
diff --git a/core/src/css/palettes/dark.scss b/core/src/css/palettes/dark.scss
index 0c5ef08dd93..c21d2f09beb 100644
--- a/core/src/css/palettes/dark.scss
+++ b/core/src/css/palettes/dark.scss
@@ -126,6 +126,7 @@ $colors:  (
     --ion-text-color-step-900: #1a1a1a;
     --ion-text-color-step-950: #0d0d0d;
     --ion-item-background: #000000;
+    --ion-tab-bar-background-focused: #0b0b0b;
     --ion-card-background: #1c1c1d;
   }
 
@@ -183,6 +184,7 @@ $colors:  (
     --ion-item-background: #1e1e1e;
     --ion-toolbar-background: #1f1f1f;
     --ion-tab-bar-background: #1f1f1f;
+    --ion-tab-bar-background-focused: #1b1b1b;
     --ion-card-background: #1e1e1e;
   }
 }
diff --git a/core/src/css/palettes/high-contrast-dark.scss b/core/src/css/palettes/high-contrast-dark.scss
index e0f3b8aeb57..626dfecf1a5 100644
--- a/core/src/css/palettes/high-contrast-dark.scss
+++ b/core/src/css/palettes/high-contrast-dark.scss
@@ -119,6 +119,7 @@ $lightest-text-color: $text-color;
     --ion-text-color-rgb: #{color-to-rgb-list($text-color)};
     --ion-item-background: #000000;
     --ion-card-background: #1c1c1d;
+    --ion-tab-bar-background-focused: #0b0b0b;
 
     /// Only the item borders should increase in contrast
     /// Borders for elements like toolbars should remain the same
@@ -185,6 +186,7 @@ $lightest-text-color: $text-color;
     --ion-item-background: #1e1e1e;
     --ion-toolbar-background: #1f1f1f;
     --ion-tab-bar-background: #1f1f1f;
+    --ion-tab-bar-background-focused: #1b1b1b;
     --ion-card-background: #1e1e1e;
 
     /// Only the item borders should increase in contrast