diff --git a/core/http/react-ui/src/components/LoadingSpinner.jsx b/core/http/react-ui/src/components/LoadingSpinner.jsx
index b1c1b46a2..5a1df8d51 100644
--- a/core/http/react-ui/src/components/LoadingSpinner.jsx
+++ b/core/http/react-ui/src/components/LoadingSpinner.jsx
@@ -1,7 +1,11 @@
 export default function LoadingSpinner({ size = 'md', className = '' }) {
-  const sizeClass = size === 'sm' ? 'spinner-sm' : size === 'lg' ? 'spinner-lg' : 'spinner-md'
+  const sizeClass =
+    size === 'sm' ? 'spinner-sm'
+    : size === 'lg' ? 'spinner-lg'
+    : size === 'boot' ? 'spinner-lg'
+    : 'spinner-md'
   return (
-    <div className={`spinner ${sizeClass} ${className}`}>
+    <div className={`spinner ${sizeClass} ${className}`} role="status" aria-label="Loading">
       <div className="spinner-ring" />
     </div>
   )
diff --git a/core/http/react-ui/src/main.jsx b/core/http/react-ui/src/main.jsx
index b98fe0009..427494d43 100644
--- a/core/http/react-ui/src/main.jsx
+++ b/core/http/react-ui/src/main.jsx
@@ -14,11 +14,12 @@ import '@fontsource-variable/fraunces'
 import './index.css'
 import './theme.css'
 import './App.css'
+import LoadingSpinner from './components/LoadingSpinner'
 
 function BootFallback() {
   return (
-    <div className="app-boot-spinner" role="status" aria-label="Loading">
-      <div className="app-boot-spinner-dot" />
+    <div className="app-boot-spinner">
+      <LoadingSpinner size="boot" />
     </div>
   )
 }