diff --git a/src/components/LoadingSpinner/index.tsx b/src/components/LoadingSpinner/index.tsx
index 2c6f4e5..648eb9a 100644
--- a/src/components/LoadingSpinner/index.tsx
+++ b/src/components/LoadingSpinner/index.tsx
@@ -1,3 +1,4 @@
+import { createPortal } from 'react-dom'
 import styles from './style.module.scss'
 
 interface Props {
@@ -20,7 +21,7 @@ export const LoadingSpinner = (props: Props) => {
       )
 
     default:
-      return (
+      return createPortal(
         <div className={styles.loadingSpinnerOverlay}>
           <div
             className={styles.loadingSpinnerContainer}
@@ -29,7 +30,8 @@ export const LoadingSpinner = (props: Props) => {
             <div className={styles.loadingSpinner}></div>
             {desc && <p className={styles.loadingSpinnerDesc}>{desc}</p>}
           </div>
-        </div>
+        </div>,
+        document.getElementById('root')!
       )
   }
 }