diff --git a/src/app/todos/new/page.tsx b/src/app/todos/new/page.tsx
new file mode 100644
index 0000000..15efee9
--- /dev/null
+++ b/src/app/todos/new/page.tsx
@@ -0,0 +1,11 @@
+// src/app/todos/new/page.tsx
+import AddTodoForm from "@/components/AddTodoForm";
+
+export default function AddTodoPage() {
+  return (
+    <div>
+      <h1>Add New Todo</h1>
+      <AddTodoForm />
+    </div>
+  );
+}
\ No newline at end of file
diff --git a/src/components/AddTodoForm.tsx b/src/components/AddTodoForm.tsx
new file mode 100644
index 0000000..630479e
--- /dev/null
+++ b/src/components/AddTodoForm.tsx
@@ -0,0 +1,18 @@
+// src/components/AddTodoForm.tsx
+export default function AddTodoForm() {
+  return (
+    <form className="max-w-md mx-auto p-4 border border-primary-300 rounded-lg">
+      <div className="mb-4">
+        <label htmlFor="title" className="block text-white mb-2">Title</label>
+        <input type="text" id="title" name="title" className="w-full p-2 rounded bg-gray-800 text-white border border-primary-500 focus:outline-none focus:border-primary-400" />
+      </div>
+      <div className="mb-4">
+        <label htmlFor="description" className="block text-white mb-2">Description</label>
+        <textarea id="description" name="description" className="w-full p-2 rounded bg-gray-800 text-white border border-primary-500 focus:outline-none focus:border-primary-400" />
+      </div>
+      <button type="submit" className="w-full bg-primary-500 hover:bg-primary-600 text-white font-bold py-2 px-4 rounded">
+        Add Todo
+      </button>
+    </form>
+  );
+}
\ No newline at end of file