diff --git a/packages/web-app-search/src/portals/SearchBar.vue b/packages/web-app-search/src/portals/SearchBar.vue
index 281b6ee444d..05aa0632a26 100644
--- a/packages/web-app-search/src/portals/SearchBar.vue
+++ b/packages/web-app-search/src/portals/SearchBar.vue
@@ -223,7 +223,7 @@ export default {
         background-color: var(--oc-color-background-muted);
         border: 1px solid rgba(75, 94, 120, 0.6);
         top: -20px;
-        z-index: 9999;
+        z-index: var(--oc-z-index-modal);
         min-width: 252px !important;
       }
 
diff --git a/packages/web-runtime/src/components/SidebarNav/SidebarNav.vue b/packages/web-runtime/src/components/SidebarNav/SidebarNav.vue
index 6835ffc75a5..d8b416734db 100644
--- a/packages/web-runtime/src/components/SidebarNav/SidebarNav.vue
+++ b/packages/web-runtime/src/components/SidebarNav/SidebarNav.vue
@@ -88,7 +88,7 @@ export default {
   top: 0;
   transition: all 0.35s cubic-bezier(0.34, 0.11, 0, 1.12);
   box-shadow: 5px 0 25px rgba(0, 0, 0, 0.3);
-  z-index: 3;
+  z-index: 4;
 
   .toggle-sidebar-button {
     transition: all 0.2s ease-out;
diff --git a/packages/web-runtime/src/components/SkipTo.vue b/packages/web-runtime/src/components/SkipTo.vue
index e55b1b44e57..bee6bbc4d82 100644
--- a/packages/web-runtime/src/components/SkipTo.vue
+++ b/packages/web-runtime/src/components/SkipTo.vue
@@ -33,7 +33,7 @@ export default {
   position: absolute;
   top: -100px;
   left: 0;
-  z-index: 4;
+  z-index: 6;
   -webkit-appearance: none;
   border: none;
   background-color: var(--oc-color-swatch-brand-default);
diff --git a/packages/web-runtime/src/components/TopBar.vue b/packages/web-runtime/src/components/TopBar.vue
index 348cd2b014f..4ddd34b0ae5 100644
--- a/packages/web-runtime/src/components/TopBar.vue
+++ b/packages/web-runtime/src/components/TopBar.vue
@@ -93,7 +93,7 @@ export default {
 #oc-topbar {
   height: 60px;
   position: sticky;
-  z-index: 2;
+  z-index: 5;
   img {
     height: 42px;
     image-rendering: auto;