diff --git a/packages/ui/src/base/sheet/sheet-content.svelte b/packages/ui/src/base/sheet/sheet-content.svelte
index 2a143a2b..c6677155 100644
--- a/packages/ui/src/base/sheet/sheet-content.svelte
+++ b/packages/ui/src/base/sheet/sheet-content.svelte
@@ -32,17 +32,19 @@
     class: className,
     side = 'right',
     portalProps,
+    overlayClass,
     children,
     ...restProps
   }: WithoutChildrenOrChild<SheetPrimitive.ContentProps> & {
     portalProps?: SheetPrimitive.PortalProps;
     side?: Side;
+    overlayClass?: string;
     children: Snippet;
   } = $props();
 </script>
 
 <SheetPrimitive.Portal {...portalProps}>
-  <SheetOverlay />
+  <SheetOverlay class={overlayClass} />
   <SheetPrimitive.Content
     bind:ref
     data-slot="sheet-content"
diff --git a/packages/ui/src/base/sidebar/sidebar.svelte b/packages/ui/src/base/sidebar/sidebar.svelte
index 389bfee2..010f149d 100644
--- a/packages/ui/src/base/sidebar/sidebar.svelte
+++ b/packages/ui/src/base/sidebar/sidebar.svelte
@@ -39,7 +39,11 @@
       data-sidebar="sidebar"
       data-slot="sidebar"
       data-mobile="true"
-      class="ui:bg-sidebar ui:text-sidebar-foreground ui:w-(--sidebar-width) ui:p-0 ui:[&>button]:hidden"
+      overlayClass="ui:z-150!"
+      class={cn(
+        'ui:bg-sidebar ui:text-sidebar-foreground ui:w-(--sidebar-width) ui:z-150! ui:p-0 ui:[&>button]:hidden',
+        className
+      )}
       style="--sidebar-width: {SIDEBAR_WIDTH_MOBILE};"
       {side}
     >