diff --git a/src/components/Sidebar.astro b/src/components/Sidebar.astro
index 5ce33ca..3a89349 100644
--- a/src/components/Sidebar.astro
+++ b/src/components/Sidebar.astro
@@ -3,19 +3,13 @@
 ---
 
 <aside class="w-64 border-r h-full p-4 text-gray-100">
-  <h2 class="text-lg font-semibold mb-4">Prompt Types</h2>
+  <h2 class="text-lg font-semibold mb-4">Add a prompt</h2>
 
-  <ul class="space-y-2">
-    <li>
-      <button class="w-full text-left bg-blue-100 text-blue-700 px-3 py-2 rounded hover:bg-blue-200">
-        System
-      </button>
-    </li>
+  <p class="text-sm mb-4">
+    Use the form to add a new AI prompt to the catalog.
 
-    <li>
-      <button class="w-full text-left bg-green-100 text-green-700 px-3 py-2 rounded hover:bg-green-200">
-        Task
-      </button>
-    </li>
-  </ul>
+    Make sure to include a title, type, description, and any relevant tags.
+
+    You can also add notes for your own reference.
+  </p>
 </aside>
diff --git a/src/pages/add.astro b/src/pages/add.astro
index fa02752..672f32b 100644
--- a/src/pages/add.astro
+++ b/src/pages/add.astro
@@ -1,5 +1,6 @@
 ---
 import "../styles/global.css";
+import Sidebar from "../components/Sidebar.astro";
 
 const supabaseUrl = import.meta.env.PUBLIC_SUPABASE_URL;
 const supabaseKey = import.meta.env.PUBLIC_SUPABASE_ANON_KEY;
@@ -7,7 +8,7 @@ const supabaseKey = import.meta.env.PUBLIC_SUPABASE_ANON_KEY;
 
 <html>
   <head>
-    <title>Add Prompt</title>
+    <title>Prompt Catalog - Add New Prompt</title>
   </head>
 
   <body class="font-sans antialiased bg-gray-800 text-gray-100">
@@ -18,52 +19,60 @@ const supabaseKey = import.meta.env.PUBLIC_SUPABASE_ANON_KEY;
       hidden
     ></div>
 
-    <h1 class="text-2xl font-bold mb-4">Add New Prompt</h1>
-
-    <div id="success" class="bg-green-100 text-green-700 p-4 rounded mb-4 hidden">
-      Prompt added successfully!
+    <div class="border-b p-4">
+      <h1 class="text-2xl font-bold">Prompt Catalog - Add New Prompt</h1>
+      <p class="text-sm mt-1">Add a new AI prompt to the catalog</p>
     </div>
-    <div id="error" class="bg-red-100 text-red-700 p-4 rounded mb-4 hidden"></div>
 
-    <form id="add-form" class="space-y-4">
-      <div>
-        <label for="title" class="block font-medium">Title</label>
-        <input name="title" id="title" required class="border p-2 w-full rounded" />
-        <input type="hidden" name="slug" id="slug" />
+    <div class="flex h-screen">
+      <Sidebar />
+
+      <div class="flex-1 flex flex-col overflow-hidden">
+        <main class="flex-1 overflow-y-auto p-4">
+          <div id="success" class="bg-green-100 text-green-700 p-4 rounded mb-4 hidden">
+            Prompt added successfully!
+          </div>
+          <div id="error" class="bg-red-100 text-red-700 p-4 rounded mb-4 hidden"></div>
+
+          <form id="add-form" class="space-y-4">
+            <div>
+              <label for="title" class="block font-medium">Title</label>
+              <input name="title" id="title" required class="border p-2 w-full rounded" />
+              <input type="hidden" name="slug" id="slug" />
+            </div>
+
+            <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
+              <div>
+                <label for="type" class="block font-medium">Type</label>
+                <select name="type" id="type" required class="border border-gray-100 p-2 rounded w-full bg-gray-800">
+                  <option value="System">System</option>
+                  <option value="Task">Task</option>
+                </select>
+              </div>
+
+              <div>
+                <label for="tags" class="block font-medium">Tags (comma-separated)</label>
+                <input name="tags" id="tags" class="border p-2 pt-1 w-full rounded" />
+              </div>
+            </div>
+
+            <div>
+              <label for="description" class="block font-medium">Description</label>
+              <textarea name="description" id="description" rows="2" required class="border p-2 w-full rounded"></textarea>
+            </div>
+
+            <div>
+              <label for="notes" class="block font-medium">Notes</label>
+              <textarea name="notes" id="notes" rows="3" class="border p-2 w-full rounded"></textarea>
+            </div>
+
+            <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded">
+              Add Prompt
+            </button>
+          </form>
+        </main>
       </div>
-
-      <!-- <div>
-        <label for="slug" class="block font-medium">Slug</label>
-        <input name="slug" id="slug" required class="border p-2 w-full rounded" />
-      </div> -->
-
-      <div>
-        <label for="type" class="block font-medium">Type</label>
-        <select name="type" id="type" required class="border border-gray-100 p-2 rounded w-full bg-gray-800">
-          <option value="System">System</option>
-          <option value="Task">Task</option>
-        </select>
-      </div>
-
-      <div>
-        <label for="description" class="block font-medium">Description</label>
-        <textarea name="description" id="description" rows="2" required class="border p-2 w-full rounded"></textarea>
-      </div>
-
-      <div>
-        <label for="tags" class="block font-medium">Tags (comma-separated)</label>
-        <input name="tags" id="tags" class="border p-2 w-full rounded" />
-      </div>
-
-      <div>
-        <label for="notes" class="block font-medium">Notes</label>
-        <textarea name="notes" id="notes" rows="3" class="border p-2 w-full rounded"></textarea>
-      </div>
-
-      <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded">
-        Add Prompt
-      </button>
-    </form>
+    </div>
 
     <script type="module">
       import { createClient } from 'https://cdn.jsdelivr.net/npm/@supabase/supabase-js/+esm';
