diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index ae737421..53d64c63 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -7,5 +7,5 @@
 
 <script setup>
 import DesktopLayout from '@/components/DesktopLayout.vue'
-import { sessionStore as session } from '@/stores/session';
+import { sessionStore as session } from '@/stores/session'
 </script>
diff --git a/frontend/src/pages/InvalidPage.vue b/frontend/src/pages/InvalidPage.vue
new file mode 100644
index 00000000..cd1a780c
--- /dev/null
+++ b/frontend/src/pages/InvalidPage.vue
@@ -0,0 +1,17 @@
+<template>
+  <div
+    class="grid h-full place-items-center px-4 py-20 text-center text-lg text-gray-600"
+  >
+    <div class="space-y-2">
+      <div>Invalid page or not permitted to access</div>
+      <Button :route="{ name: 'Leads' }">
+        <template #prefix><LeadsIcon class="w-4" /></template>
+        Leads
+      </Button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import LeadsIcon from '@/components/Icons/LeadsIcon.vue'
+</script>
diff --git a/frontend/src/router.js b/frontend/src/router.js
index a78ca2b1..18933e4d 100644
--- a/frontend/src/router.js
+++ b/frontend/src/router.js
@@ -26,6 +26,11 @@ const routes = [
     name: 'Dashboard',
     component: () => import('@/pages/Dashboard.vue'),
   },
+  {
+    path: '/:invalidpath',
+    name: 'Invalid Page',
+    component: () => import('@/pages/InvalidPage.vue'),
+  },
   {
     path: '/login',
     name: 'Login',
@@ -48,6 +53,8 @@ router.beforeEach(async (to, from, next) => {
     next({ name: 'Leads' })
   } else if (to.name !== 'Login' && !session.isLoggedIn) {
     next({ name: 'Login' })
+  } else if (to.matched.length === 0) {
+    next({ name: 'Invalid Page' })
   } else {
     next()
   }