diff --git a/public/linkedInIcon.webp b/public/linkedInIcon.webp
new file mode 100644
index 0000000..70e451f
Binary files /dev/null and b/public/linkedInIcon.webp differ
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index b30b25f..25977cd 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -3,6 +3,7 @@ import { Roboto } from "next/font/google";
 import { ReactQueryClientProvider } from "@/utils/react-query";
 import { AuthProvider } from "@/contexts/AuthContext";
 import NavBar from "@/components/NavBar";
+import Footer from "@/components/Footer";
 
 const roboto = Roboto({
   subsets: ["latin"],
@@ -26,6 +27,7 @@ export default function RootLayout({ children }: LayoutProps) {
         <AuthProvider>
           <NavBar />
           <ReactQueryClientProvider>{children}</ReactQueryClientProvider>
+          <Footer />
         </AuthProvider>
       </body>
     </html>
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
new file mode 100644
index 0000000..f443101
--- /dev/null
+++ b/src/components/Footer.tsx
@@ -0,0 +1,28 @@
+import Link from "next/link";
+import Image from "next/image";
+import chefHatIcon from "@/public/chefHatIcon.webp";
+import linkedInIcon from "@/public/linkedInIcon.webp";
+
+const Footer = () => {
+  return (
+    <div className="flow-row bg-cookcraft-white border-cookcraft-olive flex items-center justify-between border-t-3">
+      <div className="text-cookcraft-olive flex items-center p-5 text-lg">
+        <Image src={chefHatIcon} alt="Chef Hat Icon" className="mr-4" />
+        2025 CookCraft ©
+      </div>
+
+      <div>
+        <Link href="https://linktr.ee/yubinzhen" target="_blank">
+          <Image
+            src={linkedInIcon}
+            alt="LinkedIn Icon"
+            width={60}
+            className="mr-3"
+          />
+        </Link>
+      </div>
+    </div>
+  );
+};
+
+export default Footer;
diff --git a/src/data/RecipeList.ts b/src/data/RecipeList.ts
new file mode 100644
index 0000000..6855291
--- /dev/null
+++ b/src/data/RecipeList.ts
@@ -0,0 +1,24 @@
+export interface recipes {
+  name: string;
+  ingrediants: string;
+}
+
+const recipes: recipes[] = [
+  {
+    name: "Chicken Bowl",
+    ingrediants:
+      "- 8oz Ground Chicken \n- 4oz Lettuce \n- 1tbsp Garlic Powder \n- ...",
+  },
+  {
+    name: "Chicken Bowl",
+    ingrediants:
+      "- 8oz Ground Chicken \n- 4oz Lettuce \n- 1tbsp Garlic Powder \n- ...",
+  },
+  {
+    name: "Chicken Bowl",
+    ingrediants:
+      "- 8oz Ground Chicken \n- 4oz Lettuce \n- 1tbsp Garlic Powder \n- ...",
+  },
+];
+
+export default recipes;