diff --git a/package-lock.json b/package-lock.json
index 4bd7d0a..724c13e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -394,9 +394,9 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.0.tgz",
-      "integrity": "sha512-aP8x5pIw3xvYr/sXT+SEUwyhrXT8rUJRZltK/qN3Db80dcKpTett8cJxHyjk+xYSVXvNnl2SfcJVjbwxpOSscA==",
+      "version": "7.26.1",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.1.tgz",
+      "integrity": "sha512-reoQYNiAJreZNsJzyrDNzFQ+IQ5JFiIzAHJg9bn94S3l+4++J7RsIhNMoB+lgP/9tpmiAQqspv+xfdxTSzREOw==",
       "license": "MIT",
       "dependencies": {
         "@babel/types": "^7.26.0"
@@ -985,25 +985,28 @@
       }
     },
     "node_modules/@eslint-community/eslint-utils": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
-      "integrity": "sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==",
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.1.tgz",
+      "integrity": "sha512-s3O3waFUrMV8P/XaF/+ZTp1X9XBZW1a4B97ZnjQF2KYWaFD2A8KyFBsrsfSjEmjn3RGWAIuvlneuZm3CUK3jbA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "eslint-visitor-keys": "^3.3.0"
+        "eslint-visitor-keys": "^3.4.3"
       },
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
       "peerDependencies": {
         "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
       }
     },
     "node_modules/@eslint-community/regexpp": {
-      "version": "4.11.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.11.1.tgz",
-      "integrity": "sha512-m4DVN9ZqskZoLU5GlWZadwDnYo3vAEydiUayB9widCl9ffWx2IvPnp6n3on5rJmziJSw9Bv+Z3ChDVdMwXCY8Q==",
+      "version": "4.11.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.11.2.tgz",
+      "integrity": "sha512-2WwyTYNVaMNUWPZTOJdkax9iqTdirrApgTbk+Qoq5EPX6myqZvG8QGFRgdKmkjKVG6/G/a565vpPauHk0+hpBA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -3092,9 +3095,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001669",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001669.tgz",
-      "integrity": "sha512-DlWzFDJqstqtIVx1zeSpIMLjunf5SmwOw0N2Ck/QSQdS8PLS4+9HrLaYei4w8BIAL7IB/UEDu889d8vhCTPA0w==",
+      "version": "1.0.30001672",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001672.tgz",
+      "integrity": "sha512-XhW1vRo1ob6aeK2w3rTohwTPBLse/rvjq+s3RTSBwnlZqoFFjx9cHsShJjAIbLsLjyoacaTxpLZy9v3gg6zypw==",
       "dev": true,
       "funding": [
         {
@@ -3554,9 +3557,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.46",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.46.tgz",
-      "integrity": "sha512-1XDk0Z8/YRgB2t5GeEg8DPK592DLjVmd/5uwAu6c/S4Z0CUwV/RwYqe5GWxQqcoN3bJ5U7hYMiMRPZzpCzSBhQ==",
+      "version": "1.5.47",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.47.tgz",
+      "integrity": "sha512-zS5Yer0MOYw4rtK2iq43cJagHZ8sXN0jDHDKzB+86gSBSAI4v07S97mcq+Gs2vclAxSh1j7vOAHxSVgduiiuVQ==",
       "dev": true,
       "license": "ISC"
     },
@@ -7386,9 +7389,9 @@
       }
     },
     "node_modules/vue-component-type-helpers": {
-      "version": "2.1.6",
-      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.1.6.tgz",
-      "integrity": "sha512-ng11B8B/ZADUMMOsRbqv0arc442q7lifSubD0v8oDXIFoMg/mXwAPUunrroIDkY+mcD0dHKccdaznSVp8EoX3w==",
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.1.8.tgz",
+      "integrity": "sha512-ii36gDzrYAfOQIkOlo44yceDdT5269gKmNGxf07Qx6seH2U50+tQ2ol02XLhYPmxrh6YabAsOdte8WDrpaO6Tw==",
       "dev": true,
       "license": "MIT"
     },
diff --git a/src/screens/Login.vue b/src/screens/Login.vue
index eeea467..6c13e26 100644
--- a/src/screens/Login.vue
+++ b/src/screens/Login.vue
@@ -40,6 +40,7 @@
             <div class="flex flex-col gap-5 p-2 mb-8 relative">
               <div class="w-full grid gap-3 relative">
                 <input class="input-field xs:min-w-[350px] min-w-64" id="username-register" v-model="username" type="text" name="username" placeholder="Username" required autofocus />
+                <input class="input-field xs:min-w-[350px] min-w-64" id="email-register" v-model="email" type="email" name="email" placeholder="Email" required />
                 <div class="relative">
                   <input class="input-field xs:min-w-[350px] min-w-64" id="password-register" v-model="password" :type="showPassword ? 'text' : 'password'" name="password" placeholder="Password" required />
                   <button type="button" @click.prevent="showPassword = !showPassword" :class="{ 'eye-open': showPassword }" class="bg-[url('/assets/icons/eye.svg')] p-0 absolute right-3 w-4 h-3 top-1/2 -translate-y-1/2 bg-no-repeat"></button>
@@ -74,6 +75,7 @@ import { useCookies } from '@vueuse/integrations/useCookies'
 const gameStore = useGameStore()
 const username = ref('')
 const password = ref('')
+const email = ref('')
 const switchForm = ref('login')
 const loginError = ref('')
 const showPassword = ref(false)
@@ -108,13 +110,13 @@ async function loginFunc() {
 
 async function registerFunc() {
   // check if username and password are valid
-  if (username.value === '' || password.value === '') {
-    loginError.value = 'Please enter a valid username and password'
+  if (username.value === '' || email.value === '' || password.value === '') {
+    loginError.value = 'Please enter a valid username, email, and password'
     return
   }
 
   // send register event to server
-  const response = await register(username.value, password.value)
+  const response = await register(username.value, email.value, password.value)
 
   if (response.success === undefined) {
     loginError.value = response.error
diff --git a/src/services/authentication.ts b/src/services/authentication.ts
index 4ccb044..5d952e2 100644
--- a/src/services/authentication.ts
+++ b/src/services/authentication.ts
@@ -2,9 +2,9 @@ import axios from 'axios'
 import config from '@/config'
 import { useCookies } from '@vueuse/integrations/useCookies'
 
-export async function register(username: string, password: string) {
+export async function register(username: string, email: string, password: string) {
   try {
-    const response = await axios.post(`${config.server_endpoint}/register`, { username, password })
+    const response = await axios.post(`${config.server_endpoint}/register`, { username, email, password })
     useCookies().set('token', response.data.token as string)
     return { success: true, token: response.data.token }
   } catch (error: any) {