diff --git a/servers/nextjs/app/(presentation-generator)/custom-template/page.tsx b/servers/nextjs/app/(presentation-generator)/custom-template/page.tsx
index 63dc95f1..81793fe3 100644
--- a/servers/nextjs/app/(presentation-generator)/custom-template/page.tsx
+++ b/servers/nextjs/app/(presentation-generator)/custom-template/page.tsx
@@ -2,7 +2,7 @@
 
 import React from "react";
 import FontManager from "./components/FontManager";
-import Header from "@/components/Header";
+import Header from "../dashboard/components/Header";
 import { useLayout } from "../context/LayoutContext";
 import { useCustomLayout } from "./hooks/useCustomLayout";
 import { useFontManagement } from "./hooks/useFontManagement";
@@ -78,8 +78,13 @@ const CustomLayoutPage = () => {
           </h1>
           <p className="text-lg text-gray-600 max-w-2xl mx-auto">
             Upload your PPTX file to extract slides and convert them to
-            interactive HTML layouts
+            template which then can be used to generate AI presentations.
           </p>
+          <div className="max-w-2xl mx-auto mt-2">
+            <div className="inline-block rounded border border-orange-200 bg-orange-50 px-3 py-2 text-sm text-orange-700">
+              AI template generation can take around 5 minutes per slide.
+            </div>
+          </div>
         </div>
        
 
diff --git a/servers/nextjs/app/(presentation-generator)/dashboard/components/Header.tsx b/servers/nextjs/app/(presentation-generator)/dashboard/components/Header.tsx
index c6b1a507..3708a494 100644
--- a/servers/nextjs/app/(presentation-generator)/dashboard/components/Header.tsx
+++ b/servers/nextjs/app/(presentation-generator)/dashboard/components/Header.tsx
@@ -6,7 +6,7 @@ import Link from "next/link";
 import BackBtn from "@/components/BackBtn";
 import { usePathname } from "next/navigation";
 import HeaderNav from "@/app/(presentation-generator)/components/HeaderNab";
-import { Layout } from "lucide-react";
+import { Layout, FilePlus2 } from "lucide-react";
 const Header = () => {
   const pathname = usePathname();
   return (
@@ -24,6 +24,15 @@ const Header = () => {
             </Link>
           </div>
           <div className="flex items-center gap-3">
+            <Link
+              href="/custom-template"
+              prefetch={false}
+              className="flex items-center gap-2 px-3 py-2 text-white hover:bg-primary/80 rounded-md transition-colors outline-none"
+              role="menuitem"
+            >
+              <FilePlus2 className="w-5 h-5" />
+              <span className="text-sm font-medium font-inter">Create Template</span>
+            </Link>
             <Link
               href="/template-preview"
               prefetch={false}
diff --git a/servers/nextjs/components/Header.tsx b/servers/nextjs/components/Header.tsx
index ea324d3a..947e51ab 100644
--- a/servers/nextjs/components/Header.tsx
+++ b/servers/nextjs/components/Header.tsx
@@ -2,7 +2,7 @@
 
 import React from "react";
 import Link from "next/link";
-import { Layout } from "lucide-react";
+import { Layout, Plus } from "lucide-react";
 
 const Header: React.FC = () => {
   return (
@@ -14,6 +14,10 @@ const Header: React.FC = () => {
           </Link>
 
           <nav className="flex items-center gap-4">
+            <Link href="/custom-layout" className="inline-flex items-center gap-2 text-gray-700 hover:text-gray-900">
+              <Plus className="w-5 h-5" />
+              <span className="text-sm font-medium font-inter">Create Template</span>
+            </Link>
             <Link href="/template-preview" className="inline-flex items-center gap-2 text-gray-700 hover:text-gray-900">
               <Layout className="w-5 h-5" />
               <span className="text-sm font-medium font-inter">Templates</span>