diff --git a/apps/browser/src/_locales/en/messages.json b/apps/browser/src/_locales/en/messages.json
index 7a320e409e..c166273e35 100644
--- a/apps/browser/src/_locales/en/messages.json
+++ b/apps/browser/src/_locales/en/messages.json
@@ -2028,5 +2028,20 @@
         "example": "Jun 15, 2015"
       }
     }
+  },
+  "loginWithMasterPassword": {
+    "message": "Log in with master password"
+  },
+  "loggingInAs": {
+    "message": "Logging in as"
+  },
+  "notYou": {
+    "message": "Not you?"
+  },
+  "newAroundHere": {
+    "message": "New around here?"
+  },
+  "rememberEmail": {
+    "message": "Remember email"
   }
 }
diff --git a/apps/browser/src/popup/accounts/hint.component.html b/apps/browser/src/popup/accounts/hint.component.html
index 828af9c558..4f5f975ccf 100644
--- a/apps/browser/src/popup/accounts/hint.component.html
+++ b/apps/browser/src/popup/accounts/hint.component.html
@@ -1,7 +1,9 @@
 <form #form (ngSubmit)="submit()" [appApiAction]="formPromise">
   <header>
     <div class="left">
-      <button type="button" routerLink="/login">{{ "cancel" | i18n }}</button>
+      <button type="button" routerLink="/login">
+        {{ "cancel" | i18n }}
+      </button>
     </div>
     <h1 class="center">
       <span class="title">{{ "passwordHint" | i18n }}</span>
diff --git a/apps/browser/src/popup/accounts/hint.component.ts b/apps/browser/src/popup/accounts/hint.component.ts
index 7ecc9ef1cb..4948407e5a 100644
--- a/apps/browser/src/popup/accounts/hint.component.ts
+++ b/apps/browser/src/popup/accounts/hint.component.ts
@@ -1,10 +1,11 @@
 import { Component } from "@angular/core";
-import { Router } from "@angular/router";
+import { ActivatedRoute, Router } from "@angular/router";
 
 import { HintComponent as BaseHintComponent } from "@bitwarden/angular/components/hint.component";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 
 @Component({
@@ -17,8 +18,14 @@ export class HintComponent extends BaseHintComponent {
     platformUtilsService: PlatformUtilsService,
     i18nService: I18nService,
     apiService: ApiService,
-    logService: LogService
+    logService: LogService,
+    private route: ActivatedRoute,
+    loginService: LoginService
   ) {
-    super(router, i18nService, apiService, platformUtilsService, logService);
+    super(router, i18nService, apiService, platformUtilsService, logService, loginService);
+
+    super.onSuccessfulSubmit = async () => {
+      this.router.navigate([this.successRoute]);
+    };
   }
 }
diff --git a/apps/browser/src/popup/accounts/home.component.html b/apps/browser/src/popup/accounts/home.component.html
index 5f80204a27..46eeb92e5b 100644
--- a/apps/browser/src/popup/accounts/home.component.html
+++ b/apps/browser/src/popup/accounts/home.component.html
@@ -2,15 +2,28 @@
   <div class="content">
     <div class="logo-image"></div>
     <p class="lead text-center">{{ "loginOrCreateNewAccount" | i18n }}</p>
-    <button type="button" class="btn primary block" routerLink="/login">
-      <b>{{ "login" | i18n }}</b>
-    </button>
-    <button type="button" (click)="launchSsoBrowser()" class="btn block">
-      <i class="bwi bwi-bank" aria-hidden="true"></i> {{ "enterpriseSingleSignOn" | i18n }}
-    </button>
-    <button type="button" class="btn block" routerLink="/register">
-      {{ "createAccount" | i18n }}
-    </button>
+    <form #form [formGroup]="formGroup" (ngSubmit)="submit()">
+      <div class="box">
+        <div class="box-content">
+          <div class="box-content-row" appBoxRow>
+            <label for="email">{{ "emailAddress" | i18n }}</label>
+            <input id="email" type="email" formControlName="email" appInputVerbatim="false" />
+          </div>
+        </div>
+        <div class="box-footer no-margin" *ngIf="selfHostedDomain">
+          {{ "loggingInTo" | i18n: selfHostedDomain }}
+        </div>
+      </div>
+      <div class="box">
+        <button type="submit" class="btn primary block">
+          <b>{{ "continue" | i18n }}</b>
+        </button>
+      </div>
+    </form>
+    <p class="createAccountLink">
+      {{ "newAroundHere" | i18n }}
+      <a routerLink="/register">{{ "createAccount" | i18n }}</a>
+    </p>
   </div>
 </div>
 <button type="button" routerLink="/environment" class="settings-icon">
diff --git a/apps/browser/src/popup/accounts/home.component.ts b/apps/browser/src/popup/accounts/home.component.ts
index 8414395901..28d42dc482 100644
--- a/apps/browser/src/popup/accounts/home.component.ts
+++ b/apps/browser/src/popup/accounts/home.component.ts
@@ -1,63 +1,56 @@
-import { Component } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
+import { FormBuilder, Validators } from "@angular/forms";
+import { ActivatedRoute, Router } from "@angular/router";
 
-import { CryptoFunctionService } from "@bitwarden/common/abstractions/cryptoFunction.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
-import { PasswordGenerationService } from "@bitwarden/common/abstractions/passwordGeneration.service";
+import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
-import { Utils } from "@bitwarden/common/misc/utils";
 
 @Component({
   selector: "app-home",
   templateUrl: "home.component.html",
 })
-export class HomeComponent {
+export class HomeComponent implements OnInit {
+  loginInitiated = false;
+
+  formGroup = this.formBuilder.group({
+    email: ["", [Validators.required, Validators.email]],
+  });
+
   constructor(
     protected platformUtilsService: PlatformUtilsService,
-    private passwordGenerationService: PasswordGenerationService,
     private stateService: StateService,
-    private cryptoFunctionService: CryptoFunctionService,
-    private environmentService: EnvironmentService
+    private formBuilder: FormBuilder,
+    private router: Router,
+    private i18nService: I18nService,
+    private environmentService: EnvironmentService,
+    private route: ActivatedRoute
   ) {}
+  async ngOnInit(): Promise<void> {
+    const rememberedEmail = await this.stateService.getRememberedEmail();
+    if (rememberedEmail != null) {
+      this.formGroup.patchValue({ email: await this.stateService.getRememberedEmail() });
+    }
+  }
 
-  async launchSsoBrowser() {
-    // Generate necessary sso params
-    const passwordOptions: any = {
-      type: "password",
-      length: 64,
-      uppercase: true,
-      lowercase: true,
-      numbers: true,
-      special: false,
-    };
-
-    const state =
-      (await this.passwordGenerationService.generatePassword(passwordOptions)) +
-      ":clientId=browser";
-    const codeVerifier = await this.passwordGenerationService.generatePassword(passwordOptions);
-    const codeVerifierHash = await this.cryptoFunctionService.hash(codeVerifier, "sha256");
-    const codeChallenge = Utils.fromBufferToUrlB64(codeVerifierHash);
-
-    await this.stateService.setSsoCodeVerifier(codeVerifier);
-    await this.stateService.setSsoState(state);
-
-    let url = this.environmentService.getWebVaultUrl();
-    if (url == null) {
-      url = "https://vault.bitwarden.com";
+  submit() {
+    this.formGroup.markAllAsTouched();
+    if (this.formGroup.invalid) {
+      this.platformUtilsService.showToast(
+        "error",
+        this.i18nService.t("errorOccured"),
+        this.i18nService.t("invalidEmail")
+      );
+      return;
     }
 
-    const redirectUri = url + "/sso-connector.html";
+    this.stateService.setRememberedEmail(this.formGroup.value.email);
 
-    // Launch browser
-    this.platformUtilsService.launchUri(
-      url +
-        "/#/sso?clientId=browser" +
-        "&redirectUri=" +
-        encodeURIComponent(redirectUri) +
-        "&state=" +
-        state +
-        "&codeChallenge=" +
-        codeChallenge
-    );
+    this.router.navigate(["login"], { queryParams: { email: this.formGroup.value.email } });
+  }
+
+  get selfHostedDomain() {
+    return this.environmentService.hasBaseUrl() ? this.environmentService.getWebVaultUrl() : null;
   }
 }
diff --git a/apps/browser/src/popup/accounts/login.component.html b/apps/browser/src/popup/accounts/login.component.html
index 1b32f63819..f2b7f522ec 100644
--- a/apps/browser/src/popup/accounts/login.component.html
+++ b/apps/browser/src/popup/accounts/login.component.html
@@ -1,25 +1,12 @@
 <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" [formGroup]="formGroup">
   <header>
-    <div class="left">
-      <button type="button" routerLink="/home">{{ "cancel" | i18n }}</button>
-    </div>
-    <h1 class="center">
-      <span class="title">{{ "appName" | i18n }}</span>
+    <h1 class="login-center">
+      <span class="title">{{ "logIn" | i18n }}</span>
     </h1>
-    <div class="right">
-      <button type="submit" [disabled]="form.loading">
-        <span [hidden]="form.loading">{{ "login" | i18n }}</span>
-        <i class="bwi bwi-spinner bwi-lg bwi-spin" [hidden]="!form.loading" aria-hidden="true"></i>
-      </button>
-    </div>
   </header>
   <main tabindex="-1">
     <div class="box">
       <div class="box-content">
-        <div class="box-content-row" appBoxRow>
-          <label for="email">{{ "emailAddress" | i18n }}</label>
-          <input id="email" type="email" formControlName="email" appInputVerbatim="false" />
-        </div>
         <div class="box-content-row box-content-row-flex" appBoxRow>
           <div class="row-main">
             <label for="masterPassword">{{ "masterPass" | i18n }}</label>
@@ -52,13 +39,27 @@
           <iframe id="hcaptcha_iframe" height="80"></iframe>
         </div>
       </div>
+      <div class="box-footer">
+        <button type="button" class="btn link" routerLink="/hint" (click)="setFormValues()">
+          <b>{{ "getMasterPasswordHint" | i18n }}</b>
+        </button>
+      </div>
     </div>
-    <p class="text-center text-muted" *ngIf="selfHostedDomain">
-      {{ "loggingInTo" | i18n: selfHostedDomain }}
-    </p>
-    <p class="text-center">
-      <button type="button" routerLink="/hint">{{ "getMasterPasswordHint" | i18n }}</button>
-    </p>
     <app-private-mode-warning></app-private-mode-warning>
+    <div class="content login-buttons">
+      <button type="submit" class="btn primary block" [disabled]="form.loading">
+        <span [hidden]="form.loading"
+          ><b>{{ "logInWithMasterPassword" | i18n }}</b></span
+        >
+        <i class="bwi bwi-spinner bwi-lg bwi-spin" [hidden]="!form.loading" aria-hidden="true"></i>
+      </button>
+      <button type="button" (click)="launchSsoBrowser()" class="btn block">
+        <i class="bwi bwi-bank" aria-hidden="true"></i> {{ "enterpriseSingleSignOn" | i18n }}
+      </button>
+      <div class="small">
+        <p class="no-margin">{{ "loggingInAs" | i18n }} {{ loggedEmail }}</p>
+        <a routerLink="/home">{{ "notYou" | i18n }}</a>
+      </div>
+    </div>
   </main>
 </form>
diff --git a/apps/browser/src/popup/accounts/login.component.ts b/apps/browser/src/popup/accounts/login.component.ts
index 5028af06bf..d44847b35e 100644
--- a/apps/browser/src/popup/accounts/login.component.ts
+++ b/apps/browser/src/popup/accounts/login.component.ts
@@ -1,27 +1,33 @@
 import { Component, NgZone } from "@angular/core";
 import { FormBuilder } from "@angular/forms";
-import { Router } from "@angular/router";
+import { ActivatedRoute, Router } from "@angular/router";
 
 import { LoginComponent as BaseLoginComponent } from "@bitwarden/angular/components/login.component";
+import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { AppIdService } from "@bitwarden/common/abstractions/appId.service";
 import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { CryptoFunctionService } from "@bitwarden/common/abstractions/cryptoFunction.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
 import { FormValidationErrorsService } from "@bitwarden/common/abstractions/formValidationErrors.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PasswordGenerationService } from "@bitwarden/common/abstractions/passwordGeneration.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { SyncService } from "@bitwarden/common/abstractions/sync/sync.service.abstraction";
+import { Utils } from "@bitwarden/common/misc/utils";
 
 @Component({
   selector: "app-login",
   templateUrl: "login.component.html",
 })
 export class LoginComponent extends BaseLoginComponent {
-  protected alwaysRememberEmail = true;
+  protected skipRememberEmail = true;
 
   constructor(
+    apiService: ApiService,
+    appIdService: AppIdService,
     authService: AuthService,
     router: Router,
     protected platformUtilsService: PlatformUtilsService,
@@ -34,9 +40,13 @@ export class LoginComponent extends BaseLoginComponent {
     logService: LogService,
     ngZone: NgZone,
     formBuilder: FormBuilder,
-    formValidationErrorService: FormValidationErrorsService
+    formValidationErrorService: FormValidationErrorsService,
+    route: ActivatedRoute,
+    loginService: LoginService
   ) {
     super(
+      apiService,
+      appIdService,
       authService,
       router,
       platformUtilsService,
@@ -48,7 +58,9 @@ export class LoginComponent extends BaseLoginComponent {
       logService,
       ngZone,
       formBuilder,
-      formValidationErrorService
+      formValidationErrorService,
+      route,
+      loginService
     );
     super.onSuccessfulLogin = async () => {
       await syncService.fullSync(true);
@@ -59,4 +71,45 @@ export class LoginComponent extends BaseLoginComponent {
   settings() {
     this.router.navigate(["environment"]);
   }
+
+  async launchSsoBrowser() {
+    // Generate necessary sso params
+    const passwordOptions: any = {
+      type: "password",
+      length: 64,
+      uppercase: true,
+      lowercase: true,
+      numbers: true,
+      special: false,
+    };
+
+    const state =
+      (await this.passwordGenerationService.generatePassword(passwordOptions)) +
+      ":clientId=browser";
+    const codeVerifier = await this.passwordGenerationService.generatePassword(passwordOptions);
+    const codeVerifierHash = await this.cryptoFunctionService.hash(codeVerifier, "sha256");
+    const codeChallenge = Utils.fromBufferToUrlB64(codeVerifierHash);
+
+    await this.stateService.setSsoCodeVerifier(codeVerifier);
+    await this.stateService.setSsoState(state);
+
+    let url = this.environmentService.getWebVaultUrl();
+    if (url == null) {
+      url = "https://vault.bitwarden.com";
+    }
+
+    const redirectUri = url + "/sso-connector.html";
+
+    // Launch browser
+    this.platformUtilsService.launchUri(
+      url +
+        "/#/sso?clientId=browser" +
+        "&redirectUri=" +
+        encodeURIComponent(redirectUri) +
+        "&state=" +
+        state +
+        "&codeChallenge=" +
+        codeChallenge
+    );
+  }
 }
diff --git a/apps/browser/src/popup/accounts/two-factor.component.ts b/apps/browser/src/popup/accounts/two-factor.component.ts
index 55294ef2e1..5bfb637e4c 100644
--- a/apps/browser/src/popup/accounts/two-factor.component.ts
+++ b/apps/browser/src/popup/accounts/two-factor.component.ts
@@ -10,6 +10,7 @@ import { BroadcasterService } from "@bitwarden/common/abstractions/broadcaster.s
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
@@ -44,7 +45,8 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
     private messagingService: MessagingService,
     logService: LogService,
     twoFactorService: TwoFactorService,
-    appIdService: AppIdService
+    appIdService: AppIdService,
+    loginService: LoginService
   ) {
     super(
       authService,
@@ -58,9 +60,11 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
       route,
       logService,
       twoFactorService,
-      appIdService
+      appIdService,
+      loginService
     );
     super.onSuccessfulLogin = () => {
+      this.loginService.clearValues();
       return syncService.fullSync(true);
     };
     super.successRoute = "/tabs/vault";
diff --git a/apps/browser/src/popup/components/private-mode-warning.component.html b/apps/browser/src/popup/components/private-mode-warning.component.html
index 848b69c92d..5acbb1acd0 100644
--- a/apps/browser/src/popup/components/private-mode-warning.component.html
+++ b/apps/browser/src/popup/components/private-mode-warning.component.html
@@ -1,4 +1,4 @@
-<app-callout type="warning" *ngIf="showWarning">
+<app-callout class="app-private-mode-warning" type="warning" *ngIf="showWarning">
   {{ "privateModeWarning" | i18n }}
   <a href="https://bitwarden.com/help/article/private-mode/" target="_blank" rel="noopener">{{
     "learnMore" | i18n
diff --git a/apps/browser/src/popup/scss/base.scss b/apps/browser/src/popup/scss/base.scss
index 1222f66aaa..6cfa632451 100644
--- a/apps/browser/src/popup/scss/base.scss
+++ b/apps/browser/src/popup/scss/base.scss
@@ -174,6 +174,11 @@ header {
 
   .right {
     justify-content: flex-end;
+    align-items: center;
+    app-avatar {
+      max-height: 30px;
+      margin-right: 5px;
+    }
   }
 
   .center {
@@ -183,6 +188,10 @@ header {
     min-width: 0;
   }
 
+  .login-center {
+    margin: auto;
+  }
+
   app-pop-out > button,
   div > button,
   div > a {
diff --git a/apps/browser/src/popup/scss/box.scss b/apps/browser/src/popup/scss/box.scss
index 7be206cbf3..844a397a14 100644
--- a/apps/browser/src/popup/scss/box.scss
+++ b/apps/browser/src/popup/scss/box.scss
@@ -83,6 +83,11 @@
     margin: 5px 10px;
     font-size: $font-size-small;
 
+    button.btn {
+      font-size: $font-size-small;
+      padding: 0;
+    }
+
     @include themify($themes) {
       color: themed("mutedColor");
     }
diff --git a/apps/browser/src/popup/scss/misc.scss b/apps/browser/src/popup/scss/misc.scss
index a4d5dcba96..d891731c75 100644
--- a/apps/browser/src/popup/scss/misc.scss
+++ b/apps/browser/src/popup/scss/misc.scss
@@ -440,3 +440,7 @@ app-vault-view .box-footer {
 html.force_redraw {
   animation: redraw 1s linear infinite;
 }
+
+.rounded-circle {
+  border-radius: 50% !important;
+}
diff --git a/apps/browser/src/popup/scss/pages.scss b/apps/browser/src/popup/scss/pages.scss
index 9ff96f048b..ddba48f27a 100644
--- a/apps/browser/src/popup/scss/pages.scss
+++ b/apps/browser/src/popup/scss/pages.scss
@@ -88,7 +88,7 @@ app-home {
   }
 }
 
-app-private-mode-warning {
+.app-private-mode-warning {
   display: block;
   padding-top: 1rem;
 }
@@ -115,3 +115,11 @@ body.body-full {
     }
   }
 }
+
+.createAccountLink {
+  padding-top: 30px;
+}
+
+.login-buttons > button {
+  margin: 15px 0 15px 0;
+}
diff --git a/apps/browser/src/popup/services/services.module.ts b/apps/browser/src/popup/services/services.module.ts
index da96f7f903..236ff4e5b1 100644
--- a/apps/browser/src/popup/services/services.module.ts
+++ b/apps/browser/src/popup/services/services.module.ts
@@ -24,6 +24,7 @@ import { FolderService } from "@bitwarden/common/abstractions/folder/folder.serv
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { KeyConnectorService } from "@bitwarden/common/abstractions/keyConnector.service";
 import { LogService as LogServiceAbstraction } from "@bitwarden/common/abstractions/log.service";
+import { LoginService as LoginServiceAbstraction } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
 import { NotificationsService } from "@bitwarden/common/abstractions/notifications.service";
 import { OrganizationService } from "@bitwarden/common/abstractions/organization/organization.service.abstraction";
@@ -48,6 +49,7 @@ import { VaultTimeoutService } from "@bitwarden/common/abstractions/vaultTimeout
 import { VaultTimeoutSettingsService } from "@bitwarden/common/abstractions/vaultTimeout/vaultTimeoutSettings.service";
 import { AuthService } from "@bitwarden/common/services/auth.service";
 import { ConsoleLogService } from "@bitwarden/common/services/consoleLog.service";
+import { LoginService } from "@bitwarden/common/services/login.service";
 import { SearchService } from "@bitwarden/common/services/search.service";
 
 import MainBackground from "../../background/main.background";
@@ -309,6 +311,10 @@ function getBgService<T>(service: keyof MainBackground) {
       provide: FileDownloadService,
       useClass: BrowserFileDownloadService,
     },
+    {
+      provide: LoginServiceAbstraction,
+      useClass: LoginService,
+    },
     {
       provide: AbstractThemingService,
       useFactory: () => {
diff --git a/apps/desktop/src/app/accounts/hint.component.ts b/apps/desktop/src/app/accounts/hint.component.ts
index 7ecc9ef1cb..8987efd617 100644
--- a/apps/desktop/src/app/accounts/hint.component.ts
+++ b/apps/desktop/src/app/accounts/hint.component.ts
@@ -5,6 +5,7 @@ import { HintComponent as BaseHintComponent } from "@bitwarden/angular/component
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 
 @Component({
@@ -17,8 +18,9 @@ export class HintComponent extends BaseHintComponent {
     platformUtilsService: PlatformUtilsService,
     i18nService: I18nService,
     apiService: ApiService,
-    logService: LogService
+    logService: LogService,
+    loginService: LoginService
   ) {
-    super(router, i18nService, apiService, platformUtilsService, logService);
+    super(router, i18nService, apiService, platformUtilsService, logService, loginService);
   }
 }
diff --git a/apps/desktop/src/app/accounts/login.component.html b/apps/desktop/src/app/accounts/login.component.html
index c11ed881b0..b81ef6ee5a 100644
--- a/apps/desktop/src/app/accounts/login.component.html
+++ b/apps/desktop/src/app/accounts/login.component.html
@@ -22,78 +22,135 @@
     <div id="content" class="content">
       <img class="logo-image" alt="Bitwarden" />
       <p class="lead">{{ "loginOrCreateNewAccount" | i18n }}</p>
-      <div class="box last">
-        <div class="box-content">
-          <div class="box-content-row" appBoxRow>
-            <label for="email">{{ "emailAddress" | i18n }}</label>
-            <input id="email" type="email" formControlName="email" appInputVerbatim="false" />
-          </div>
-          <div class="box-content-row box-content-row-flex" appBoxRow>
-            <div class="row-main">
-              <label for="masterPassword">{{ "masterPass" | i18n }}</label>
+      <!-- start email -->
+      <ng-container *ngIf="!validatedEmail; else loginPage">
+        <div class="box last">
+          <div class="box-content">
+            <div class="box-content-row" appBoxRow>
+              <label for="email">{{ "emailAddress" | i18n }}</label>
               <input
-                id="masterPassword"
-                type="{{ showPassword ? 'text' : 'password' }}"
-                class="monospaced"
-                formControlName="masterPassword"
-                appInputVerbatim
+                id="email"
+                type="email"
+                formControlName="email"
+                appInputVerbatim="false"
+                (keyup.enter)="validateEmail()"
               />
             </div>
-            <div class="action-buttons">
+          </div>
+          <div class="box-footer" *ngIf="selfHostedDomain">
+            {{ "loggingInTo" | i18n: selfHostedDomain }}
+          </div>
+        </div>
+        <div class="checkbox remember-email">
+          <label for="rememberEmail">
+            <input
+              id="rememberEmail"
+              type="checkbox"
+              name="rememberEmail"
+              formControlName="rememberEmail"
+            />
+            {{ "rememberEmail" | i18n }}
+          </label>
+        </div>
+        <div class="buttons with-rows">
+          <div class="buttons-row">
+            <button type="button" class="btn primary block" (click)="continue()">
+              {{ "continue" | i18n }}
+            </button>
+          </div>
+        </div>
+        <div class="sub-options">
+          <p class="no-margin">{{ "newAroundHere" | i18n }}</p>
+          <button type="button" class="text text-primary" routerLink="/register">
+            {{ "createAccount" | i18n }}
+          </button>
+        </div>
+      </ng-container>
+
+      <ng-template [formGroup]="formGroup" #loginPage>
+        <div class="box last">
+          <div class="box-content">
+            <div class="box-content-row box-content-row-flex" appBoxRow>
+              <div class="row-main">
+                <label for="masterPassword">{{ "masterPass" | i18n }}</label>
+                <input
+                  id="masterPassword"
+                  type="{{ showPassword ? 'text' : 'password' }}"
+                  class="monospaced"
+                  formControlName="masterPassword"
+                  appInputVerbatim
+                />
+              </div>
+              <div class="action-buttons">
+                <button
+                  type="button"
+                  class="row-btn"
+                  appStopClick
+                  appA11yTitle="{{ 'toggleVisibility' | i18n }}"
+                  [attr.aria-pressed]="showPassword"
+                  (click)="togglePassword()"
+                >
+                  <i
+                    class="bwi bwi-lg"
+                    aria-hidden="true"
+                    [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
+                  ></i>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="box last" [hidden]="!showCaptcha()">
+          <div class="box-content">
+            <iframe id="hcaptcha_iframe" style="margin-top: 20px"></iframe>
+            <div class="box-content-row">
               <button
+                class="btn block"
                 type="button"
-                class="row-btn"
-                appStopClick
-                appA11yTitle="{{ 'toggleVisibility' | i18n }}"
-                [attr.aria-pressed]="showPassword"
-                (click)="togglePassword()"
+                routerLink="/accessibility-cookie"
+                (click)="setFormValues()"
               >
-                <i
-                  class="bwi bwi-lg"
-                  aria-hidden="true"
-                  [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
-                ></i>
+                <i class="bwi bwi-universal-access" aria-hidden="true"></i>
+                {{ "loadAccessibilityCookie" | i18n }}
               </button>
             </div>
           </div>
         </div>
-      </div>
-      <div class="box last" [hidden]="!showCaptcha()">
-        <div class="box-content">
-          <iframe id="hcaptcha_iframe" style="margin-top: 20px"></iframe>
-          <div class="box-content-row">
-            <button class="btn block" type="button" routerLink="/accessibility-cookie">
-              <i class="bwi bwi-universal-access" aria-hidden="true"></i>
-              {{ "loadAccessibilityCookie" | i18n }}
+        <div class="buttons with-rows">
+          <div class="buttons-row">
+            <button type="submit" class="btn primary block" [disabled]="form.loading">
+              <b [hidden]="form.loading"
+                ><i class="bwi bwi-sign-in" aria-hidden="true"></i>
+                {{ "loginWithMasterPassword" | i18n }}</b
+              >
+              <i class="bwi bwi-spinner bwi-spin" [hidden]="!form.loading" aria-hidden="true"></i>
+            </button>
+          </div>
+          <div class="buttons-row">
+            <button
+              type="button"
+              (click)="launchSsoBrowser('desktop', 'bitwarden://sso-callback')"
+              class="btn block"
+            >
+              <i class="bwi bwi-bank" aria-hidden="true"></i> {{ "enterpriseSingleSignOn" | i18n }}
             </button>
           </div>
         </div>
-      </div>
-      <div class="buttons with-rows">
-        <div class="buttons-row">
-          <button type="submit" class="btn primary block" [disabled]="form.loading">
-            <b [hidden]="form.loading"
-              ><i class="bwi bwi-sign-in" aria-hidden="true"></i> {{ "logIn" | i18n }}</b
-            >
-            <i class="bwi bwi-spinner bwi-spin" [hidden]="!form.loading" aria-hidden="true"></i>
-          </button>
-          <button type="button" routerLink="/register" class="btn block">
-            <i class="bwi bwi-pencil-square" aria-hidden="true"></i> {{ "createAccount" | i18n }}
-          </button>
-        </div>
-        <div class="buttons-row">
+        <div class="sub-options">
           <button
             type="button"
-            (click)="launchSsoBrowser('desktop', 'bitwarden://sso-callback')"
-            class="btn block"
+            class="text text-primary password-hint-btn"
+            routerLink="/hint"
+            (click)="setFormValues()"
           >
-            <i class="bwi bwi-bank" aria-hidden="true"></i> {{ "enterpriseSingleSignOn" | i18n }}
+            {{ "getMasterPasswordHint" | i18n }}
           </button>
+          <div>
+            <p class="no-margin">{{ "loggingInAs" | i18n }} {{ loggedEmail }}</p>
+            <a [routerLink]="[]" (click)="toggleValidateEmail(false)">{{ "notYou" | i18n }}</a>
+          </div>
         </div>
-      </div>
-      <div class="sub-options">
-        <button type="button" routerLink="/hint">{{ "getMasterPasswordHint" | i18n }}</button>
-      </div>
+      </ng-template>
     </div>
   </form>
 </div>
diff --git a/apps/desktop/src/app/accounts/login.component.ts b/apps/desktop/src/app/accounts/login.component.ts
index 33eefbd57e..43909423ee 100644
--- a/apps/desktop/src/app/accounts/login.component.ts
+++ b/apps/desktop/src/app/accounts/login.component.ts
@@ -1,9 +1,11 @@
 import { Component, NgZone, OnDestroy, ViewChild, ViewContainerRef } from "@angular/core";
 import { FormBuilder } from "@angular/forms";
-import { Router } from "@angular/router";
+import { ActivatedRoute, Router } from "@angular/router";
 
 import { LoginComponent as BaseLoginComponent } from "@bitwarden/angular/components/login.component";
 import { ModalService } from "@bitwarden/angular/services/modal.service";
+import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { AppIdService } from "@bitwarden/common/abstractions/appId.service";
 import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { BroadcasterService } from "@bitwarden/common/abstractions/broadcaster.service";
 import { CryptoFunctionService } from "@bitwarden/common/abstractions/cryptoFunction.service";
@@ -11,6 +13,7 @@ import { EnvironmentService } from "@bitwarden/common/abstractions/environment.s
 import { FormValidationErrorsService } from "@bitwarden/common/abstractions/formValidationErrors.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
 import { PasswordGenerationService } from "@bitwarden/common/abstractions/passwordGeneration.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
@@ -29,13 +32,23 @@ export class LoginComponent extends BaseLoginComponent implements OnDestroy {
   @ViewChild("environment", { read: ViewContainerRef, static: true })
   environmentModal: ViewContainerRef;
 
-  showingModal = false;
+  webVaultHostname = "";
 
-  protected alwaysRememberEmail = true;
+  showingModal = false;
 
   private deferFocus: boolean = null;
 
+  get loggedEmail() {
+    return this.formGroup.value.email;
+  }
+
+  get selfHostedDomain() {
+    return this.environmentService.hasBaseUrl() ? this.environmentService.getWebVaultUrl() : null;
+  }
+
   constructor(
+    apiService: ApiService,
+    appIdService: AppIdService,
     authService: AuthService,
     router: Router,
     i18nService: I18nService,
@@ -51,9 +64,13 @@ export class LoginComponent extends BaseLoginComponent implements OnDestroy {
     private messagingService: MessagingService,
     logService: LogService,
     formBuilder: FormBuilder,
-    formValidationErrorService: FormValidationErrorsService
+    formValidationErrorService: FormValidationErrorsService,
+    route: ActivatedRoute,
+    loginService: LoginService
   ) {
     super(
+      apiService,
+      appIdService,
       authService,
       router,
       platformUtilsService,
@@ -65,7 +82,9 @@ export class LoginComponent extends BaseLoginComponent implements OnDestroy {
       logService,
       ngZone,
       formBuilder,
-      formValidationErrorService
+      formValidationErrorService,
+      route,
+      loginService
     );
     super.onSuccessfulLogin = () => {
       return syncService.fullSync(true);
@@ -127,7 +146,23 @@ export class LoginComponent extends BaseLoginComponent implements OnDestroy {
     this.showPassword = false;
   }
 
+  async continue() {
+    await super.validateEmail();
+    if (!this.formGroup.controls.email.valid) {
+      this.platformUtilsService.showToast(
+        "error",
+        this.i18nService.t("errorOccured"),
+        this.i18nService.t("invalidEmail")
+      );
+      return;
+    }
+  }
+
   async submit() {
+    if (!this.validatedEmail) {
+      return;
+    }
+
     await super.submit();
     if (this.captchaSiteKey) {
       const content = document.getElementById("content") as HTMLDivElement;
diff --git a/apps/desktop/src/app/accounts/two-factor.component.ts b/apps/desktop/src/app/accounts/two-factor.component.ts
index 51ad6e1329..858ddfc5ae 100644
--- a/apps/desktop/src/app/accounts/two-factor.component.ts
+++ b/apps/desktop/src/app/accounts/two-factor.component.ts
@@ -9,6 +9,7 @@ import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { SyncService } from "@bitwarden/common/abstractions/sync/sync.service.abstraction";
@@ -41,7 +42,8 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
     route: ActivatedRoute,
     logService: LogService,
     twoFactorService: TwoFactorService,
-    appIdService: AppIdService
+    appIdService: AppIdService,
+    loginService: LoginService
   ) {
     super(
       authService,
@@ -55,9 +57,11 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
       route,
       logService,
       twoFactorService,
-      appIdService
+      appIdService,
+      loginService
     );
     super.onSuccessfulLogin = () => {
+      this.loginService.clearValues();
       return syncService.fullSync(true);
     };
   }
diff --git a/apps/desktop/src/app/layout/account-switcher.component.html b/apps/desktop/src/app/layout/account-switcher.component.html
index 9b77638a6c..4080b2e031 100644
--- a/apps/desktop/src/app/layout/account-switcher.component.html
+++ b/apps/desktop/src/app/layout/account-switcher.component.html
@@ -90,7 +90,7 @@
     <ng-container *ngIf="activeAccount?.email != null">
       <div class="border" *ngIf="numberOfAccounts > 0"></div>
       <ng-container *ngIf="numberOfAccounts < 4">
-        <button type="button" class="add" routerLink="/login" (click)="addAccount()">
+        <button type="button" class="add" (click)="addAccount()">
           <i class="bwi bwi-plus" aria-hidden="true"></i> {{ "addAccount" | i18n }}
         </button>
       </ng-container>
diff --git a/apps/desktop/src/app/layout/account-switcher.component.ts b/apps/desktop/src/app/layout/account-switcher.component.ts
index 0f03464acb..0c1ca74bd5 100644
--- a/apps/desktop/src/app/layout/account-switcher.component.ts
+++ b/apps/desktop/src/app/layout/account-switcher.component.ts
@@ -1,6 +1,7 @@
 import { animate, state, style, transition, trigger } from "@angular/animations";
 import { ConnectedPosition } from "@angular/cdk/overlay";
 import { Component, OnDestroy, OnInit } from "@angular/core";
+import { Router } from "@angular/router";
 import { concatMap, Subject, takeUntil } from "rxjs";
 
 import { AuthService } from "@bitwarden/common/abstractions/auth.service";
@@ -91,6 +92,7 @@ export class AccountSwitcherComponent implements OnInit, OnDestroy {
     private stateService: StateService,
     private authService: AuthService,
     private messagingService: MessagingService,
+    private router: Router,
     private tokenService: TokenService
   ) {}
 
@@ -142,6 +144,8 @@ export class AccountSwitcherComponent implements OnInit, OnDestroy {
   async addAccount() {
     this.close();
     await this.stateService.setActiveUser(null);
+    await this.stateService.setRememberedEmail(null);
+    this.router.navigate(["/login"]);
   }
 
   private async createSwitcherAccounts(baseAccounts: {
diff --git a/apps/desktop/src/app/services/services.module.ts b/apps/desktop/src/app/services/services.module.ts
index aa4e921089..6dc9b8b0db 100644
--- a/apps/desktop/src/app/services/services.module.ts
+++ b/apps/desktop/src/app/services/services.module.ts
@@ -23,6 +23,7 @@ import {
   LogService,
   LogService as LogServiceAbstraction,
 } from "@bitwarden/common/abstractions/log.service";
+import { LoginService as LoginServiceAbstraction } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService as MessagingServiceAbstraction } from "@bitwarden/common/abstractions/messaging.service";
 import { PasswordGenerationService as PasswordGenerationServiceAbstraction } from "@bitwarden/common/abstractions/passwordGeneration.service";
 import { PasswordRepromptService as PasswordRepromptServiceAbstraction } from "@bitwarden/common/abstractions/passwordReprompt.service";
@@ -35,6 +36,7 @@ import { SystemService as SystemServiceAbstraction } from "@bitwarden/common/abs
 import { ClientType } from "@bitwarden/common/enums/clientType";
 import { StateFactory } from "@bitwarden/common/factories/stateFactory";
 import { GlobalState } from "@bitwarden/common/models/domain/global-state";
+import { LoginService } from "@bitwarden/common/services/login.service";
 import { MemoryStorageService } from "@bitwarden/common/services/memoryStorage.service";
 import { SystemService } from "@bitwarden/common/services/system.service";
 import { ElectronCryptoService } from "@bitwarden/electron/services/electronCrypto.service";
@@ -175,6 +177,10 @@ const RELOAD_CALLBACK = new InjectionToken<() => any>("RELOAD_CALLBACK");
         EncryptedMessageHandlerService,
       ],
     },
+    {
+      provide: LoginServiceAbstraction,
+      useClass: LoginService,
+    },
   ],
 })
 export class ServicesModule {}
diff --git a/apps/desktop/src/locales/en/messages.json b/apps/desktop/src/locales/en/messages.json
index c896cd3e26..fd168510b3 100644
--- a/apps/desktop/src/locales/en/messages.json
+++ b/apps/desktop/src/locales/en/messages.json
@@ -2021,5 +2021,32 @@
   },
   "vault": {
     "message": "Vault"
+  },
+  "loginWithMasterPassword": {
+    "message": "Log in with master password"
+  },
+  "loggingInAs": {
+    "message": "Logging in as"
+  },
+  "rememberEmail": {
+    "message": "Remember email"
+  },
+  "notYou": {
+    "message": "Not you?"
+  },
+  "newAroundHere": {
+    "message": "New around here?"
+  },
+  "loggingInTo": {
+    "message": "Logging in to $DOMAIN$",
+    "placeholders": {
+      "domain": {
+        "content": "$1",
+        "example": "example.com"
+      }
+    }
+  },
+  "logInWithAnotherDevice": {
+    "message": "Log in with another device"
   }
 }
diff --git a/apps/desktop/src/scss/misc.scss b/apps/desktop/src/scss/misc.scss
index 50ba40ba70..5818b19471 100644
--- a/apps/desktop/src/scss/misc.scss
+++ b/apps/desktop/src/scss/misc.scss
@@ -310,6 +310,11 @@ form,
       margin-top: 4px;
       margin-left: -18px;
     }
+
+    &.remember-email {
+      padding-left: 20px;
+      padding-bottom: 5px;
+    }
   }
 
   .radio {
@@ -482,6 +487,10 @@ app-root > #loading,
   margin-top: 15px;
 }
 
+.password-hint-btn {
+  margin-bottom: 10px;
+}
+
 .set-pin-modal {
   .box {
     margin-bottom: 15px;
diff --git a/apps/desktop/src/scss/pages.scss b/apps/desktop/src/scss/pages.scss
index 87862bbef3..f5ca996c44 100644
--- a/apps/desktop/src/scss/pages.scss
+++ b/apps/desktop/src/scss/pages.scss
@@ -189,6 +189,8 @@
 
 #login-page {
   flex-direction: column;
+  justify-content: unset;
+  padding-top: 20px;
 
   .login-header {
     align-self: flex-start;
diff --git a/apps/web/src/app/accounts/hint.component.ts b/apps/web/src/app/accounts/hint.component.ts
index f6d3153b03..aaf58fe949 100644
--- a/apps/web/src/app/accounts/hint.component.ts
+++ b/apps/web/src/app/accounts/hint.component.ts
@@ -5,6 +5,7 @@ import { HintComponent as BaseHintComponent } from "@bitwarden/angular/component
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 
 @Component({
@@ -17,8 +18,9 @@ export class HintComponent extends BaseHintComponent {
     i18nService: I18nService,
     apiService: ApiService,
     platformUtilsService: PlatformUtilsService,
-    logService: LogService
+    logService: LogService,
+    loginService: LoginService
   ) {
-    super(router, i18nService, apiService, platformUtilsService, logService);
+    super(router, i18nService, apiService, platformUtilsService, logService, loginService);
   }
 }
diff --git a/apps/web/src/app/accounts/login/login.component.html b/apps/web/src/app/accounts/login/login.component.html
index 6152b58595..9854403548 100644
--- a/apps/web/src/app/accounts/login/login.component.html
+++ b/apps/web/src/app/accounts/login/login.component.html
@@ -16,102 +16,122 @@
       <div
         class="tw-mt-3 tw-rounded-md tw-border tw-border-solid tw-border-secondary-300 tw-bg-background tw-p-6"
       >
-        <bit-callout
-          type="warning"
-          title="{{ 'resetPasswordPolicyAutoEnroll' | i18n }}"
-          *ngIf="showResetPasswordAutoEnrollWarning"
-        >
-          {{ "resetPasswordAutoEnrollInviteWarning" | i18n }}
-        </bit-callout>
-
-        <div class="tw-mb-3">
-          <bit-form-field>
-            <bit-label>{{ "emailAddress" | i18n }}</bit-label>
-            <input id="login_input_email" bitInput type="email" formControlName="email" />
-          </bit-form-field>
-        </div>
-
-        <div class="tw-mb-3">
-          <bit-form-field>
-            <bit-label>{{ "masterPass" | i18n }}</bit-label>
-            <input
-              id="login_input_master-password"
-              bitInput
-              type="{{ showPassword ? 'text' : 'password' }}"
-              formControlName="masterPassword"
-            />
-            <button type="button" bitSuffix bitButton (click)="togglePassword()">
-              <i
-                aria-hidden="true"
-                class="bwi bwi-lg bwi-eye"
-                [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
-              ></i>
-            </button>
-            <bit-hint>
-              <a routerLink="/hint">{{ "getMasterPasswordHint" | i18n }}</a>
-            </bit-hint>
-          </bit-form-field>
-        </div>
-
-        <div class="tw-mb-3 tw-flex tw-items-start">
-          <div class="tw-flex tw-h-6 tw-items-center">
-            <input
-              id="login_input_remember-email"
-              class="tw-w-4 tw-rounded tw-border"
-              bitInput
-              type="checkbox"
-              formControlName="rememberEmail"
-            />
+        <ng-container *ngIf="!validatedEmail; else loginPage">
+          <div class="tw-mb-3">
+            <bit-form-field>
+              <bit-label>{{ "emailAddress" | i18n }}</bit-label>
+              <input
+                id="login_input_email"
+                bitInput
+                type="email"
+                formControlName="email"
+                (keyup.enter)="validateEmail()"
+              />
+            </bit-form-field>
           </div>
-          <bit-label class="ml-2">
-            {{ "rememberEmail" | i18n }}
-          </bit-label>
-        </div>
 
-        <hr />
+          <div class="tw-mb-3 tw-flex tw-items-start">
+            <div class="tw-flex tw-h-6 tw-items-center">
+              <input
+                id="login_input_remember-email"
+                class="tw-w-4 tw-rounded tw-border"
+                bitInput
+                type="checkbox"
+                formControlName="rememberEmail"
+              />
+            </div>
+            <bit-label class="ml-2">
+              {{ "rememberEmail" | i18n }}
+            </bit-label>
+          </div>
 
-        <div [hidden]="!showCaptcha()">
-          <iframe id="hcaptcha_iframe" height="80"></iframe>
-        </div>
+          <div class="tw-mb-3">
+            <button
+              bitButton
+              type="button"
+              buttonType="primary"
+              class="tw-w-full"
+              [disabled]="form.loading"
+              (click)="validateEmail()"
+            >
+              <span> {{ "continue" | i18n }} </span>
+            </button>
+          </div>
 
-        <div class="tw-mb-3 tw-flex tw-space-x-4">
-          <button
-            bitButton
-            buttonType="primary"
-            type="submit"
-            [block]="true"
-            [loading]="form.loading"
-            [disabled]="form.loading"
-          >
-            <span> <i class="bwi bwi-sign-in"></i> {{ "logIn" | i18n }} </span>
-          </button>
+          <hr />
 
-          <a bitButton buttonType="secondary" routerLink="/register" [block]="true">
-            <i class="bwi bwi-pencil-square"></i>
-            {{ "createAccount" | i18n }}
-          </a>
-        </div>
-
-        <div class="tw-mb-3" *ngIf="!selfHosted && showPasswordless">
-          <button
-            bitButton
-            type="button"
-            buttonType="secondary"
-            class="tw-w-full"
-            (click)="startPasswordlessLogin()"
-            [disabled]="form.loading"
-          >
-            <span> <i class="bwi bwi-mobile"></i> {{ "loginWithDevice" | i18n }} </span>
-          </button>
-        </div>
-
-        <div class="tw-mb-3">
-          <a routerLink="/sso" bitButton buttonType="secondary" class="tw-w-full">
-            <i class="bwi bwi-provider tw-mr-2"></i>
-            {{ "enterpriseSingleSignOn" | i18n }}
-          </a>
-        </div>
+          <p class="tw-m-0 tw-text-sm">
+            {{ "newAroundHere" | i18n }}
+            <a routerLink="/register">{{ "createAccount" | i18n }}</a>
+          </p>
+        </ng-container>
       </div>
     </div>
   </div>
 </form>
+
+<ng-template [formGroup]="formGroup" #loginPage>
+  <div class="tw-mb-3">
+    <bit-form-field>
+      <bit-label>{{ "masterPass" | i18n }}</bit-label>
+      <input
+        id="login_input_master-password"
+        bitInput
+        type="{{ showPassword ? 'text' : 'password' }}"
+        formControlName="masterPassword"
+      />
+      <button type="button" bitSuffix bitButton (click)="togglePassword()">
+        <i
+          aria-hidden="true"
+          class="bwi bwi-lg bwi-eye"
+          [ngClass]="{ 'bwi-eye': !showPassword, 'bwi-eye-slash': showPassword }"
+        ></i>
+      </button>
+      <bit-hint>
+        <a routerLink="/hint" (click)="setFormValues()">{{ "getMasterPasswordHint" | i18n }}</a>
+      </bit-hint>
+    </bit-form-field>
+  </div>
+
+  <div [hidden]="!showCaptcha()">
+    <iframe id="hcaptcha_iframe" height="80"></iframe>
+  </div>
+
+  <div class="tw-mb-3 tw-flex tw-space-x-4">
+    <button bitButton buttonType="primary" type="submit" [block]="true" [loading]="form.loading">
+      <span> {{ "loginWithMasterPassword" | i18n }} </span>
+    </button>
+  </div>
+
+  <div class="tw-mb-3" *ngIf="showLoginWithDevice && showPasswordless">
+    <button
+      bitButton
+      type="button"
+      [block]="true"
+      buttonType="secondary"
+      (click)="startPasswordlessLogin()"
+    >
+      <span> <i class="bwi bwi-mobile"></i> {{ "loginWithDevice" | i18n }} </span>
+    </button>
+  </div>
+
+  <div class="tw-mb-3">
+    <a
+      routerLink="/sso"
+      (click)="setFormValues()"
+      bitButton
+      buttonType="secondary"
+      class="tw-w-full"
+    >
+      <i class="bwi bwi-provider tw-mr-2"></i>
+      {{ "enterpriseSingleSignOn" | i18n }}
+    </a>
+  </div>
+
+  <hr />
+
+  <div class="tw-m-0 tw-text-sm">
+    <p class="tw-mb-1">{{ "loggingInAs" | i18n }} {{ loggedEmail }}</p>
+    <a [routerLink]="[]" (click)="toggleValidateEmail(false)">{{ "notYou" | i18n }}</a>
+  </div>
+</ng-template>
diff --git a/apps/web/src/app/accounts/login/login.component.ts b/apps/web/src/app/accounts/login/login.component.ts
index 1c84265049..d461c04c81 100644
--- a/apps/web/src/app/accounts/login/login.component.ts
+++ b/apps/web/src/app/accounts/login/login.component.ts
@@ -6,12 +6,14 @@ import { first } from "rxjs/operators";
 
 import { LoginComponent as BaseLoginComponent } from "@bitwarden/angular/components/login.component";
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { AppIdService } from "@bitwarden/common/abstractions/appId.service";
 import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { CryptoFunctionService } from "@bitwarden/common/abstractions/cryptoFunction.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
 import { FormValidationErrorsService } from "@bitwarden/common/abstractions/formValidationErrors.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService } from "@bitwarden/common/abstractions/messaging.service";
 import { PasswordGenerationService } from "@bitwarden/common/abstractions/passwordGeneration.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
@@ -39,15 +41,16 @@ export class LoginComponent extends BaseLoginComponent implements OnInit, OnDest
   private destroy$ = new Subject<void>();
 
   constructor(
+    apiService: ApiService,
+    appIdService: AppIdService,
     authService: AuthService,
     router: Router,
     i18nService: I18nService,
-    private route: ActivatedRoute,
+    route: ActivatedRoute,
     platformUtilsService: PlatformUtilsService,
     environmentService: EnvironmentService,
     passwordGenerationService: PasswordGenerationService,
     cryptoFunctionService: CryptoFunctionService,
-    private apiService: ApiService,
     private policyApiService: PolicyApiServiceAbstraction,
     private policyService: InternalPolicyService,
     logService: LogService,
@@ -56,9 +59,12 @@ export class LoginComponent extends BaseLoginComponent implements OnInit, OnDest
     private messagingService: MessagingService,
     private routerService: RouterService,
     formBuilder: FormBuilder,
-    formValidationErrorService: FormValidationErrorsService
+    formValidationErrorService: FormValidationErrorsService,
+    loginService: LoginService
   ) {
     super(
+      apiService,
+      appIdService,
       authService,
       router,
       platformUtilsService,
@@ -70,7 +76,9 @@ export class LoginComponent extends BaseLoginComponent implements OnInit, OnDest
       logService,
       ngZone,
       formBuilder,
-      formValidationErrorService
+      formValidationErrorService,
+      route,
+      loginService
     );
     this.onSuccessfulLogin = async () => {
       this.messagingService.send("setFullWidth");
@@ -82,9 +90,6 @@ export class LoginComponent extends BaseLoginComponent implements OnInit, OnDest
   async ngOnInit() {
     // eslint-disable-next-line rxjs-angular/prefer-takeuntil, rxjs/no-async-subscribe
     this.route.queryParams.pipe(first()).subscribe(async (qParams) => {
-      if (qParams.email != null && qParams.email.indexOf("@") > -1) {
-        this.formGroup.get("email")?.setValue(qParams.email);
-      }
       if (qParams.premium != null) {
         this.routerService.setPreviousUrl("/settings/premium");
       } else if (qParams.org != null) {
@@ -102,8 +107,6 @@ export class LoginComponent extends BaseLoginComponent implements OnInit, OnDest
         this.routerService.setPreviousUrl(route.toString());
       }
       await super.ngOnInit();
-      const rememberEmail = await this.stateService.getRememberEmail();
-      this.formGroup.get("rememberEmail")?.setValue(rememberEmail);
     });
 
     const invite = await this.stateService.getOrganizationInvitation();
@@ -176,6 +179,7 @@ export class LoginComponent extends BaseLoginComponent implements OnInit, OnDest
     if (previousUrl) {
       this.router.navigateByUrl(previousUrl);
     } else {
+      this.loginService.clearValues();
       this.router.navigate([this.successRoute]);
     }
   }
diff --git a/apps/web/src/app/accounts/two-factor.component.ts b/apps/web/src/app/accounts/two-factor.component.ts
index 5ebf3ea02e..4fb6f6e365 100644
--- a/apps/web/src/app/accounts/two-factor.component.ts
+++ b/apps/web/src/app/accounts/two-factor.component.ts
@@ -9,6 +9,7 @@ import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { TwoFactorService } from "@bitwarden/common/abstractions/twoFactor.service";
@@ -40,7 +41,8 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
     logService: LogService,
     twoFactorService: TwoFactorService,
     appIdService: AppIdService,
-    private routerService: RouterService
+    private routerService: RouterService,
+    loginService: LoginService
   ) {
     super(
       authService,
@@ -54,7 +56,8 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
       route,
       logService,
       twoFactorService,
-      appIdService
+      appIdService,
+      loginService
     );
     this.onSuccessfulLoginNavigate = this.goAfterLogIn;
   }
@@ -79,6 +82,7 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
   }
 
   async goAfterLogIn() {
+    this.loginService.clearValues();
     const previousUrl = this.routerService.getPreviousUrl();
     if (previousUrl) {
       this.router.navigateByUrl(previousUrl);
diff --git a/apps/web/src/app/core/core.module.ts b/apps/web/src/app/core/core.module.ts
index ba22f4422c..ac349561c8 100644
--- a/apps/web/src/app/core/core.module.ts
+++ b/apps/web/src/app/core/core.module.ts
@@ -13,6 +13,7 @@ import { JslibServicesModule } from "@bitwarden/angular/services/jslib-services.
 import { ModalService as ModalServiceAbstraction } from "@bitwarden/angular/services/modal.service";
 import { FileDownloadService } from "@bitwarden/common/abstractions/fileDownload/fileDownload.service";
 import { I18nService as I18nServiceAbstraction } from "@bitwarden/common/abstractions/i18n.service";
+import { LoginService as LoginServiceAbstraction } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService as MessagingServiceAbstraction } from "@bitwarden/common/abstractions/messaging.service";
 import { PasswordRepromptService as PasswordRepromptServiceAbstraction } from "@bitwarden/common/abstractions/passwordReprompt.service";
 import { PlatformUtilsService as PlatformUtilsServiceAbstraction } from "@bitwarden/common/abstractions/platformUtils.service";
@@ -20,6 +21,7 @@ import { StateService as BaseStateServiceAbstraction } from "@bitwarden/common/a
 import { StateMigrationService as StateMigrationServiceAbstraction } from "@bitwarden/common/abstractions/stateMigration.service";
 import { AbstractStorageService } from "@bitwarden/common/abstractions/storage.service";
 import { StateFactory } from "@bitwarden/common/factories/stateFactory";
+import { LoginService } from "@bitwarden/common/services/login.service";
 import { MemoryStorageService } from "@bitwarden/common/services/memoryStorage.service";
 
 import { BroadcasterMessagingService } from "./broadcaster-messaging.service";
@@ -98,6 +100,10 @@ import { WebPlatformUtilsService } from "./web-platform-utils.service";
       provide: FileDownloadService,
       useClass: WebFileDownloadService,
     },
+    {
+      provide: LoginServiceAbstraction,
+      useClass: LoginService,
+    },
   ],
 })
 export class CoreModule {
diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json
index ab1fe4f8cf..0edc70d0a6 100644
--- a/apps/web/src/locales/en/messages.json
+++ b/apps/web/src/locales/en/messages.json
@@ -569,12 +569,15 @@
   "loginOrCreateNewAccount": {
     "message": "Log in or create a new account to access your secure vault."
   },
-  "loginWithDevice" : {
+  "loginWithDevice": {
     "message": "Log in with device"
   },
   "loginWithDeviceEnabledInfo": {
     "message": "Log in with device must be set up in the settings of the Bitwarden mobile app. Need another option?"
   },
+  "loginWithMasterPassword": {
+    "message": "Log in with master password"
+  },
   "createAccount": {
     "message": "Create account"
   },
@@ -717,7 +720,7 @@
   "noOrganizationsList": {
     "message": "You do not belong to any organizations. Organizations allow you to securely share items with other users."
   },
-  "notificationSentDevice":{
+  "notificationSentDevice": {
     "message": "A notification has been sent to your device."
   },
   "versionNumber": {
@@ -5394,6 +5397,12 @@
   "numberOfUsers": {
     "message": "Number of users"
   },
+  "loggingInAs": {
+    "message": "Logging in as"
+  },
+  "notYou": {
+    "message": "Not you?"
+  },
   "multiSelectPlaceholder": {
     "message": "-- Type to Filter --"
   },
diff --git a/libs/angular/src/components/hint.component.ts b/libs/angular/src/components/hint.component.ts
index 7e802722bf..de49e28c86 100644
--- a/libs/angular/src/components/hint.component.ts
+++ b/libs/angular/src/components/hint.component.ts
@@ -1,12 +1,15 @@
+import { Directive, OnInit } from "@angular/core";
 import { Router } from "@angular/router";
 
 import { ApiService } from "@bitwarden/common/abstractions/api.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { PasswordHintRequest } from "@bitwarden/common/models/request/password-hint.request";
 
-export class HintComponent {
+@Directive()
+export class HintComponent implements OnInit {
   email = "";
   formPromise: Promise<any>;
 
@@ -18,9 +21,14 @@ export class HintComponent {
     protected i18nService: I18nService,
     protected apiService: ApiService,
     protected platformUtilsService: PlatformUtilsService,
-    private logService: LogService
+    private logService: LogService,
+    private loginService: LoginService
   ) {}
 
+  ngOnInit(): void {
+    this.email = this.loginService.getEmail() ?? "";
+  }
+
   async submit() {
     if (this.email == null || this.email === "") {
       this.platformUtilsService.showToast(
diff --git a/libs/angular/src/components/login.component.ts b/libs/angular/src/components/login.component.ts
index ab0e4df57e..6d4b6966bb 100644
--- a/libs/angular/src/components/login.component.ts
+++ b/libs/angular/src/components/login.component.ts
@@ -1,8 +1,10 @@
 import { Directive, NgZone, OnInit } from "@angular/core";
 import { FormBuilder, Validators } from "@angular/forms";
-import { Router } from "@angular/router";
+import { ActivatedRoute, Router } from "@angular/router";
 import { take } from "rxjs/operators";
 
+import { ApiService } from "@bitwarden/common/abstractions/api.service";
+import { AppIdService } from "@bitwarden/common/abstractions/appId.service";
 import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { CryptoFunctionService } from "@bitwarden/common/abstractions/cryptoFunction.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
@@ -12,6 +14,7 @@ import {
 } from "@bitwarden/common/abstractions/formValidationErrors.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PasswordGenerationService } from "@bitwarden/common/abstractions/passwordGeneration.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
@@ -29,20 +32,30 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
   onSuccessfulLoginNavigate: () => Promise<any>;
   onSuccessfulLoginTwoFactorNavigate: () => Promise<any>;
   onSuccessfulLoginForceResetNavigate: () => Promise<any>;
-  selfHosted = false;
+  private selfHosted = false;
+  showLoginWithDevice: boolean;
+  validatedEmail = false;
+  paramEmailSet = false;
 
   formGroup = this.formBuilder.group({
     email: ["", [Validators.required, Validators.email]],
     masterPassword: ["", [Validators.required, Validators.minLength(8)]],
-    rememberEmail: [true],
+    rememberEmail: [false],
   });
 
   protected twoFactorRoute = "2fa";
   protected successRoute = "vault";
   protected forcePasswordResetRoute = "update-temp-password";
   protected alwaysRememberEmail = false;
+  protected skipRememberEmail = false;
+
+  get loggedEmail() {
+    return this.formGroup.value.email;
+  }
 
   constructor(
+    protected apiService: ApiService,
+    protected appIdService: AppIdService,
     protected authService: AuthService,
     protected router: Router,
     platformUtilsService: PlatformUtilsService,
@@ -54,7 +67,9 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
     protected logService: LogService,
     protected ngZone: NgZone,
     protected formBuilder: FormBuilder,
-    protected formValidationErrorService: FormValidationErrorsService
+    protected formValidationErrorService: FormValidationErrorsService,
+    protected route: ActivatedRoute,
+    protected loginService: LoginService
   ) {
     super(environmentService, i18nService, platformUtilsService);
     this.selfHosted = platformUtilsService.isSelfHost();
@@ -65,19 +80,35 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
   }
 
   async ngOnInit() {
-    let email = this.formGroup.value.email;
+    this.route?.queryParams.subscribe((params) => {
+      if (params != null) {
+        const queryParamsEmail = params["email"];
+        if (queryParamsEmail != null && queryParamsEmail.indexOf("@") > -1) {
+          this.formGroup.get("email").setValue(queryParamsEmail);
+          this.paramEmailSet = true;
+        }
+      }
+    });
+    let email = this.loginService.getEmail();
+
     if (email == null || email === "") {
       email = await this.stateService.getRememberedEmail();
-      this.formGroup.get("email")?.setValue(email);
+    }
 
-      if (email == null) {
-        this.formGroup.get("email")?.setValue("");
-      }
+    if (!this.paramEmailSet) {
+      this.formGroup.get("email")?.setValue(email ?? "");
     }
     if (!this.alwaysRememberEmail) {
-      const rememberEmail = (await this.stateService.getRememberedEmail()) != null;
+      let rememberEmail = this.loginService.getRememberEmail();
+      if (rememberEmail == null) {
+        rememberEmail = (await this.stateService.getRememberedEmail()) != null;
+      }
       this.formGroup.get("rememberEmail")?.setValue(rememberEmail);
     }
+
+    if (email) {
+      this.validateEmail();
+    }
   }
 
   async submit(showToast = true) {
@@ -108,6 +139,7 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
       );
       this.formPromise = this.authService.logIn(credentials);
       const response = await this.formPromise;
+      this.setFormValues();
       if (data.rememberEmail || this.alwaysRememberEmail) {
         await this.stateService.setRememberedEmail(data.email);
       } else {
@@ -130,6 +162,7 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
       } else {
         const disableFavicon = await this.stateService.getDisableFavicon();
         await this.stateService.setDisableFavicon(!!disableFavicon);
+        this.loginService.clearValues();
         if (this.onSuccessfulLogin != null) {
           this.onSuccessfulLogin();
         }
@@ -191,6 +224,25 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
     );
   }
 
+  async validateEmail() {
+    this.formGroup.controls.email.markAsTouched();
+    const emailInvalid = this.formGroup.get("email").invalid;
+    if (!emailInvalid) {
+      this.toggleValidateEmail(true);
+      await this.getLoginWithDevice(this.loggedEmail);
+    }
+  }
+
+  toggleValidateEmail(value: boolean) {
+    this.validatedEmail = value;
+    this.formGroup.controls.masterPassword.reset();
+  }
+
+  setFormValues() {
+    this.loginService.setEmail(this.formGroup.value.email);
+    this.loginService.setRememberEmail(this.formGroup.value.rememberEmail);
+  }
+
   private getErrorToastMessage() {
     const error: AllValidationErrors = this.formValidationErrorService
       .getFormValidationErrors(this.formGroup.controls)
@@ -213,8 +265,19 @@ export class LoginComponent extends CaptchaProtectedComponent implements OnInit
     return `${error.controlName}${name}`;
   }
 
+  private async getLoginWithDevice(email: string) {
+    try {
+      const deviceIdentifier = await this.appIdService.getAppId();
+      const res = await this.apiService.getKnownDevice(email, deviceIdentifier);
+      //ensure the application is not self-hosted
+      this.showLoginWithDevice = res && !this.selfHosted;
+    } catch (e) {
+      this.showLoginWithDevice = false;
+    }
+  }
+
   protected focusInput() {
-    const email = this.formGroup.value.email;
+    const email = this.loggedEmail;
     document.getElementById(email == null || email === "" ? "email" : "masterPassword").focus();
   }
 }
diff --git a/libs/angular/src/components/two-factor.component.ts b/libs/angular/src/components/two-factor.component.ts
index 1c2f4ff60b..f61e54710b 100644
--- a/libs/angular/src/components/two-factor.component.ts
+++ b/libs/angular/src/components/two-factor.component.ts
@@ -9,6 +9,7 @@ import { AuthService } from "@bitwarden/common/abstractions/auth.service";
 import { EnvironmentService } from "@bitwarden/common/abstractions/environment.service";
 import { I18nService } from "@bitwarden/common/abstractions/i18n.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService } from "@bitwarden/common/abstractions/login.service";
 import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service";
 import { StateService } from "@bitwarden/common/abstractions/state.service";
 import { TwoFactorService } from "@bitwarden/common/abstractions/twoFactor.service";
@@ -59,7 +60,8 @@ export class TwoFactorComponent extends CaptchaProtectedComponent implements OnI
     protected route: ActivatedRoute,
     protected logService: LogService,
     protected twoFactorService: TwoFactorService,
-    protected appIdService: AppIdService
+    protected appIdService: AppIdService,
+    protected loginService: LoginService
   ) {
     super(environmentService, i18nService, platformUtilsService);
     this.webAuthnSupported = this.platformUtilsService.supportsWebAuthn(win);
@@ -204,6 +206,7 @@ export class TwoFactorComponent extends CaptchaProtectedComponent implements OnI
       return;
     }
     if (this.onSuccessfulLogin != null) {
+      this.loginService.clearValues();
       this.onSuccessfulLogin();
     }
     if (response.resetMasterPassword) {
@@ -213,8 +216,10 @@ export class TwoFactorComponent extends CaptchaProtectedComponent implements OnI
       this.successRoute = "update-temp-password";
     }
     if (this.onSuccessfulLoginNavigate != null) {
+      this.loginService.clearValues();
       this.onSuccessfulLoginNavigate();
     } else {
+      this.loginService.clearValues();
       this.router.navigate([this.successRoute], {
         queryParams: {
           identifier: this.identifier,
diff --git a/libs/angular/src/services/jslib-services.module.ts b/libs/angular/src/services/jslib-services.module.ts
index 83725838a5..5f49041bd7 100644
--- a/libs/angular/src/services/jslib-services.module.ts
+++ b/libs/angular/src/services/jslib-services.module.ts
@@ -31,6 +31,7 @@ import { FormValidationErrorsService as FormValidationErrorsServiceAbstraction }
 import { I18nService as I18nServiceAbstraction } from "@bitwarden/common/abstractions/i18n.service";
 import { KeyConnectorService as KeyConnectorServiceAbstraction } from "@bitwarden/common/abstractions/keyConnector.service";
 import { LogService } from "@bitwarden/common/abstractions/log.service";
+import { LoginService as LoginServiceAbstraction } from "@bitwarden/common/abstractions/login.service";
 import { MessagingService as MessagingServiceAbstraction } from "@bitwarden/common/abstractions/messaging.service";
 import { NotificationsService as NotificationsServiceAbstraction } from "@bitwarden/common/abstractions/notifications.service";
 import { OrganizationApiServiceAbstraction } from "@bitwarden/common/abstractions/organization/organization-api.service.abstraction";
@@ -88,6 +89,7 @@ import { FolderApiService } from "@bitwarden/common/services/folder/folder-api.s
 import { FolderService } from "@bitwarden/common/services/folder/folder.service";
 import { FormValidationErrorsService } from "@bitwarden/common/services/formValidationErrors.service";
 import { KeyConnectorService } from "@bitwarden/common/services/keyConnector.service";
+import { LoginService } from "@bitwarden/common/services/login.service";
 import { NotificationsService } from "@bitwarden/common/services/notifications.service";
 import { OrganizationApiService } from "@bitwarden/common/services/organization/organization-api.service";
 import { OrganizationService } from "@bitwarden/common/services/organization/organization.service";
@@ -578,6 +580,10 @@ import { AbstractThemingService } from "./theming/theming.service.abstraction";
       useClass: ValidationService,
       deps: [I18nServiceAbstraction, PlatformUtilsServiceAbstraction],
     },
+    {
+      provide: LoginServiceAbstraction,
+      useClass: LoginService,
+    },
   ],
 })
 export class JslibServicesModule {}
diff --git a/libs/common/src/abstractions/api.service.ts b/libs/common/src/abstractions/api.service.ts
index 14dc26cc59..74f9edebd6 100644
--- a/libs/common/src/abstractions/api.service.ts
+++ b/libs/common/src/abstractions/api.service.ts
@@ -479,6 +479,7 @@ export abstract class ApiService {
   putDeviceVerificationSettings: (
     request: DeviceVerificationRequest
   ) => Promise<DeviceVerificationResponse>;
+  getKnownDevice: (email: string, deviceIdentifier: string) => Promise<boolean>;
 
   getEmergencyAccessTrusted: () => Promise<ListResponse<EmergencyAccessGranteeDetailsResponse>>;
   getEmergencyAccessGranted: () => Promise<ListResponse<EmergencyAccessGrantorDetailsResponse>>;
diff --git a/libs/common/src/abstractions/login.service.ts b/libs/common/src/abstractions/login.service.ts
new file mode 100644
index 0000000000..0823611546
--- /dev/null
+++ b/libs/common/src/abstractions/login.service.ts
@@ -0,0 +1,7 @@
+export abstract class LoginService {
+  getEmail: () => string;
+  getRememberEmail: () => boolean;
+  setEmail: (value: string) => void;
+  setRememberEmail: (value: boolean) => void;
+  clearValues: () => void;
+}
diff --git a/libs/common/src/services/api.service.ts b/libs/common/src/services/api.service.ts
index bab17eb43f..7c39958bce 100644
--- a/libs/common/src/services/api.service.ts
+++ b/libs/common/src/services/api.service.ts
@@ -1518,6 +1518,12 @@ export class ApiService implements ApiServiceAbstraction {
     return new DeviceVerificationResponse(r);
   }
 
+  async getKnownDevice(email: string, deviceIdentifier: string): Promise<boolean> {
+    const path = `/devices/knowndevice/${email}/${deviceIdentifier}`;
+    const r = await this.send("GET", path, null, false, true);
+    return r as boolean;
+  }
+
   // Emergency Access APIs
 
   async getEmergencyAccessTrusted(): Promise<ListResponse<EmergencyAccessGranteeDetailsResponse>> {
diff --git a/libs/common/src/services/login.service.ts b/libs/common/src/services/login.service.ts
new file mode 100644
index 0000000000..8a06f6b7a0
--- /dev/null
+++ b/libs/common/src/services/login.service.ts
@@ -0,0 +1,27 @@
+import { LoginService as LoginServiceAbstraction } from "../abstractions/login.service";
+
+export class LoginService implements LoginServiceAbstraction {
+  private _email: string;
+  private _rememberEmail: boolean;
+
+  getEmail() {
+    return this._email;
+  }
+
+  getRememberEmail() {
+    return this._rememberEmail;
+  }
+
+  setEmail(value: string) {
+    this._email = value;
+  }
+
+  setRememberEmail(value: boolean) {
+    this._rememberEmail = value;
+  }
+
+  clearValues() {
+    this._email = null;
+    this._rememberEmail = null;
+  }
+}