diff --git a/web/settings/account-delete-modal.css b/web/settings/account-delete-modal.css
--- a/web/settings/account-delete-modal.css
+++ b/web/settings/account-delete-modal.css
@@ -1,5 +1,4 @@
 .modal_body {
-  padding: 24px 32px;
   color: var(--fg);
 }
 .modal_body p {
@@ -8,19 +7,23 @@
 
 .deletion_warning {
   font-weight: var(--bold);
-  margin-bottom: 16px;
 }
 
-.form_footer {
-  display: flex;
-  flex-direction: row-reverse;
-  justify-content: space-between;
-  padding-top: 24px;
-}
 .form_error {
   font-size: var(--xs-font-12);
   color: var(--error);
   font-style: italic;
-  padding-left: 6px;
-  align-self: center;
+  height: 24px;
+  display: flex;
+  justify-content: center;
+  align-items: flex-end;
+}
+
+.errorPlaceholder {
+  height: 24px;
+}
+
+.infoContainer {
+  display: flex;
+  column-gap: 8px;
 }
diff --git a/web/settings/account-delete-modal.react.js b/web/settings/account-delete-modal.react.js
--- a/web/settings/account-delete-modal.react.js
+++ b/web/settings/account-delete-modal.react.js
@@ -60,30 +60,41 @@
           deleteAccountAction(),
         );
       },
-      [dispatchActionPromise, deleteAccountAction],
+      [deleteAccountAction, dispatchActionPromise],
+    );
+
+    const primaryButton = React.useMemo(
+      () => (
+        <Button
+          variant="filled"
+          buttonColor={buttonThemes.danger}
+          type="submit"
+          onClick={onDelete}
+          disabled={inputDisabled}
+        >
+          Delete Account
+        </Button>
+      ),
+      [inputDisabled, onDelete],
     );
 
     return (
-      <Modal name="Delete Account" onClose={popModal} size="large">
+      <Modal
+        name="Delete Account"
+        onClose={popModal}
+        size="large"
+        primaryButton={primaryButton}
+      >
         <div className={css.modal_body}>
           <form method="POST">
-            <SWMansionIcon icon="warning-circle" size={22} />
-            <p className={css.deletion_warning}>
-              Your account will be permanently deleted. There is no way to
-              reverse this.
-            </p>
-            <div className={css.form_footer}>
-              <Button
-                variant="filled"
-                buttonColor={buttonThemes.danger}
-                type="submit"
-                onClick={onDelete}
-                disabled={inputDisabled}
-              >
-                Delete Account
-              </Button>
-              {error}
+            <div className={css.infoContainer}>
+              <SWMansionIcon icon="warning-circle" size={22} />
+              <p className={css.deletion_warning}>
+                Your account will be permanently deleted. There is no way to
+                reverse this.
+              </p>
             </div>
+            {error}
           </form>
         </div>
       </Modal>