diff --git a/packages/app/src/components/contact-modal/index.tsx b/packages/app/src/components/contact-modal/index.tsx
index 6ec64fc144..d22b2ea6c4 100644
--- a/packages/app/src/components/contact-modal/index.tsx
+++ b/packages/app/src/components/contact-modal/index.tsx
@@ -91,8 +91,6 @@ export const ContactModal = ({
             <span>Alpha</span>
           </StyledModalHeaderLeft>
           <ModalCloseButton
-            top={6}
-            right={6}
             onClick={() => {
               onClose();
             }}
diff --git a/packages/app/src/components/delete-workspace/index.tsx b/packages/app/src/components/delete-workspace/index.tsx
index 5cceb487a2..cead4b135e 100644
--- a/packages/app/src/components/delete-workspace/index.tsx
+++ b/packages/app/src/components/delete-workspace/index.tsx
@@ -29,8 +29,6 @@ export const DeleteModal = ({
         <ModalWrapper width={620} height={334}>
           <Header>
             <ModalCloseButton
-              top={6}
-              right={6}
               onClick={() => {
                 onClose();
               }}
diff --git a/packages/app/src/components/login-modal/index.tsx b/packages/app/src/components/login-modal/index.tsx
index d572190ee9..f6dedd7cd8 100644
--- a/packages/app/src/components/login-modal/index.tsx
+++ b/packages/app/src/components/login-modal/index.tsx
@@ -14,8 +14,6 @@ export const LoginModal = ({ open, onClose }: LoginModalProps) => {
       <ModalWrapper width={560} height={292}>
         <Header>
           <ModalCloseButton
-            top={6}
-            right={6}
             onClick={() => {
               onClose();
             }}
diff --git a/packages/app/src/components/logout-modal/index.tsx b/packages/app/src/components/logout-modal/index.tsx
index 91a5641d5b..0aaee3968e 100644
--- a/packages/app/src/components/logout-modal/index.tsx
+++ b/packages/app/src/components/logout-modal/index.tsx
@@ -15,8 +15,6 @@ export const LogoutModal = ({ open, onClose }: LoginModalProps) => {
       <ModalWrapper width={560} height={292}>
         <Header>
           <ModalCloseButton
-            top={6}
-            right={6}
             onClick={() => {
               onClose(true);
             }}
diff --git a/packages/app/src/components/workspace-setting/member/InviteMemberModal.tsx b/packages/app/src/components/workspace-setting/member/InviteMemberModal.tsx
index fb93b53197..dc32718dd7 100644
--- a/packages/app/src/components/workspace-setting/member/InviteMemberModal.tsx
+++ b/packages/app/src/components/workspace-setting/member/InviteMemberModal.tsx
@@ -76,8 +76,6 @@ export const InviteMemberModal = ({
         <ModalWrapper width={460} height={236}>
           <Header>
             <ModalCloseButton
-              top={6}
-              right={6}
               onClick={() => {
                 onClose();
               }}
diff --git a/packages/app/src/ui/modal/ModalCloseButton.tsx b/packages/app/src/ui/modal/ModalCloseButton.tsx
index ee1dd2747b..b42d687ca7 100644
--- a/packages/app/src/ui/modal/ModalCloseButton.tsx
+++ b/packages/app/src/ui/modal/ModalCloseButton.tsx
@@ -5,6 +5,7 @@ import { styled } from '@/styles';
 export type ModalCloseButtonProps = {
   top?: number;
   right?: number;
+  absolute?: boolean;
 } & Omit<IconButtonProps, 'children'> &
   HTMLAttributes<HTMLButtonElement>;
 
@@ -13,16 +14,23 @@ const StyledIconButton = styled(IconButton)<
 >(({ top, right }) => {
   return {
     position: 'absolute',
-    top: top ?? 6,
-    right: right ?? 6,
+    top: top ?? 24,
+    right: right ?? 40,
   };
 });
 
-export const ModalCloseButton = ({ ...props }: ModalCloseButtonProps) => {
-  return (
+export const ModalCloseButton = ({
+  absolute = true,
+  ...props
+}: ModalCloseButtonProps) => {
+  return absolute ? (
     <StyledIconButton {...props}>
       <CloseIcon />
     </StyledIconButton>
+  ) : (
+    <IconButton>
+      <CloseIcon />
+    </IconButton>
   );
 };
 
diff --git a/packages/app/src/ui/modal/ModalWrapper.tsx b/packages/app/src/ui/modal/ModalWrapper.tsx
index f924b58966..79a4d0dbd4 100644
--- a/packages/app/src/ui/modal/ModalWrapper.tsx
+++ b/packages/app/src/ui/modal/ModalWrapper.tsx
@@ -11,7 +11,7 @@ export const ModalWrapper = styled.div<{
     height,
     minHeight,
     backgroundColor: theme.colors.popoverBackground,
-    borderRadius: '12px',
+    borderRadius: '24px',
     position: 'relative',
   };
 });