diff --git a/apps/frontend/src/App.tsx b/apps/frontend/src/App.tsx
index fa624aa..40b181f 100644
--- a/apps/frontend/src/App.tsx
+++ b/apps/frontend/src/App.tsx
@@ -8,6 +8,7 @@ import ForgotPassword from "./components/auth/Forgot-Password";
import OTP from "./components/auth/OTP";
import { ThemeProvider } from "./context/ThemeCOntext";
import Footer from "./components/Footer";
+import Contact from "./components/Contact";
function App() {
@@ -25,7 +26,7 @@ function App() {
} />
} />
} />
-
+ } />
diff --git a/apps/frontend/src/assets/contact-us-animate (1).svg b/apps/frontend/src/assets/contact-us-animate (1).svg
new file mode 100644
index 0000000..58922a3
--- /dev/null
+++ b/apps/frontend/src/assets/contact-us-animate (1).svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/apps/frontend/src/components/Contact.tsx b/apps/frontend/src/components/Contact.tsx
new file mode 100644
index 0000000..99331a1
--- /dev/null
+++ b/apps/frontend/src/components/Contact.tsx
@@ -0,0 +1,87 @@
+import { useState } from "react";
+import req_img from "../assets/contact-us-animate (1).svg";
+
+
+export default function Contact(): JSX.Element {
+ const [email, setEmail] = useState("");
+ const [name, setName] = useState("");
+ const [phonenumber, setPhonenumber] = useState("");
+
+ const handleNameChange = (event: React.ChangeEvent) => {
+ setName(event.target.value);
+ };
+ const handleEmailChange = (event: React.ChangeEvent) => {
+ setEmail(event.target.value);
+ };
+
+ const handlePhonenumberChange = (event: React.ChangeEvent) => {
+ setPhonenumber(event.target.value);
+ };
+
+ const handleClick = async (event: React.FormEvent) => {
+ event.preventDefault();
+ };
+
+ return (
+
+
+
+
+
+
+
+
+