diff --git a/frontend/src/router/index.js b/frontend/src/router/index.js
index 79f3702..956bb07 100644
--- a/frontend/src/router/index.js
+++ b/frontend/src/router/index.js
@@ -104,6 +104,12 @@ const routes = [
     component: () => import("@/views/MaintenancePage.vue"),
     meta: { title: "Maintenance Mode" },
   },
+  {
+    path: "/verify-email/:token",
+    name: "MailVerify",
+    component: () => import("@/views/MailVerify.vue"),
+    meta: { title: "Verify Email" },
+  },
   {
     path: "/banned",
     name: "Banned",
diff --git a/frontend/src/views/MailVerify.vue b/frontend/src/views/MailVerify.vue
new file mode 100644
index 0000000..7bbf176
--- /dev/null
+++ b/frontend/src/views/MailVerify.vue
@@ -0,0 +1,119 @@
+<script setup>
+import { ref, onMounted } from "vue";
+import { useRouter } from "vue-router";
+import { Home, CheckCircle } from "lucide-vue-next";
+import axios from "axios";
+
+const router = useRouter();
+
+const loading = ref(true);
+const success = ref(false);
+const error = ref(false);
+const message = ref("Verifying your email...");
+
+const goHome = () => router.push("/");
+const goBack = () => router.back();
+
+onMounted(async () => {
+  const urlParams = new URLSearchParams(window.location.search);
+  const token = urlParams.get("token");
+
+  if (!token) {
+    error.value = true;
+    loading.value = false;
+    message.value = "No verification token provided.";
+    return;
+  }
+
+  try {
+    const res = await axios.get(
+      `https://api.turbotrades.dev/api/user/verify-email/${token}`
+    );
+
+    if (res.data.success) {
+      success.value = true;
+      message.value = "Email verified successfully! Redirecting to homepage...";
+
+      // Redirect after 5 seconds
+      setTimeout(() => {
+        router.push("/");
+      }, 5000);
+    } else {
+      error.value = true;
+      message.value = res.data.message || "Failed to verify email.";
+    }
+  } catch (err) {
+    error.value = true;
+    message.value =
+      err.response?.data?.message ||
+      "An error occurred while verifying your email.";
+  } finally {
+    loading.value = false;
+  }
+});
+</script>
+
+<template>
+  <div class="verify-page min-h-screen flex items-center justify-center py-12">
+    <div class="container-custom">
+      <div class="max-w-2xl mx-auto text-center">
+        <!-- Icon -->
+        <div class="relative mb-8">
+          <CheckCircle
+            v-if="success"
+            class="w-32 h-32 text-green-500 mx-auto animate-pulse-slow"
+          />
+          <div
+            v-else-if="loading"
+            class="w-32 h-32 rounded-full bg-primary-500/20 mx-auto animate-pulse"
+          ></div>
+          <div
+            v-else-if="error"
+            class="w-32 h-32 rounded-full bg-red-500/20 mx-auto animate-pulse"
+          ></div>
+        </div>
+
+        <!-- Main message -->
+        <h1
+          :class="{
+            'text-5xl font-bold': true,
+            'text-green-500': success,
+            'text-red-500': error,
+            'text-white': loading,
+          }"
+          class="mb-4"
+        >
+          {{ success ? "Success" : error ? "Error" : "Verifying..." }}
+        </h1>
+
+        <p class="text-lg text-gray-400 mb-8 max-w-md mx-auto">
+          {{ message }}
+        </p>
+
+        <!-- Actions -->
+        <div
+          class="flex flex-col sm:flex-row items-center justify-center gap-4"
+        >
+          <button @click="goHome" class="btn btn-primary btn-lg group">
+            <Home class="w-5 h-5" />
+            Go to Homepage
+          </button>
+          <button @click="goBack" class="btn btn-secondary btn-lg group">
+            Go Back
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.verify-page {
+  background: linear-gradient(
+    135deg,
+    rgba(15, 25, 35, 0.95) 0%,
+    rgba(21, 29, 40, 0.98) 50%,
+    rgba(26, 35, 50, 0.95) 100%
+  );
+}
+</style>
diff --git a/frontend/src/views/ProfilePage.vue b/frontend/src/views/ProfilePage.vue
index 495a259..f5d532e 100644
--- a/frontend/src/views/ProfilePage.vue
+++ b/frontend/src/views/ProfilePage.vue
@@ -720,7 +720,7 @@
         <form @submit.prevent="disable2FA">
           <div class="mb-4">
             <label class="block text-sm font-medium text-text-secondary mb-2">
-              Enter your 6-digit 2FA code or recovery code
+              Please enter your recovery code
             </label>
             <input
               v-model="disable2FAForm.code"