diff --git a/src/frontend/src/App.tsx b/src/frontend/src/App.tsx
index 1b4393b55..c4823d539 100644
--- a/src/frontend/src/App.tsx
+++ b/src/frontend/src/App.tsx
@@ -137,7 +137,7 @@ export default function App() {
         FallbackComponent={CrashErrorComponent}
       >
         {loading ? (
-          <div className="flex h-screen items-center justify-center">
+          <div className="loading-page-panel">
             <LoadingComponent remSize={50} />
           </div>
         ) : (
diff --git a/src/frontend/src/style/applies.css b/src/frontend/src/style/applies.css
index 34f0f6732..481d94afb 100644
--- a/src/frontend/src/style/applies.css
+++ b/src/frontend/src/style/applies.css
@@ -192,6 +192,10 @@
     @apply flex w-full;
   }
 
+  .loading-page-panel {
+    @apply h-full w-full flex justify-center items-center bg-muted;
+  }
+
   .main-page-panel {
     @apply flex-max-width h-full flex-col overflow-auto bg-muted px-16;
   }