diff --git a/apps/frontend/src/App.tsx b/apps/frontend/src/App.tsx
index 4702118..fa624aa 100644
--- a/apps/frontend/src/App.tsx
+++ b/apps/frontend/src/App.tsx
@@ -7,6 +7,7 @@ import Register from "./components/auth/Register";
 import ForgotPassword from "./components/auth/Forgot-Password";
 import OTP from "./components/auth/OTP";
 import { ThemeProvider } from "./context/ThemeCOntext";
+import Footer from "./components/Footer";
 
 
 function App() {
@@ -28,6 +29,7 @@ function App() {
 
         </Routes>
       </ThemeProvider>
+      <Footer/>
     </>
   );
 }
diff --git a/apps/frontend/src/components/Footer.tsx b/apps/frontend/src/components/Footer.tsx
new file mode 100644
index 0000000..167dd2b
--- /dev/null
+++ b/apps/frontend/src/components/Footer.tsx
@@ -0,0 +1,56 @@
+
+import logo from "../assets/Unite__Logo.png";
+import { Link } from "react-router-dom";
+function Footer() {
+  return (
+    <div className="w-full bg-slate-50 dark:bg-grid-white/[0.2] bg-grid-black/[0.2] relative flex items-center justify-center pb-10">
+      <footer className="bg-transparent rounded-lg  m-4 mx-auto w-[80%] z-10">
+        <div className="w-full max-w-screen-xl mx-auhref p-4 md:py-8">
+          <div className="sm:flex sm:items-center sm:justify-between">
+            <Link
+              to="/"
+              className="flex items-center mb-4 sm:mb-0 space-x-3 rtl:space-x-reverse"
+            >
+              <img src={logo} height={50} width={50} alt="logo" />
+              <h2 className={`text-2xl font-bold`}>
+                  UNITE
+              </h2>
+            </Link>
+            <ul className="flex flex-wrap items-center mb-6 text-sm font-medium text-black sm:mb-0 ">
+              <li>
+                <Link to="/" className="hover:underline me-4 md:me-6">
+                  Home
+                </Link>
+              </li>
+              <li>
+                <Link
+                  to="/"
+                  className="hover:underline me-4 md:me-6"
+                >
+                  Service
+                </Link>
+              </li>
+              <li>
+                <Link
+                  to="/"
+                  className="hover:underline me-4 md:me-6"
+                >
+                  Contact
+                </Link>
+              </li>
+            </ul>
+          </div>
+          <hr className="my-6 border-gray-400 sm:mx-auhref  lg:my-8" />
+          <span className="block text-sm text-black sm:text-center ">
+            © Design And Devloped By{" "}
+            <Link to="/" className="hover:underline">
+              Bug_Busters™
+            </Link>
+          </span>
+        </div>
+      </footer>
+    </div>
+  );
+}
+
+export default Footer;
\ No newline at end of file
diff --git a/package.json b/package.json
index 2d6bb3e..3ff7126 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,9 @@
     "node": ">=18"
   },
   "dependencies": {
-    "lucide-react": "^0.408.0"
+    "@types/react": "^18.3.3",
+    "lucide-react": "^0.408.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
   }
 }