diff --git a/src/Web/wwwroot/_references.js b/src/Web/wwwroot/_references.js
index d148fa59c35..a3275034c6d 100644
--- a/src/Web/wwwroot/_references.js
+++ b/src/Web/wwwroot/_references.js
@@ -4,6 +4,7 @@
 /// <reference path="app/accounts/accountsLogoutController.js" />
 /// <reference path="app/accounts/accountsmodule.js" />
 /// <reference path="app/accounts/accountspasswordhintcontroller.js" />
+/// <reference path="app/accounts/accountsrecovercontroller.js" />
 /// <reference path="app/accounts/accountsRegisterController.js" />
 /// <reference path="app/apiInterceptor.js" />
 /// <reference path="app/app.js" />
diff --git a/src/Web/wwwroot/app/accounts/accountsRecoverController.js b/src/Web/wwwroot/app/accounts/accountsRecoverController.js
new file mode 100644
index 00000000000..527e512f44b
--- /dev/null
+++ b/src/Web/wwwroot/app/accounts/accountsRecoverController.js
@@ -0,0 +1,21 @@
+angular
+    .module('bit.accounts')
+
+    .controller('accountsRecoverController', function ($scope, apiService, cryptoService) {
+        $scope.success = false;
+
+        $scope.submit = function (model) {
+            var email = model.email.toLowerCase();
+            var key = cryptoService.makeKey(model.masterPassword, email);
+
+            var request = {
+                email: email,
+                masterPasswordHash: cryptoService.hashPassword(model.masterPassword, key),
+                recoveryCode: model.code.replace(/\s/g, '').toLowerCase()
+            };
+
+            $scope.submitPromise = apiService.accounts.postTwoFactorRecover(request, function () {
+                $scope.success = true;
+            }).$promise;
+        };
+    });
diff --git a/src/Web/wwwroot/app/accounts/views/accountsLoginTwoFactor.html b/src/Web/wwwroot/app/accounts/views/accountsLoginTwoFactor.html
index 55401e7082a..7c31a106804 100644
--- a/src/Web/wwwroot/app/accounts/views/accountsLoginTwoFactor.html
+++ b/src/Web/wwwroot/app/accounts/views/accountsLoginTwoFactor.html
@@ -13,7 +13,10 @@
         <span class="fa fa-lock form-control-feedback"></span>
     </div>
     <div class="row">
-        <div class="col-xs-offset-7 col-xs-5">
+        <div class="col-xs-7">
+            <a ui-sref="frontend.recover">Lost authenticator app?</a>
+        </div>
+        <div class="col-xs-5">
             <button type="submit" class="btn btn-primary btn-block btn-flat" ng-disabled="twoFactorForm.$loading">
                 <i class="fa fa-refresh fa-spin loading-icon" ng-show="twoFactorForm.$loading"></i>Log In
             </button>
diff --git a/src/Web/wwwroot/app/accounts/views/accountsRecover.html b/src/Web/wwwroot/app/accounts/views/accountsRecover.html
new file mode 100644
index 00000000000..3cf9d872b46
--- /dev/null
+++ b/src/Web/wwwroot/app/accounts/views/accountsRecover.html
@@ -0,0 +1,52 @@
+<div class="login-box">
+    <div class="login-logo">
+        <i class="fa fa-shield"></i> <b>bit</b>warden
+    </div>
+    <div class="login-box-body">
+        <p class="login-box-msg">Lost your authenticator app?</p>
+        <div class="text-center" ng-show="success">
+            <div class="callout callout-success">
+                Two-step login has been successfully disabled on your account.
+            </div>
+            <a ui-sref="frontend.login.info">Ready to log in?</a>
+        </div>
+        <form name="recoverForm" ng-submit="recoverForm.$valid && submit(model)" ng-show="!success"
+              api-form="submitPromise">
+            <div class="callout callout-danger validation-errors" ng-show="recoverForm.$errors">
+                <h4>Errors have occured</h4>
+                <ul>
+                    <li ng-repeat="e in recoverForm.$errors">{{e}}</li>
+                </ul>
+            </div>
+            <div class="form-group has-feedback" show-errors>
+                <label for="email" class="sr-only">Email</label>
+                <input type="email" id="email" name="Email" class="form-control" placeholder="Email" ng-model="model.email"
+                       required api-field />
+                <span class="fa fa-envelope form-control-feedback"></span>
+            </div>
+            <div class="form-group has-feedback" show-errors>
+                <label for="masterPassword" class="sr-only">Master Password</label>
+                <input type="password" id="masterPassword" name="MasterPasswordHash" class="form-control" placeholder="Master Password"
+                       ng-model="model.masterPassword"
+                       required api-field />
+                <span class="fa fa-lock form-control-feedback"></span>
+            </div>
+            <div class="form-group has-feedback" show-errors>
+                <label for="code" class="sr-only">Recovery code</label>
+                <input type="text" id="code" name="RecoveryCode" class="form-control" placeholder="Recovery code"
+                       ng-model="model.code" required api-field />
+                <span class="fa fa-key form-control-feedback"></span>
+            </div>
+            <div class="row">
+                <div class="col-xs-7">
+                    <a ui-sref="frontend.login.info">Ready to log in?</a>
+                </div>
+                <div class="col-xs-5">
+                    <button type="submit" class="btn btn-primary btn-block btn-flat" ng-disabled="recoverForm.$loading">
+                        <i class="fa fa-refresh fa-spin loading-icon" ng-show="recoverForm.$loading"></i>Submit
+                    </button>
+                </div>
+            </div>
+        </form>
+    </div>
+</div>
diff --git a/src/Web/wwwroot/app/config.js b/src/Web/wwwroot/app/config.js
index d235987baa2..31eb3381988 100644
--- a/src/Web/wwwroot/app/config.js
+++ b/src/Web/wwwroot/app/config.js
@@ -105,6 +105,15 @@ angular
                     bodyClass: 'login-page'
                 }
             })
+            .state('frontend.recover', {
+                url: '^/recover',
+                templateUrl: 'app/accounts/views/accountsRecover.html',
+                controller: 'accountsRecoverController',
+                data: {
+                    pageTitle: 'Recover Account',
+                    bodyClass: 'login-page'
+                }
+            })
             .state('frontend.register', {
                 url: '^/register',
                 templateUrl: 'app/accounts/views/accountsRegister.html',
diff --git a/src/Web/wwwroot/app/services/apiService.js b/src/Web/wwwroot/app/services/apiService.js
index 64f496d8eb0..b575f7d302d 100644
--- a/src/Web/wwwroot/app/services/apiService.js
+++ b/src/Web/wwwroot/app/services/apiService.js
@@ -38,6 +38,7 @@
             putProfile: { url: _apiUri + '/accounts/profile', method: 'POST', params: {} },
             getTwoFactor: { url: _apiUri + '/accounts/two-factor', method: 'GET', params: {} },
             putTwoFactor: { url: _apiUri + '/accounts/two-factor', method: 'POST', params: {} },
+            postTwoFactorRecover: { url: _apiUri + '/accounts/two-factor-recover', method: 'POST', params: {} },
             postPasswordHint: { url: _apiUri + '/accounts/password-hint', method: 'POST', params: {} },
             putSecurityStamp: { url: _apiUri + '/accounts/security-stamp', method: 'POST', params: {} },
             'import': { url: _apiUri + '/accounts/import', method: 'POST', params: {} },
diff --git a/src/Web/wwwroot/index.html b/src/Web/wwwroot/index.html
index b4a80a2f450..24a3585b70f 100644
--- a/src/Web/wwwroot/index.html
+++ b/src/Web/wwwroot/index.html
@@ -110,6 +110,7 @@
     <script src="app/accounts/accountsLogoutController.js"></script>
     <script src="app/accounts/accountsRegisterController.js"></script>
     <script src="app/accounts/accountsPasswordHintController.js"></script>
+    <script src="app/accounts/accountsRecoverController.js"></script>
 
     <script src="app/vault/vaultModule.js"></script>
     <script src="app/vault/vaultController.js"></script>