diff --git a/.changeset/rotten-needles-drop.md b/.changeset/rotten-needles-drop.md
new file mode 100644
index 000000000..30b51b333
--- /dev/null
+++ b/.changeset/rotten-needles-drop.md
@@ -0,0 +1,5 @@
+---
+'fumadocs-ui': patch
+---
+
+Fix Banner component z-index
diff --git a/apps/docs/components/preview/index.tsx b/apps/docs/components/preview/index.tsx
index abd9131bd..bff8e72e1 100644
--- a/apps/docs/components/preview/index.tsx
+++ b/apps/docs/components/preview/index.tsx
@@ -224,8 +224,10 @@ export default {
   banner: (
     <Wrapper>
       <div className="flex flex-col gap-4">
-        <Banner>Be careful, Fumadocs v99 has released</Banner>
-        <Banner id="99">Be careful, this banner can be closed</Banner>
+        <Banner className="z-0">Be careful, Fumadocs v99 has released</Banner>
+        <Banner className="z-0" id="99">
+          Be careful, this banner can be closed
+        </Banner>
       </div>
     </Wrapper>
   ),
diff --git a/packages/ui/src/components/banner.tsx b/packages/ui/src/components/banner.tsx
index 23769068c..de8953127 100644
--- a/packages/ui/src/components/banner.tsx
+++ b/packages/ui/src/components/banner.tsx
@@ -25,7 +25,7 @@ export function Banner({
       id={id}
       {...props}
       className={cn(
-        'relative flex h-12 flex-row items-center justify-center bg-fd-secondary px-4 text-center text-sm font-medium',
+        'relative z-40 flex h-12 flex-row items-center justify-center bg-fd-secondary px-4 text-center text-sm font-medium',
         !open && 'hidden',
         props.className,
       )}
diff --git a/packages/ui/src/components/layout/nav.tsx b/packages/ui/src/components/layout/nav.tsx
index 0caec2973..53da902cf 100644
--- a/packages/ui/src/components/layout/nav.tsx
+++ b/packages/ui/src/components/layout/nav.tsx
@@ -51,7 +51,7 @@ export function NavBox({
     <header
       {...props}
       className={cn(
-        'sticky top-0 z-50 border-b transition-colors',
+        'sticky top-0 z-40 border-b transition-colors',
         transparent
           ? 'border-transparent'
           : 'border-fd-foreground/10 bg-fd-background/60 backdrop-blur-md',