diff --git a/client/components/global/Navbar.vue b/client/components/global/Navbar.vue
index 0cab4092..5bb2fcec 100644
--- a/client/components/global/Navbar.vue
+++ b/client/components/global/Navbar.vue
@@ -21,8 +21,7 @@
           </NuxtLink>
           <workspace-dropdown class="ml-6" />
         </div>
-        <div
-          v-if="showAuth"
+        <div 
           class="hidden md:flex gap-x-2 ml-auto"
         >
           <NuxtLink
@@ -86,11 +85,9 @@
           </NuxtLink>
         </div>
         <div
-          v-if="showAuth"
           class="hidden md:block pl-5 border-gray-300 border-r h-5"
         />
         <div
-          v-if="showAuth"
           class="block"
         >
           <div class="flex items-center">
@@ -316,20 +313,15 @@ export default {
     workspace() {
       return this.workspacesStore.getCurrent
     },
-    showAuth() {
-      return this.$route.name && this.$route.name !== "forms-slug"
-    },
     hasNavbar() {
       if (this.isIframe) return false
 
       if (this.$route.name && this.$route.name === "forms-slug") {
         if (this.form) {
-          // If there is a cover, or if branding is hidden remove nav
-          if (this.form.cover_picture || this.form.no_branding) {
-            return false
-          }
-        } else {
           return false
+        } else {
+          // Form not found/404 case - show the navbar
+          return true
         }
       }
       return !this.appStore.navbarHidden
diff --git a/client/components/pages/NotFoundForm.vue b/client/components/pages/NotFoundForm.vue
new file mode 100644
index 00000000..7763cb80
--- /dev/null
+++ b/client/components/pages/NotFoundForm.vue
@@ -0,0 +1,109 @@
+<template>
+  <main class="flex justify-center items-center px-16 w-full max-md:px-5 max-md:max-w-full">
+    <section class="flex flex-col mb-4 w-full max-w-[1080px] max-md:mt-10 max-md:max-w-full">
+      <div class="text-center mx-auto">
+        <img
+          src="/img/icons/404.png"
+          alt="404 Error"
+          class="mx-auto w-1/3"
+        >
+        <h1 class="text-dark text-2xl md:text-4xl leading-none font-medium text-center pt-4 md:pt-0 mx-auto md:max-w-full">
+          We're sorry! This Form Is No Longer Here
+        </h1>
+        <p class="text-gray-500 mt-3 max-w-xl mx-auto">
+          It may have been deleted, deactivated, or the form URL might have been regenerated or updated by its owner. But don't worry—you've got plenty of other options!
+        </p>
+        
+        <h3 class="my-8 text-dark text-xl font-semibold text-center md:pt-0 mx-auto md:max-w-full">
+          What can you do?
+        </h3>
+        <div class="mt-8 grid grid-cols-2 md:grid-cols-5 gap-4">
+          <NuxtLink
+            v-for="(action, index) in actions"
+            :key="index"
+            :to="action.to"
+            :href="action.href"
+            class="bg-blue-100/50 rounded-lg px-4 py-6 text-center text-gray-700 hover:bg-blue-100 flex flex-col items-center hover:no-underline"
+            @click="action.onClick ? action.onClick() : null"
+          >
+            <Icon
+              :name="action.icon"
+              class="w-8 h-8 mb-2 text-nt-blue"
+            />
+            <span class="font-medium">
+              {{ action.text }}
+            </span>
+          </NuxtLink>
+        </div>
+        
+        <div class="mt-10 text-gray-700">
+          <h3 class="mt-8 text-dark text-xl font-semibold text-center md:pt-0 mx-auto md:max-w-full">
+            Still not sure what to do? Here are more ways to get started!
+          </h3>
+          <p class="mt-4 text-gray-500">
+            No worries! Here are some other options for you:
+          </p>
+          <ul class="mt-4 space-y-2 text-sm">
+            <li>
+              Do you want to know why users choose OpnForm? 
+              <NuxtLink class="text-blue-500 hover:text-blue-600" :to="{ name: 'ai-form-builder' }">
+                Learn more here!
+              </NuxtLink>
+            </li>
+            <li>
+              Browse Templates
+              <NuxtLink class="text-blue-500 hover:text-blue-600" :to="{ name: 'templates' }">
+                Get inspired with ready-to-use form templates!
+              </NuxtLink>
+            </li>
+            <li>
+              Check Out Our Help Center
+              <NuxtLink class="text-blue-500 hover:text-blue-600" to="https://help.opnform.com/en/">
+                Find quick answers to common questions.
+              </NuxtLink>
+            </li>
+          </ul>
+        </div>
+      </div>
+
+      <div class="mt-20 border-t">
+        <OpenFormFooter />
+      </div>
+      
+    </section>
+  </main>
+</template>
+
+<script setup>
+const crisp = useCrisp()
+
+const actions = [
+  {
+    to: { name: 'forms-create-guest' },
+    icon: 'i-heroicons-rocket-launch',
+    text: 'Create Form'
+  },
+  {
+    to: { name: 'login' },
+    icon: 'i-heroicons-list-bullet',
+    text: 'Find Your Forms'
+  },
+  {
+    href: '#',
+    icon: 'i-heroicons-book-open',
+    text: 'Documentation',
+    onClick: () => crisp.openHelpdesk()
+  },
+  {
+    to: { name: 'index' },
+    icon: 'i-heroicons-document-magnifying-glass',
+    text: 'Explore OpnForm'
+  },
+  {
+    href: '#',
+    icon: 'i-heroicons-chat-bubble-left-right',
+    text: 'Need Assistance?',
+    onClick: () => crisp.openChat()
+  }
+]
+</script>
diff --git a/client/pages/forms/[slug]/index.vue b/client/pages/forms/[slug]/index.vue
index 4fd72227..7ea13720 100644
--- a/client/pages/forms/[slug]/index.vue
+++ b/client/pages/forms/[slug]/index.vue
@@ -35,18 +35,7 @@
       :class="{'mt-6':!isIframe, 'md:w-3/5 lg:w-1/2 md:max-w-2xl': form && (form.width === 'centered'), 'max-w-7xl': (form && form.width === 'full' && !isIframe)}"
     >
       <div v-if="!formLoading && !form">
-        <h1
-          class="mt-6"
-          v-text="'Whoops'"
-        />
-        <p class="mt-6">
-          Unfortunately we could not find this form. It may have been deleted.
-        </p>
-        <p class="mb-10 mt-4">
-          <router-link :to="{name:'index'}">
-            Create your form for free with OpnForm
-          </router-link>
-        </p>
+        <NotFoundForm />
       </div>
       <div v-else-if="formLoading">
         <p class="text-center mt-6 p-4">
@@ -115,12 +104,14 @@ const passwordEntered = function (password) {
 
 const loadForm = async (setup=false) => {
   if (formsStore.loading || (form.value && !form.value.is_password_protected)) return Promise.resolve()
+  const event = useRequestEvent()
 
   if (setup) {
     const {data, error} = await formsStore.publicLoad(slug)
     if (error.value) {
       console.error(`Error loading form [${slug}]:`,error.value)
       formsStore.stopLoading()
+      setResponseStatus(event, 404, 'Page Not Found')
       return
     }
     formsStore.save(data.value)
@@ -130,6 +121,7 @@ const loadForm = async (setup=false) => {
       formsStore.save(data)
     } catch (e) {
       formsStore.stopLoading()
+      setResponseStatus(event, 404, 'Page Not Found')
       return
     }
   }
diff --git a/client/public/img/icons/404.png b/client/public/img/icons/404.png
new file mode 100644
index 00000000..992c8de4
Binary files /dev/null and b/client/public/img/icons/404.png differ