diff --git a/src/server/backend/credentials/2fa.js b/src/server/backend/credentials/2fa.js
index 71638bb..53b44b9 100644
--- a/src/server/backend/credentials/2fa.js
+++ b/src/server/backend/credentials/2fa.js
@@ -8,6 +8,8 @@
 */
 
 const token = require( '../token.js' );
+// let createSSRApp = require( 'vue' ).createSSRApp;
+// let renderToString = require( 'vue/server-renderer' ).renderToString;
 
 class TwoFA {
     constructor () {
@@ -15,14 +17,20 @@ class TwoFA {
     }
 
     registerStandardAuthentication () {
-        let tok = token.generateToken( 61 );
+        let tok = token.generateToken( 60 );
+        while ( this.tokenStore[ tok ] ) {
+            tok = token.generateToken( 60 );
+        }
         this.tokenStore[ tok ] = { 'mode': 'standard' };
         return { 'token': tok };
     }
     
     registerEnhancedAuthentication () {
-        let tok = token.generateToken( 61 );
-        let code = token.generateNumber( 7 );
+        let tok = token.generateToken( 60 );
+        while ( this.tokenStore[ tok ] ) {
+            tok = token.generateToken( 60 );
+        }
+        let code = token.generateNumber( 6 );
         this.tokenStore[ tok ] = { 'mode': 'enhanced', 'code': code };
         return { 'code': code, 'token': tok };
     }
@@ -30,14 +38,18 @@ class TwoFA {
     verifyEnhanced ( token, number = '' ) {
         if ( this.tokenStore[ token ]?.mode === 'standard' ) return true;
         else if ( this.tokenStore[ token ]?.mode === 'enhanced' ) {
-            if ( this.tokenStore[ token ].code == number ) return true;
-            else return false;
+            if ( this.tokenStore[ token ].code == number ) { 
+                delete this.tokenStore[ token ];
+                return true;
+            } else return false;
         } else return false;
     }
 
     verifySimple ( token ) {
-        if ( this.tokenStore[ token ]?.mode === 'standard' ) return 'standard';
-        else if ( this.tokenStore[ token ]?.mode === 'enhanced' ) return 'enhanced';
+        if ( this.tokenStore[ token ]?.mode === 'standard' ) {
+            delete this.tokenStore[ token ];
+            return 'standard';
+        } else if ( this.tokenStore[ token ]?.mode === 'enhanced' ) return 'enhanced';
         else return 'invalid';
     }
 }
diff --git a/src/server/backend/userRoutes.js b/src/server/backend/userRoutes.js
index b00debc..d55d731 100644
--- a/src/server/backend/userRoutes.js
+++ b/src/server/backend/userRoutes.js
@@ -46,15 +46,20 @@ module.exports = ( app, settings ) => {
         // TODO: Add multi language
         let tokType = twoFA.verifySimple( request.query.token );
         if ( tokType === 'standard' ) {
-            response.sendFile( path.join( __dirname + '/../ui/en/2faSimple.html' ) );
+            request.session.loggedInUser = true;
+            response.sendFile( path.join( __dirname + '/../ui/en/2fa/2faSimple.html' ) );
         } else if ( tokType === 'enhanced' ) {
-            response.sendFile( path.join( __dirname + '/../ui/en/2faEnhanced.html' ) );
+            response.sendFile( path.join( __dirname + '/../ui/en/2fa/2faEnhanced.html' ) );
         } else {
-            response.sendFile( path.join( __dirname + '/../ui/en/2faInvalid.html' ) );
+            response.sendFile( path.join( __dirname + '/../ui/en/2fa/2faInvalid.html' ) );
         }
     } );
 
     app.post( '/user/2fa/verify', ( request, response ) => {
-        
+        let verified = twoFA.verifyEnhanced( request.body.token, request.body.code );
+        if ( verified ) {
+            request.session.loggedInUser = true;
+            response.send( 'ok' );
+        } else response.send( 'wrong' );
     } );
 };
\ No newline at end of file
diff --git a/src/server/config/settings.config.json b/src/server/config/settings.config.json
index 9f3ed22..acbab79 100644
--- a/src/server/config/settings.config.json
+++ b/src/server/config/settings.config.json
@@ -1,4 +1,4 @@
 {
     "init": false,
-    "twoFA": "disabled"
+    "twoFA": "enhanced"
 }
\ No newline at end of file
diff --git a/src/server/ui/en/2fa/2faEnhanced.html b/src/server/ui/en/2fa/2faEnhanced.html
new file mode 100644
index 0000000..db0aed9
--- /dev/null
+++ b/src/server/ui/en/2fa/2faEnhanced.html
@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Two Factor Authentication Invalid</title>
+        <style>
+            body, html {
+                width: 100%;
+                height: 100%;
+                margin: 0;
+                padding: 0;
+            }
+
+            body {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                flex-direction: column;
+                font-family: Avenir, Helvetica, Arial, sans-serif;
+                text-align: center;
+                background-color: rgb(41, 40, 40);
+                color: white;
+                font-size: 150%;
+            }
+
+            .content {
+                width: 70%;
+            }
+
+            #code {
+                padding: 0.75%;
+                border: solid white 1px;
+                border-radius: 7px;
+                font-size: 100%;
+                text-align: center;
+            }
+
+            .submit {
+                margin-top: 2%;
+                background: linear-gradient(90deg, rgb(30, 36, 131), rgb(87, 66, 184), rgb(105, 115, 214), rgb(30, 36, 131), rgb(41, 128, 109), rgb(146, 50, 47));
+                background-size: 300px;
+                padding: 10px 20px;
+                border: none;
+                border-radius: 20px;
+                cursor: pointer;
+                transition: all 3s;
+                font-size: 75%;
+                color: white;
+            }
+
+            .submit:hover {
+                background-size: 200%;
+                background-position: -100%;
+            }
+
+            #popup {
+                border: none;
+                border-radius: 20px;
+                padding: 5%;
+                background-color: rgb(34, 34, 34);
+                color: white;
+                max-width: 70%;
+            }
+
+            #popup::backdrop {
+                background-color: rgba( 0, 0, 0, 0.8 );
+            }
+        </style>
+    </head>
+    <body>
+        <div class="content">
+            <h1>Two-Factor Authen&shy;tication</h1>
+            <p>Please enter the code displayed on the login page down below to finish the Two-Factor Authentication.</p>
+            <form onsubmit="return submitFunction()" id="form">
+                <input type="text" name="code" id="code"><br>
+                <input type="submit" value="Submit" class="submit">
+            </form>
+            <dialog id="popup">
+                <p id="popup-message"></p>
+                <form method="dialog">
+                    <input type="submit" value="Ok" class="submit">
+                </form>
+            </dialog>
+        </div>
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
+        <script>
+            function submitFunction () {
+                let data = document.getElementById( 'code' ).value;
+                if ( data.length == 6 ) {
+                    let fetchOptions = {
+                        method: 'post',
+                        body: JSON.stringify( { 'code': data, 'token': location.search.substring( 7 ) } ),
+                        headers: {
+                            'Content-Type': 'application/json',
+                            'charset': 'utf-8'
+                        }
+                    };
+                    fetch( '/user/2fa/verify', fetchOptions ).then( res => {
+                        res.text().then( data => {
+                            if ( data === 'ok' ) {
+                                openPopup( 'You have successfully authorised this login. You may now close this tab and head back to the original tab.' );
+                            } else {
+                                openPopup( 'This code you specified is invalid (or no longer valid). Please try again.' );
+                            }
+                        } );
+                    } );
+                } else {
+                    openPopup( 'Please enter a six-character code to proceed' );
+                }
+                return false;
+            }
+
+            function openPopup ( message ) {
+                document.getElementById( 'popup-message' ).innerHTML = message;
+                document.getElementById( 'popup' ).showModal();
+            }
+        </script>
+    </body>
+</html>
\ No newline at end of file
diff --git a/src/server/ui/en/2fa/2faInvalid.html b/src/server/ui/en/2fa/2faInvalid.html
new file mode 100644
index 0000000..40490b4
--- /dev/null
+++ b/src/server/ui/en/2fa/2faInvalid.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Two Factor Authentication Invalid</title>
+        <style>
+            body, html {
+                width: 100%;
+                height: 100%;
+                margin: 0;
+                padding: 0;
+            }
+
+            body {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                flex-direction: column;
+                font-family: Avenir, Helvetica, Arial, sans-serif;
+                text-align: center;
+                background-color: rgb(41, 40, 40);
+                color: white;
+                font-size: 150%;
+            }
+
+            .content {
+                width: 70%;
+            }
+        </style>
+    </head>
+    <body>
+        <div class="content">
+            <h1>Two-Factor Authen&shy;tication Token invalid</h1>
+            <p>The token you have specified is invalid. Please check that the link used is correct. If nothing helps, please try logging in again.</p>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/src/server/ui/en/2fa/2faSimple.html b/src/server/ui/en/2fa/2faSimple.html
new file mode 100644
index 0000000..54ef4e6
--- /dev/null
+++ b/src/server/ui/en/2fa/2faSimple.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Two Factor Authentication Invalid</title>
+        <style>
+            body, html {
+                width: 100%;
+                height: 100%;
+                margin: 0;
+                padding: 0;
+            }
+
+            body {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                flex-direction: column;
+                font-family: Avenir, Helvetica, Arial, sans-serif;
+                text-align: center;
+                background-color: rgb(41, 40, 40);
+                color: white;
+                font-size: 150%;
+            }
+
+            .content {
+                width: 70%;
+            }
+        </style>
+    </head>
+    <body>
+        <div class="content">
+            <h1>Two-Factor Authen&shy;tication Successful</h1>
+            <p>Your two-factor authentication has been completed successfully. You were redirected automatically. You may now close this tab and return to the original browser tab.</p>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/src/server/ui/en/2faEnhanced.html b/src/server/ui/en/2faEnhanced.html
deleted file mode 100644
index b8e6424..0000000
--- a/src/server/ui/en/2faEnhanced.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Two Factor Authentication</title>
-    </head>
-    <body>
-        <h1>2fa+</h1>
-    </body>
-</html>
\ No newline at end of file
diff --git a/src/server/ui/en/2faInvalid.html b/src/server/ui/en/2faInvalid.html
deleted file mode 100644
index 8d786d0..0000000
--- a/src/server/ui/en/2faInvalid.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Two Factor Authentication Invalid</title>
-    </head>
-    <body>
-        <h1>2fa invalid</h1>
-    </body>
-</html>
\ No newline at end of file
diff --git a/src/server/ui/en/2faSimple.html b/src/server/ui/en/2faSimple.html
deleted file mode 100644
index 460f002..0000000
--- a/src/server/ui/en/2faSimple.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Two Factor Authentication</title>
-    </head>
-    <body>
-        <h1>2fa</h1>
-    </body>
-</html>
\ No newline at end of file
diff --git a/src/webapp/src/views/user/LoginView.vue b/src/webapp/src/views/user/LoginView.vue
index d5e0107..fe5fa18 100644
--- a/src/webapp/src/views/user/LoginView.vue
+++ b/src/webapp/src/views/user/LoginView.vue
@@ -54,15 +54,18 @@
                             }
                         };
                         fetch( localStorage.getItem( 'url' ) + '/user/login', fetchOptions ).then( res => {
-                            res.text().then( text => {
-                                console.log( text );
-                                if ( text === 'ok' ) {
+                            res.json().then( json => {
+                                if ( json.status === 'ok' ) {
                                     this.userStore.setUserAuth( true );
                                     this.$router.push( sessionStorage.getItem( 'redirect' ) ? sessionStorage.getItem( 'redirect' ) : '/account' );
                                     sessionStorage.removeItem( 'redirect' );
-                                } else if ( text === '2fa' ) {
+                                } else if ( json.status === '2fa' ) {
                                     this.userStore.setUser2fa( true );
                                     this.$router.push( '/twoFactors' );
+                                } else if ( json.status === '2fa+' ) {
+                                    this.userStore.setUser2fa( true );
+                                    sessionStorage.setItem( '2faCode', json.code );
+                                    this.$router.push( '/twoFactors' );
                                 } else {
                                     this.$refs.notification.createNotification( 'The credentials you provided do not match our records.', 5, 'error', 'normal' );
                                 }
diff --git a/src/webapp/src/views/user/TwoFA.vue b/src/webapp/src/views/user/TwoFA.vue
index 18ad2f7..42f4dc8 100644
--- a/src/webapp/src/views/user/TwoFA.vue
+++ b/src/webapp/src/views/user/TwoFA.vue
@@ -1,6 +1,64 @@
 <template>
-    <div id="2fa">
-        <h1>Two Factor Authentication</h1>
+    <div id="twoFA">
+        <h1>Two-Factor Authentication</h1>
         <p>We have sent you an email containing a link for Authentication.</p>
+        <div class="code-container" v-if="code != ''">
+            <p>Open the link in the email and enter this code:</p>
+            <div class="code">
+                <div class="code-sub" id="code-part1">{{ code[1] }}</div>
+                <div class="code-sub" id="code-part2">{{ code[2] }}</div>
+            </div>
+        </div>
     </div>
-</template>
\ No newline at end of file
+</template>
+
+<script>
+    export default {
+        name: 'twoFA',
+        data () { 
+            return {
+                code: { '1': '', '2': '' }
+            }
+        },
+        created () {
+            let code = sessionStorage.getItem( '2faCode' ) ? sessionStorage.getItem( '2faCode' ) : '';
+            this.code = { '1': code.slice( 0, 3 ), '2': code.substring( 3 ) };
+        },
+    }
+</script>
+
+<style scoped>
+    #twoFA, .code-container {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+    }
+    .code-container {
+        width: fit-content;
+        padding: 5% 8%;
+        border: var( --primary-color ) solid 2px;
+        border-radius: 10px;
+        margin-top: 3%;
+        background-color: var( --popup-color );
+    }
+
+    .code {
+        background-color: var( --hover-color );
+        padding: 7% 10%;
+        margin-bottom: 0;
+        width: fit-content;
+        border-radius: 10px;
+        font-size: 200%;
+        font-family: monospace;
+        display: block;
+    }
+
+    .code-sub {
+        display: inline-block;
+    }
+
+    #code-part2 {
+        margin-left: 7px;
+    }
+</style>
\ No newline at end of file