diff --git a/packages/nc-gui/components/general/Overlay.vue b/packages/nc-gui/components/general/Overlay.vue
index da9ce2b175..a40a0490e7 100644
--- a/packages/nc-gui/components/general/Overlay.vue
+++ b/packages/nc-gui/components/general/Overlay.vue
@@ -11,7 +11,7 @@ interface Props {
   target?: TeleportProps['to']
   teleportDisabled?: TeleportProps['disabled']
   transition?: boolean
-  lightBackground?: boolean
+  className?: string
 }
 
 interface Emits {
@@ -50,10 +50,9 @@ export default {
         vModel ? 'opacity-100' : 'opacity-0 pointer-events-none',
         inline ? 'absolute' : 'fixed',
         transition ? 'transition-opacity duration-200 ease-in-out' : '',
-        lightBackground ? 'bg-gray-100/25' : '',
-        !lightBackground ? 'bg-gray-700/75' : '',
+        className,
       ]"
-      class="z-100 top-0 left-0 bottom-0 right-0 bg-gray-100/25"
+      class="z-100 top-0 left-0 bottom-0 right-0 bg-gray-700/75"
     >
       <slot :is-open="vModel" />
     </div>
diff --git a/packages/nc-gui/components/smartsheet/Grid.vue b/packages/nc-gui/components/smartsheet/Grid.vue
index 6e5886c512..27f554ee11 100644
--- a/packages/nc-gui/components/smartsheet/Grid.vue
+++ b/packages/nc-gui/components/smartsheet/Grid.vue
@@ -381,7 +381,7 @@ onBeforeUnmount(async () => {
 
 <template>
   <div class="flex flex-col h-full min-h-0 w-full">
-    <general-overlay :model-value="isLoading" inline transition light-background>
+    <general-overlay :model-value="isLoading" inline transition class="!bg-gray-100/25">
       <div class="flex items-center justify-center h-full w-full">
         <a-spin size="large" />
       </div>