diff --git a/libs/components/src/tabs/tab-item.component.ts b/libs/components/src/tabs/tab-item.component.ts
index cda332e26d..b8fb7a1e2b 100644
--- a/libs/components/src/tabs/tab-item.component.ts
+++ b/libs/components/src/tabs/tab-item.component.ts
@@ -25,10 +25,10 @@ export class TabItemComponent {
       "!tw-text-main",
       "hover:tw-underline",
       "hover:!tw-text-main",
-      "focus:tw-z-10",
-      "focus:tw-outline-none",
-      "focus:tw-ring-2",
-      "focus:tw-ring-primary-700",
+      "focus-visible:tw-z-10",
+      "focus-visible:tw-outline-none",
+      "focus-visible:tw-ring-2",
+      "focus-visible:tw-ring-primary-700",
       "disabled:tw-bg-secondary-100",
       "disabled:!tw-text-muted",
       "disabled:tw-no-underline",
@@ -47,8 +47,8 @@ export class TabItemComponent {
       "!tw-text-primary-500",
       "hover:tw-border-t-primary-700",
       "hover:!tw-text-primary-700",
-      "focus:tw-border-t-primary-700",
-      "focus:!tw-text-primary-700",
+      "focus-visible:tw-border-t-primary-700",
+      "focus-visible:!tw-text-primary-700",
     ].join(" ");
   }
 }