diff --git a/public/i18n/en.json b/public/i18n/en.json
index 4f107e0..3762487 100644
--- a/public/i18n/en.json
+++ b/public/i18n/en.json
@@ -115,6 +115,15 @@
           "newPassword": "New password",
           "newPasswordRepeat": "Repeat new password"
         },
+        "changeEmailDialog": {
+          "label": "Change e-mail address",
+          "labelSet": "Set e-mail address",
+          "labelRemove": "Remove e-mail address",
+          "newMail": "New e-mail address",
+          "currentPassword": "Current password",
+          "oldCode": "Code sent to the old e-mail address",
+          "newCode": "Code sent to the new e-mail address"
+        },
         "label": "Keep your account safe by using as much sign in methods as possible. Also check your credentials regularly to keep them up to date.",
         "password": "Password",
         "set": "Set",
diff --git a/src/app/chat/user-settings/security/email/email.html b/src/app/chat/user-settings/security/email/email.html
new file mode 100644
index 0000000..42b23a5
--- /dev/null
+++ b/src/app/chat/user-settings/security/email/email.html
@@ -0,0 +1,97 @@
+<div class="option">
+  <ng-template [(tuiDialog)]="changeEmailDialogOpen"
+               [tuiDialogOptions]="{label: ('chat.userSettingsDialog.security.changeEmailDialog.'+ (changeEmailRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.emailSet ? 'label' : 'labelSet'))|translate}">
+    @if (step() == 0) {
+      <form [formGroup]="changeEmailForm" style="display: flex; flex-direction: column; gap: 10px">
+        @if (!changeEmailRemoveMode()) {
+          <tui-textfield iconStart="@tui.mail">
+            <label
+              tuiLabel>{{ "chat.userSettingsDialog.security.changeEmailDialog.newMail"|translate }}</label>
+            <input formControlName="currentPassword" tuiInput type="email">
+          </tui-textfield>
+        }
+
+        <tui-textfield iconStart="@tui.key">
+          <label tuiLabel>{{ "chat.userSettingsDialog.security.changeEmailDialog.currentPassword"|translate }}</label>
+          <input formControlName="currentPassword" tuiInput type="password">
+        </tui-textfield>
+
+        @if (changeEmailForm.controls['currentPassword'].dirty) {
+          @if (changeEmailForm.controls['currentPassword'].hasError("required")) {
+            <tui-error
+              [error]="'chat.userSettingsDialog.security.changeEmailDialog.errors.currentPasswordRequired'|translate"></tui-error>
+          }
+
+          @if (changeEmailForm.controls['currentPassword'].hasError("incorrect")) {
+            <tui-error
+              [error]="'chat.userSettingsDialog.security.changeEmailDialog.errors.incorrectPassword'|translate"></tui-error>
+          }
+        }
+      </form>
+
+      <footer>
+        <button tuiButton iconStart="@tui.check" [loading]="changeEmailPending()"
+                [disabled]="changeEmailPending()"
+                (click)="changeEmail(changeEmailForm.controls['newAddress'].value, changeEmailForm.controls['currentPassword'].value)">
+          {{ ('chat.userSettingsDialog.security.changeEmailDialog.' + (changeEmailRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.passwordSet ? 'label' : 'labelSet'))|translate }}
+        </button>
+      </footer>
+    } @else {
+      <form style="display: flex; flex-direction: column; gap: 10px" [formGroup]="verifyEmailForm">
+        @if (!changeEmailRemoveMode()) {
+          <tui-textfield iconStart="@tui.mail">
+            <label tuiLabel>{{"chat.userSettingsDialog.security.changeEmailDialog.oldCode"|translate}}</label>
+            <input tuiInput type="number" [step]="1" formControlName="oldCode">
+          </tui-textfield>
+        }
+
+        <tui-textfield iconStart="@tui.badge-plus">
+          <label tuiLabel>{{"chat.userSettingsDialog.security.changeEmailDialog.newCode"|translate}}</label>
+          <input tuiInput type="number" [step]="1" formControlName="newCode">
+        </tui-textfield>
+      </form>
+
+      <footer>
+        <button tuiButton iconStart="@tui.check" [loading]="verifyEmailPending()"
+                [disabled]="verifyEmailForm.invalid || verifyEmailPending()"
+                (click)="verifyEmail(verifyEmailForm.controls['newCode'].value, verifyEmailForm.controls['oldCode'].value)">
+          {{ ('chat.userSettingsDialog.security.changeEmailDialog.' + (changeEmailRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.passwordSet ? 'label' : 'labelSet'))|translate }}
+        </button>
+      </footer>
+    }
+  </ng-template>
+
+  <header>
+    <tui-icon icon="@tui.mail"/>
+    <span>{{ "chat.userSettingsDialog.security.email"|translate }}</span>
+
+    @if (serviceManager.currentSession()!.userData.emailSet) {
+      <div tuiBadge appearance="positive"
+           iconStart="@tui.check">{{ 'chat.userSettingsDialog.security.set'|translate }}
+      </div>
+    } @else {
+      <div tuiBadge appearance="negative"
+           iconStart="@tui.x">{{ 'chat.userSettingsDialog.security.notSet'|translate }}
+      </div>
+    }
+  </header>
+
+  <main>
+    <button tuiButton appearance="outline" (click)="openChangeEmailDialog(false)"
+            [iconStart]="serviceManager.currentSession()!.userData.emailSet ? '@tui.pencil' : '@tui.plus'">
+      @if (serviceManager.currentSession()!.userData.phoneSet) {
+        {{ "chat.userSettingsDialog.security.changeMail"|translate }}
+      } @else {
+        {{ "chat.userSettingsDialog.security.setMail"|translate }}
+      }
+    </button>
+
+    @if (serviceManager.currentSession()!.userData.emailSet) {
+      <button tuiButton appearance="outline" tuiAppearanceMode="invalid" iconStart="@tui.x"
+              (click)="openChangeEmailDialog(true)"
+              style="color: var(--tui-text-negative)">
+        {{ "chat.userSettingsDialog.security.removeMail"|translate }}
+      </button>
+    }
+  </main>
+</div>
diff --git a/src/app/chat/user-settings/security/email/email.scss b/src/app/chat/user-settings/security/email/email.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/chat/user-settings/security/email/email.spec.ts b/src/app/chat/user-settings/security/email/email.spec.ts
new file mode 100644
index 0000000..583023d
--- /dev/null
+++ b/src/app/chat/user-settings/security/email/email.spec.ts
@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { Email } from './email';
+
+describe('Email', () => {
+  let component: Email;
+  let fixture: ComponentFixture<Email>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [Email],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(Email);
+    component = fixture.componentInstance;
+    await fixture.whenStable();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/chat/user-settings/security/email/email.ts b/src/app/chat/user-settings/security/email/email.ts
new file mode 100644
index 0000000..5a54c5a
--- /dev/null
+++ b/src/app/chat/user-settings/security/email/email.ts
@@ -0,0 +1,105 @@
+import {Component, inject, signal} from '@angular/core';
+import {TranslatePipe} from '@ngx-translate/core';
+import {TuiBadge, TuiButtonLoading, TuiInputNumber} from '@taiga-ui/kit';
+import {
+  TuiButton,
+  TuiDialog,
+  TuiErrorComponent,
+  TuiIcon,
+  TuiInputDirective,
+  TuiLabel,
+  TuiTextfieldComponent
+} from '@taiga-ui/core';
+import {ServiceManager} from '../../../../service-manager';
+import {
+  AbstractControl,
+  FormControl,
+  FormGroup,
+  ReactiveFormsModule,
+  ValidationErrors,
+  Validators
+} from '@angular/forms';
+
+@Component({
+  selector: 'user-settings-security-email',
+  imports: [
+    TranslatePipe,
+    TuiBadge,
+    TuiButton,
+    TuiIcon,
+    ReactiveFormsModule,
+    TuiButtonLoading,
+    TuiDialog,
+    TuiErrorComponent,
+    TuiInputDirective,
+    TuiLabel,
+    TuiTextfieldComponent,
+    TuiInputNumber,
+  ],
+  templateUrl: './email.html',
+  styleUrl: './email.scss',
+})
+export class Email {
+  serviceManager = inject(ServiceManager)
+
+  step = signal(0)
+  changeEmailDialogOpen = signal(false)
+  changeEmailRemoveMode = signal(false)
+  changeEmailPending = signal(false)
+  verifyEmailPending = signal(false)
+  newAddress = ""
+
+  changeEmailForm = new FormGroup({
+    newAddress: new FormControl(""),
+    currentPassword: new FormControl(""),
+  })
+
+  verifyEmailForm = new FormGroup({
+    oldCode: new FormControl(0),
+    newCode: new FormControl(0, {validators: [Validators.required]})
+  })
+
+  openChangeEmailDialog(modeRemove: boolean) {
+    this.changeEmailDialogOpen.set(true)
+    this.changeEmailRemoveMode.set(modeRemove)
+    this.changeEmailForm.controls["currentPassword"].clearValidators()
+    this.changeEmailForm.controls["newAddress"].clearValidators()
+    if (!modeRemove) {
+      this.changeEmailForm.controls["newAddress"].setValidators([Validators.required])
+      this.changeEmailForm.controls["newAddress"].updateValueAndValidity()
+    }
+
+    this.changeEmailForm.controls["currentPassword"].setValidators([Validators.required])
+    this.changeEmailForm.controls["currentPassword"].updateValueAndValidity()
+  }
+
+  async changeEmail(currentPassword: string | null, newMail: string | null) {
+    this.changeEmailPending.set(true)
+    const service = this.serviceManager.currentSessionHandler
+    if (service) {
+      try {
+        await service.changeEmail(newMail ?? "", currentPassword ?? "")
+        if (!this.changeEmailRemoveMode()) {
+          this.newAddress = newMail ?? ""
+          this.verifyEmailForm.controls["oldCode"].setValidators([Validators.required])
+          this.step.set(1)
+        }
+      } catch (e) {
+        this.changeEmailForm.controls["currentPassword"].setErrors({incorrect: true})
+      }
+    }
+  }
+
+  async verifyEmail(newCode: number | null, oldCode: number | null) {
+    this.verifyEmailPending.set(true)
+    const service = this.serviceManager.currentSessionHandler
+    if (service) {
+      try {
+        await service.verifyEmailChange(oldCode ?? 0, newCode ?? 0, this.newAddress)
+        this.changeEmailDialogOpen.set(false)
+      } catch (e) {
+        this.verifyEmailForm.controls["newCode"].setErrors({incorrect: true})
+      }
+    }
+  }
+}
diff --git a/src/app/chat/user-settings/security/password/password.html b/src/app/chat/user-settings/security/password/password.html
index dfdbc4c..98ce371 100644
--- a/src/app/chat/user-settings/security/password/password.html
+++ b/src/app/chat/user-settings/security/password/password.html
@@ -1,7 +1,7 @@
 <div class="option">
   <ng-template [(tuiDialog)]="changePasswordDialogOpen"
                [tuiDialogOptions]="{label: ('chat.userSettingsDialog.security.changePasswordDialog.'+ (changePasswordRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.passwordSet ? 'label' : 'labelSet'))|translate}">
-    <form [formGroup]="changePasswordForm" style="display: flex; flex-direction: column; gap: 10px">
+    <form [formGroup]="changeEmailForm" style="display: flex; flex-direction: column; gap: 10px">
       @if (serviceManager.currentSession()!.userData.passwordSet) {
         <tui-textfield iconStart="@tui.key">
           <label
@@ -9,13 +9,13 @@
           <input formControlName="currentPassword" tuiInput type="password">
         </tui-textfield>
 
-        @if (changePasswordForm.controls['currentPassword'].dirty) {
-          @if (changePasswordForm.controls['currentPassword'].hasError("required")) {
+        @if (changeEmailForm.controls['currentPassword'].dirty) {
+          @if (changeEmailForm.controls['currentPassword'].hasError("required")) {
             <tui-error
               [error]="'chat.userSettingsDialog.security.changePasswordDialog.errors.currentPasswordRequired'|translate"></tui-error>
           }
 
-          @if (changePasswordForm.controls['currentPassword'].hasError("incorrect")) {
+          @if (changeEmailForm.controls['currentPassword'].hasError("incorrect")) {
             <tui-error
               [error]="'chat.userSettingsDialog.security.changePasswordDialog.errors.incorrectPassword'|translate"></tui-error>
           }
@@ -38,8 +38,8 @@
 
     <footer>
       <button tuiButton iconStart="@tui.check" [loading]="changePasswordPending()"
-              [disabled]="changePasswordForm.invalid || changePasswordPending()"
-              (click)="changePassword(changePasswordForm.controls['currentPassword'].value, changePasswordForm.controls['newPassword'].value)">
+              [disabled]="changeEmailForm.invalid || changePasswordPending()"
+              (click)="changePassword(changeEmailForm.controls['currentPassword'].value, changeEmailForm.controls['newPassword'].value)">
         {{ ('chat.userSettingsDialog.security.changePasswordDialog.' + (changePasswordRemoveMode() ? 'labelRemove' : serviceManager.currentSession()!.userData.passwordSet ? 'label' : 'labelSet'))|translate }}
       </button>
     </footer>
diff --git a/src/app/chat/user-settings/security/password/password.ts b/src/app/chat/user-settings/security/password/password.ts
index 1982ccc..0c670bd 100644
--- a/src/app/chat/user-settings/security/password/password.ts
+++ b/src/app/chat/user-settings/security/password/password.ts
@@ -47,7 +47,7 @@ export class Password {
   changePasswordRemoveMode = signal(false)
   changePasswordPending = signal(false)
 
-  changePasswordForm = new FormGroup({
+  changeEmailForm = new FormGroup({
     currentPassword: new FormControl(""),
     newPassword: new FormControl(""),
     newPasswordRepeat: new FormControl("")
@@ -58,18 +58,18 @@ export class Password {
   openChangePasswordDialog(modeRemove: boolean) {
     this.changePasswordDialogOpen.set(true)
     this.changePasswordRemoveMode.set(modeRemove)
-    this.changePasswordForm.controls["currentPassword"].clearValidators()
-    this.changePasswordForm.controls["newPassword"].clearValidators()
-    this.changePasswordForm.controls["newPasswordRepeat"].clearValidators()
+    this.changeEmailForm.controls["currentPassword"].clearValidators()
+    this.changeEmailForm.controls["newPassword"].clearValidators()
+    this.changeEmailForm.controls["newPasswordRepeat"].clearValidators()
     if (!modeRemove) {
-      this.changePasswordForm.controls["newPassword"].setValidators([Validators.required])
-      this.changePasswordForm.controls["newPasswordRepeat"].setValidators([Validators.required])
-      this.changePasswordForm.controls["newPassword"].updateValueAndValidity()
-      this.changePasswordForm.controls["newPasswordRepeat"].updateValueAndValidity()
+      this.changeEmailForm.controls["newPassword"].setValidators([Validators.required])
+      this.changeEmailForm.controls["newPasswordRepeat"].setValidators([Validators.required])
+      this.changeEmailForm.controls["newPassword"].updateValueAndValidity()
+      this.changeEmailForm.controls["newPasswordRepeat"].updateValueAndValidity()
     }
 
-    this.changePasswordForm.controls["currentPassword"].setValidators([Validators.required])
-    this.changePasswordForm.controls["currentPassword"].updateValueAndValidity()
+    this.changeEmailForm.controls["currentPassword"].setValidators([Validators.required])
+    this.changeEmailForm.controls["currentPassword"].updateValueAndValidity()
   }
 
   async changePassword(currentPassword: string | null, newPassword: string | null) {
@@ -79,7 +79,7 @@ export class Password {
       try {
         await service.changePassword(newPassword ?? "", currentPassword ?? "")
       } catch (e) {
-        this.changePasswordForm.controls["currentPassword"].setErrors({incorrect: true})
+        this.changeEmailForm.controls["currentPassword"].setErrors({incorrect: true})
       }
     }
   }
diff --git a/src/app/chat/user-settings/security/security.html b/src/app/chat/user-settings/security/security.html
index d523a05..043b385 100644
--- a/src/app/chat/user-settings/security/security.html
+++ b/src/app/chat/user-settings/security/security.html
@@ -4,41 +4,7 @@
 </p>
 <div id="options" tuiGroup orientation="vertical">
   <user-settings-security-password/>
-
-  <div class="option">
-    <header>
-      <tui-icon icon="@tui.mail"/>
-      <span>{{ "chat.userSettingsDialog.security.email"|translate }}</span>
-
-      @if (serviceManager.currentSession()!.userData.phoneSet) {
-        <div tuiBadge appearance="positive"
-             iconStart="@tui.check">{{ 'chat.userSettingsDialog.security.set'|translate }}
-        </div>
-      } @else {
-        <div tuiBadge appearance="negative"
-             iconStart="@tui.x">{{ 'chat.userSettingsDialog.security.notSet'|translate }}
-        </div>
-      }
-    </header>
-
-    <main>
-      <button tuiButton appearance="outline"
-              [iconStart]="serviceManager.currentSession()!.userData.emailSet ? '@tui.pencil' : '@tui.plus'">
-        @if (serviceManager.currentSession()!.userData.phoneSet) {
-          {{ "chat.userSettingsDialog.security.changeMail"|translate }}
-        } @else {
-          {{ "chat.userSettingsDialog.security.setMail"|translate }}
-        }
-      </button>
-
-      @if (serviceManager.currentSession()!.userData.emailSet) {
-        <button tuiButton appearance="outline" tuiAppearanceMode="invalid" iconStart="@tui.x"
-                style="color: var(--tui-text-negative)">
-          {{ "chat.userSettingsDialog.security.removeMail"|translate }}
-        </button>
-      }
-    </main>
-  </div>
+  <user-settings-security-email/>
   <div class="option">
     <header>
       <tui-icon icon="@tui.phone"/>
diff --git a/src/app/chat/user-settings/security/security.ts b/src/app/chat/user-settings/security/security.ts
index 5e56376..65619f0 100644
--- a/src/app/chat/user-settings/security/security.ts
+++ b/src/app/chat/user-settings/security/security.ts
@@ -13,6 +13,7 @@ import {
   Validators
 } from '@angular/forms';
 import {Password} from './password/password';
+import {Email} from './email/email';
 
 @Component({
   selector: 'user-settings-security',
@@ -29,7 +30,8 @@ import {Password} from './password/password';
     TuiInputDirective,
     TuiButtonLoading,
     TuiErrorComponent,
-    Password
+    Password,
+    Email
   ],
   templateUrl: './security.html',
   styleUrl: './security.scss',