diff --git a/packages/app/src/ui/button/button.tsx b/packages/app/src/ui/button/button.tsx
index def9211503..0434ee5331 100644
--- a/packages/app/src/ui/button/button.tsx
+++ b/packages/app/src/ui/button/button.tsx
@@ -43,14 +43,16 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
         {loading ? (
           <Loading type={type}></Loading>
         ) : (
-          icon &&
-          cloneElement(Children.only(icon), {
-            width: iconSize,
-            height: iconSize,
-            className: `affine-button-icon ${icon.props.className ?? ''}`,
-          })
+          <>
+            {icon &&
+              cloneElement(Children.only(icon), {
+                width: iconSize,
+                height: iconSize,
+                className: `affine-button-icon ${icon.props.className ?? ''}`,
+              })}
+            {children && <span>{children}</span>}
+          </>
         )}
-        {children && <span>{children}</span>}
       </StyledButton>
     );
   }