diff --git a/.changeset/wicked-impalas-fry.md b/.changeset/wicked-impalas-fry.md
new file mode 100644
index 0000000000..35633b51e2
--- /dev/null
+++ b/.changeset/wicked-impalas-fry.md
@@ -0,0 +1,7 @@
+---
+'@backstage/ui': patch
+---
+
+Fixed HeaderNav hover indicator covering tab text when theme uses opaque background colors. Also fixed an incorrect CSS variable reference (`--bui-font-family` → `--bui-font-regular`).
+
+**Affected components:** Header
diff --git a/packages/ui/src/components/Header/HeaderNav.module.css b/packages/ui/src/components/Header/HeaderNav.module.css
index 992e989a46..d2446fd8c0 100644
--- a/packages/ui/src/components/Header/HeaderNav.module.css
+++ b/packages/ui/src/components/Header/HeaderNav.module.css
@@ -50,7 +50,7 @@
 
   .bui-HeaderNavItem,
   .bui-HeaderNavGroup {
-    font-family: var(--bui-font-family);
+    font-family: var(--bui-font-regular);
     font-size: var(--bui-font-size-3);
     font-weight: var(--bui-font-weight-regular);
     color: var(--bui-fg-secondary);
@@ -61,6 +61,8 @@
     padding-inline: var(--bui-space-2);
     text-decoration: none;
     cursor: pointer;
+    position: relative;
+    z-index: 2;
     border: none;
     background: none;
     outline: none;