diff --git a/dashboard/src/components/dialogs/DisableTwoFADialog.vue b/dashboard/src/components/dialogs/DisableTwoFADialog.vue
new file mode 100644
index 000000000..fd3885b30
--- /dev/null
+++ b/dashboard/src/components/dialogs/DisableTwoFADialog.vue
@@ -0,0 +1,85 @@
+<script setup>
+
+import { ref, useTemplateRef, computed } from 'vue';
+import { PasswordInput, Dialog, FormGroup } from 'pankow';
+import ProfileModel from '../../models/ProfileModel.js';
+
+const emit = defineEmits([ 'success' ]);
+
+const profileModel = ProfileModel.create();
+
+const dialog = useTemplateRef('dialog');
+const formError = ref({});
+const busy = ref (false);
+const password = ref('');
+
+const isFormValid = computed(() => {
+  if (!password.value) return false;
+
+  return true;
+});
+
+async function onSubmit() {
+  if (!isFormValid.value) return;
+
+  busy.value = true;
+  formError.value = {};
+
+  const [error] = await profileModel.disableTwoFA(password.value);
+  if (error) {
+    if (error.status === 412) formError.value.password = error.body.message;
+    else {
+      formError.value.generic = error.status ? error.body.message : 'Internal error';
+      console.error('Failed to disable 2fa', error);
+    }
+
+    busy.value = false;
+
+    return;
+  }
+
+  emit('success');
+  dialog.value.close();
+
+  busy.value = false;
+  formError.value = {};
+}
+
+defineExpose({
+  async open() {
+    password.value = '';
+    busy.value = false;
+    formError.value = {};
+    dialog.value.open();
+  }
+});
+
+</script>
+
+<template>
+  <Dialog ref="dialog"
+    :title="$t('profile.disable2FA.title')"
+    :confirm-label="$t('profile.disable2FA.disable')"
+    :confirm-active="!busy && isFormValid"
+    :confirm-busy="busy"
+     confirm-style="primary"
+    :reject-label="$t('main.dialog.cancel')"
+    :reject-active="!busy"
+     reject-style="secondary"
+     @confirm="onSubmit"
+  >
+    <form @submit.prevent="onSubmit">
+      <fieldset :disabled="busy">
+        <input type="submit" style="display: none;" :disabled="!isFormValid"/>
+
+        <div class="error-label" v-if="formError.generic">{{ formError.generic }}</div>
+
+        <FormGroup :has-error="formError.password">
+          <label>{{ $t('profile.disable2FA.password') }}</label>
+          <PasswordInput v-model="password" />
+          <div class="error-label" v-if="formError.password">{{ formError.password }}</div>
+        </FormGroup>
+      </fieldset>
+    </form>
+  </Dialog>
+</template>
diff --git a/dashboard/src/models/ProfileModel.js b/dashboard/src/models/ProfileModel.js
index 2af26baa0..08ce9ddd3 100644
--- a/dashboard/src/models/ProfileModel.js
+++ b/dashboard/src/models/ProfileModel.js
@@ -194,14 +194,14 @@ function create() {
       return [null];
     },
     async disableTwoFA(password) {
-      let error, result;
+      let result;
       try {
         result = await fetcher.post(`${API_ORIGIN}/api/v1/profile/twofactorauthentication_disable`, { password }, { access_token: accessToken });
       } catch (e) {
-        error = e;
+        return [e];
       }
 
-      if (error || result.status !== 204) return [error || result];
+      if (result.status !== 204) return [result];
       return [null];
     },
     async setNotificationConfig(notificationConfig) {
diff --git a/dashboard/src/views/ProfileView.vue b/dashboard/src/views/ProfileView.vue
index 73470e5e2..4142c1350 100644
--- a/dashboard/src/views/ProfileView.vue
+++ b/dashboard/src/views/ProfileView.vue
@@ -13,6 +13,7 @@ import SettingsItem from '../components/SettingsItem.vue';
 import PrimaryEmailDialog from '../components/dialogs/PrimaryEmailDialog.vue';
 import FallbackEmailDialog from '../components/dialogs/FallbackEmailDialog.vue';
 import PasswordChangeDialog from '../components/dialogs/PasswordChangeDialog.vue';
+import DisableTwoFADialog from '../components/dialogs/DisableTwoFADialog.vue';
 import Section from '../components/Section.vue';
 import ApiTokens from '../components/ApiTokens.vue';
 import ImagePicker from '../components/ImagePicker.vue';
@@ -33,6 +34,7 @@ const inputDialog = useTemplateRef('inputDialog');
 const primaryEmailDialog = useTemplateRef('primaryEmailDialog');
 const fallbackEmailDialog = useTemplateRef('fallbackEmailDialog');
 const passwordChangeDialog = useTemplateRef('passwordChangeDialog');
+const disableTwoFADialog = useTemplateRef('disableTwoFADialog');
 
 // Language selector
 const languages = ref([]);
@@ -144,22 +146,7 @@ async function onTwoFAEnable() {
 }
 
 async function onTwoFADisable() {
-  const password = await inputDialog.value.prompt({
-    message: t('profile.disable2FA.title'),
-    modal: true,
-    placeholder: t('appstore.accountDialog.password'),
-    type: 'password',
-    confirmLabel: t('main.dialog.yes'),
-    rejectLabel: t('main.dialog.no'),
-    rejectStyle: 'secondary',
-  });
-
-  if (!password) return;
-
-  const [error] = await profileModel.disableTwoFA(password);
-  if (error) return onTwoFADisable();
-
-  await refreshProfile();
+  disableTwoFADialog.value.open();
 }
 
 
@@ -203,6 +190,7 @@ onMounted(async () => {
     <PrimaryEmailDialog ref="primaryEmailDialog" @success="refreshProfile"/>
     <FallbackEmailDialog ref="fallbackEmailDialog" @success="refreshProfile"/>
     <PasswordChangeDialog ref="passwordChangeDialog" @success="refreshProfile"/>
+    <DisableTwoFADialog ref="disableTwoFADialog" @success="refreshProfile"/>
 
     <Dialog ref="twoFADialog" :title="$t('profile.enable2FA.title')" :show-x="!twoFAModal" :modal="twoFAModal">
       <div style="text-align: center; max-width: 420px">