diff --git a/inst/BS5/assets/pkgdown.scss b/inst/BS5/assets/pkgdown.scss
index d28280f8b..8236159f6 100644
--- a/inst/BS5/assets/pkgdown.scss
+++ b/inst/BS5/assets/pkgdown.scss
@@ -20,18 +20,16 @@
 
 /* navbar =================================================================== */
 
-$pkgdown-navbar-bg: mix(mix($body-bg, $body-color, 95%), $primary, 98%) !default;
-$pkgdown-navbar-bg-dark: mix(mix($body-bg-dark, $body-color-dark, 95%), $primary, 98%) !default;
+$pkgdown-navbar-bg: null !default;
 
 // BS navbars appears to be designed with the idea that you have a coloured
 // navbar that looks the same in both light and dark mode. We prefer a mildly
 // coloured navbar that's just different enough from the body to stand out.
 .navbar {
+  background: RGBA(var(--bs-body-color-rgb), 0.1);
+  background: color-mix(in oklab, color-mix(in oklab, var(--bs-body-bg) 95%, var(--bs-body-color)) 98%, var(--bs-primary));
   background: $pkgdown-navbar-bg;
 }
-[data-bs-theme="dark"] .navbar {
-  background: $pkgdown-navbar-bg-dark;
-}
 
 // make both the active nav and the hovered nav more clear by mixing the
 // background colour with the body and primary colours respectively