diff --git a/web/settings/password-change-modal.css b/web/settings/password-change-modal.css
--- a/web/settings/password-change-modal.css
+++ b/web/settings/password-change-modal.css
@@ -1,26 +1,25 @@
-.modal-body {
-  padding: 24px 40px 32px;
-}
-.form-footer {
-  display: flex;
-  flex-direction: row-reverse;
-  justify-content: space-between;
-  padding-top: 8px;
-}
 .modal-form-error {
   font-size: var(--xs-font-12);
   color: var(--text-background-danger-default);
   font-style: italic;
-  padding-left: 6px;
-  align-self: center;
+  height: 24px;
+  display: flex;
+  justify-content: center;
+  align-items: flex-end;
 }
+
+.errorPlaceholder {
+  height: 24px;
+}
+
 .form-content {
   display: flex;
   flex-direction: column;
 }
-.form-content input {
+.form-content input:not(:last-child) {
   margin-bottom: 16px;
 }
+
 .form-content input[type='password'] {
   width: auto;
 }
diff --git a/web/settings/password-change-modal.js b/web/settings/password-change-modal.js
--- a/web/settings/password-change-modal.js
+++ b/web/settings/password-change-modal.js
@@ -59,71 +59,75 @@
   }
 
   render(): React.Node {
-    let errorMsg;
+    const { inputDisabled } = this.props;
+
+    let errorMsg = <div className={css.errorPlaceholder} />;
     if (this.state.errorMessage) {
       errorMsg = (
         <div className={css['modal-form-error']}>{this.state.errorMessage}</div>
       );
     }
 
-    const { inputDisabled } = this.props;
+    const buttonIsDisabled =
+      inputDisabled ||
+      this.state.currentPassword.length === 0 ||
+      this.state.newPassword.length === 0 ||
+      this.state.confirmNewPassword.length === 0;
+
+    const changePasswordButton = (
+      <Button
+        type="submit"
+        variant="filled"
+        onClick={this.onSubmit}
+        disabled={buttonIsDisabled}
+      >
+        Change Password
+      </Button>
+    );
+
     return (
-      <Modal name="Change Password" onClose={this.props.popModal} size="large">
-        <div className={css['modal-body']}>
-          <form method="POST">
-            <div className={css['form-content']}>
-              <p className={css['username-container']}>
-                <span className={css['username-label']}>{'Logged in as '}</span>
-                <span className={css['username']}>
-                  {this.props.stringForUser}
-                </span>
-              </p>
-              <div className={css['form-content']}>
-                <Input
-                  type="password"
-                  placeholder="Current password"
-                  value={this.state.currentPassword}
-                  onChange={this.onChangeCurrentPassword}
-                  disabled={inputDisabled}
-                  ref={this.currentPasswordInputRef}
-                  label="Current password"
-                />
-              </div>
-              <Input
-                type="password"
-                placeholder="New password"
-                value={this.state.newPassword}
-                onChange={this.onChangeNewPassword}
-                ref={this.newPasswordInputRef}
-                disabled={inputDisabled}
-                label="New password"
-              />
-              <Input
-                type="password"
-                placeholder="Confirm new password"
-                value={this.state.confirmNewPassword}
-                onChange={this.onChangeConfirmNewPassword}
-                disabled={inputDisabled}
-              />
-            </div>
-            <div className={css['form-footer']}>
-              <Button
-                type="submit"
-                variant="filled"
-                onClick={this.onSubmit}
-                disabled={
-                  inputDisabled ||
-                  this.state.currentPassword.length === 0 ||
-                  this.state.newPassword.length === 0 ||
-                  this.state.confirmNewPassword.length === 0
-                }
-              >
-                Change Password
-              </Button>
-              {errorMsg}
-            </div>
-          </form>
-        </div>
+      <Modal
+        name="Change Password"
+        onClose={this.props.popModal}
+        size="large"
+        primaryButton={changePasswordButton}
+      >
+        <form method="POST">
+          <div className={css['form-content']}>
+            <p className={css['username-container']}>
+              <span className={css['username-label']}>{'Logged in as '}</span>
+              <span className={css['username']}>
+                {this.props.stringForUser}
+              </span>
+            </p>
+            <Input
+              type="password"
+              placeholder="Current password"
+              value={this.state.currentPassword}
+              onChange={this.onChangeCurrentPassword}
+              disabled={inputDisabled}
+              ref={this.currentPasswordInputRef}
+              label="Current password"
+            />
+            <Input
+              type="password"
+              placeholder="New password"
+              value={this.state.newPassword}
+              onChange={this.onChangeNewPassword}
+              ref={this.newPasswordInputRef}
+              disabled={inputDisabled}
+              label="New password"
+            />
+            <Input
+              type="password"
+              placeholder="Confirm new password"
+              value={this.state.confirmNewPassword}
+              onChange={this.onChangeConfirmNewPassword}
+              disabled={inputDisabled}
+            />
+          </div>
+          {errorMsg}
+        </form>
       </Modal>
     );
   }