diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index d64d546..8cf0e58 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -28,6 +28,7 @@ export default function AboutPage() {
         { name: "Home", id: "/" },
         { name: "About", id: "/about" },
         { name: "Products", id: "/products" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Tess's Kitchen"
     />
@@ -51,7 +52,7 @@ export default function AboutPage() {
       tag="Ready to order?"
       title="Order for your next handaan!"
       description="Send us a message to reserve your favorite treats for your upcoming celebrations."
-      buttons={[{ text: "Contact Us", href: "#" }]}
+      buttons={[{ text: "Contact Us", href: "/contact" }]}
     />
   </div>
 
@@ -63,6 +64,7 @@ export default function AboutPage() {
             { label: "Home", href: "/" },
             { label: "About", href: "/about" },
             { label: "Products", href: "/products" },
+            { label: "Contact", href: "/contact" },
           ],
         },
         {
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
new file mode 100644
index 0000000..aee44a5
--- /dev/null
+++ b/src/app/contact/page.tsx
@@ -0,0 +1,70 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+
+export default function ContactPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="icon-arrow"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="small"
+        sizing="mediumLarge"
+        background="grid"
+        cardStyle="glass-depth"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+  <div id="nav" data-section="nav">
+      <NavbarStyleApple
+      navItems={[
+        { name: "Home", id: "/" },
+        { name: "About", id: "/about" },
+        { name: "Products", id: "/products" },
+        { name: "Contact", id: "/contact" },
+      ]}
+      brandName="Tess's Kitchen"
+    />
+  </div>
+
+  <div id="contact" data-section="contact" className="py-20">
+      <ContactCenter
+      tag="Contact Us"
+      title="Get in Touch"
+      description="Send us a message and we'll get back to you shortly regarding your orders and inquiries."
+      background={{ variant: "radial-gradient" }}
+    />
+  </div>
+
+  <div id="footer" data-section="footer">
+      <FooterSimple
+      columns={[
+        {
+          title: "Tess's Kitchen",          items: [
+            { label: "Home", href: "/" },
+            { label: "About", href: "/about" },
+            { label: "Products", href: "/products" },
+            { label: "Contact", href: "/contact" },
+          ],
+        },
+        {
+          title: "Follow Us",          items: [
+            { label: "Facebook", href: "#" },
+            { label: "Instagram", href: "#" },
+          ],
+        },
+      ]}
+      bottomLeftText="© 2024 Tess's Kitchen"
+      bottomRightText="All rights reserved."
+    />
+  </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 97ca5a1..53e815f 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -29,6 +29,7 @@ export default function LandingPage() {
         { name: "Home", id: "/" },
         { name: "About", id: "/about" },
         { name: "Products", id: "/products" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Tess's Kitchen"
     />
@@ -54,7 +55,7 @@ export default function LandingPage() {
         { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdPJRqIgg8ngXJ9CfoPA8RvgIz/uploaded-1775586294245-nz1ypegd.jpg", imageAlt: "Ube cake 2" },
       ]}
       buttons={[
-        { text: "Order Now", href: "#" },
+        { text: "Order Now", href: "/contact" },
         { text: "View Products", href: "/products" },
       ]}
       avatars={[
@@ -119,6 +120,7 @@ export default function LandingPage() {
             { label: "Home", href: "/" },
             { label: "About", href: "/about" },
             { label: "Products", href: "/products" },
+            { label: "Contact", href: "/contact" },
           ],
         },
         {
diff --git a/src/app/products/page.tsx b/src/app/products/page.tsx
index 2c91268..4b81b87 100644
--- a/src/app/products/page.tsx
+++ b/src/app/products/page.tsx
@@ -27,6 +27,7 @@ export default function ProductsPage() {
         { name: "Home", id: "/" },
         { name: "About", id: "/about" },
         { name: "Products", id: "/products" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Tess's Kitchen"
     />
@@ -59,6 +60,7 @@ export default function ProductsPage() {
             { label: "Home", href: "/" },
             { label: "About", href: "/about" },
             { label: "Products", href: "/products" },
+            { label: "Contact", href: "/contact" },
           ],
         },
         {