diff --git a/main/providers/index.tsx b/main/providers/index.tsx
index 4ce2cc3d..de9febb7 100644
--- a/main/providers/index.tsx
+++ b/main/providers/index.tsx
@@ -10,6 +10,7 @@ import type {AlertDialogContext} from '../modals/AlertDialog';
 import AlertDialog from '../modals/AlertDialog';
 import type {SnackbarContext, SnackbarOptions} from '../modals/Snackbar';
 import Snackbar from '../modals/Snackbar';
+import {LoadingIndicator} from '../uis/LoadingIndicator';
 import createCtx from '../utils/createCtx';
 
 export type {ThemeContext} from '@dooboo-ui/theme';
@@ -80,7 +81,15 @@ function AppProvider({children}: {children: JSX.Element}): JSX.Element {
           alertDialog: alertDialogContext,
         }}
       >
-        {!assetLoaded ? null : (
+        {!assetLoaded ? (
+          <LoadingIndicator
+            style={css`
+              align-self: stretch;
+              flex: 1;
+              justify-content: center;
+            `}
+          />
+        ) : (
           <>
             {children}
             <Snackbar ref={snackbar} />
diff --git a/main/uis/IconButton/index.tsx b/main/uis/IconButton/index.tsx
index 7191d660..06bf01a1 100644
--- a/main/uis/IconButton/index.tsx
+++ b/main/uis/IconButton/index.tsx
@@ -227,7 +227,16 @@ export function IconButton({
         >
           {loading
             ? loadingElement || (
-                <LoadingIndicator color={theme.text.basic} size="small" />
+                <LoadingIndicator
+                  color={theme.text.disabled}
+                  size="small"
+                  style={css`
+                    justify-content: center;
+                    align-items: center;
+                    height: ${iconSize + 'px'};
+                    width: ${iconSize + 'px'};
+                  `}
+                />
               )
             : iconElement || (
                 <Icon