diff --git a/frontend/src/lib/components/apps/components/layout/AppModal.svelte b/frontend/src/lib/components/apps/components/layout/AppModal.svelte
index e34689c570..6bc1a23d8e 100644
--- a/frontend/src/lib/components/apps/components/layout/AppModal.svelte
+++ b/frontend/src/lib/components/apps/components/layout/AppModal.svelte
@@ -136,7 +136,7 @@
 			`${
 				$mode == 'dnd' ? 'absolute' : 'fixed'
 			} top-0 bottom-0 left-0 right-0 transition-all duration-50`,
-			open ? ' bg-black bg-opacity-60' : 'h-0 overflow-hidden',
+			open ? ' bg-black bg-opacity-60' : 'h-0 overflow-hidden invisible',
 			$mode === 'dnd' ? 'z-[1000]' : 'z-[1100]'
 		)}
 	>
diff --git a/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte b/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte
index 78e51d45e2..5cda0c55a6 100644
--- a/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte
+++ b/frontend/src/lib/components/apps/editor/contextPanel/components/OutputHeader.svelte
@@ -234,7 +234,7 @@
 		</div>
 	</div>
 	<div
-		class="border-b {open ? 'h-full' : 'h-0 overflow-hidden'} {$connectingInput.hoveredComponent ===
+		class="border-b {open ? 'h-full' : 'h-0 overflow-hidden invisible'} {$connectingInput.hoveredComponent ===
 			id && !$selectedComponent?.includes(id)
 			? '  bg-orange-100/40'
 			: ''}"
diff --git a/frontend/src/lib/components/apps/svelte-grid/Grid.svelte b/frontend/src/lib/components/apps/svelte-grid/Grid.svelte
index 6d67a38e67..cbd06a9e1f 100644
--- a/frontend/src/lib/components/apps/svelte-grid/Grid.svelte
+++ b/frontend/src/lib/components/apps/svelte-grid/Grid.svelte
@@ -204,7 +204,7 @@
 		{/each}
 	{:else if xPerPx === 0}
 		{#each sortedItems as item (item.id)}
-			<div class="w-0 h-0 overflow-hidden">
+			<div class="w-0 h-0 overflow-hidden invisible">
 				<slot dataItem={item} item={item[getComputedCols]} />
 			</div>
 		{/each}