diff --git a/README.md b/README.md
index ecd5a4b..964e6d2 100644
--- a/README.md
+++ b/README.md
@@ -89,7 +89,9 @@ Ensure that `Node.js` and `MySQL` are installed on your machine.
      
      
     2.   Replace `user` and `password` from `DATABASE_URL="mysql://user:password@localhost:3306/drawn2shoe" ` with your  credential of mysql in the `.env` file.
-
+    
+    3.   Replace `yourmail@gmail.com` and `your_password` with a actual Email address and Password. Make sure your two-factor-authentication is on for this mail. This address would be used to send reset links for forgot password. (This step is only necessary if you working on forgot password else leave it as it is.)
+    
     
 <!-- 5. **Setting up the Database:**
 
diff --git a/client/package-lock.json b/client/package-lock.json
index 7976155..214a675 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -8,6 +8,7 @@
       "name": "client",
       "version": "0.0.0",
       "dependencies": {
+        "@fortawesome/fontawesome-free": "^6.6.0",
         "@reduxjs/toolkit": "^1.9.6",
         "axios": "^1.6.2",
         "hamburger-react": "^2.5.0",
@@ -19,6 +20,7 @@
         "react-razorpay": "^2.0.1",
         "react-redux": "^8.1.2",
         "react-router-dom": "^6.16.0",
+        "react-scroll": "^1.9.0",
         "redux-persist": "^6.0.0"
       },
       "devDependencies": {
@@ -831,6 +833,15 @@
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
+    "node_modules/@fortawesome/fontawesome-free": {
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.6.0.tgz",
+      "integrity": "sha512-60G28ke/sXdtS9KZCpZSHHkCbdsOGEhIUGlwq6yhY74UpTiToIh8np7A8yphhM4BWsvNFtIvLpi4co+h9Mr9Ow==",
+      "license": "(CC-BY-4.0 AND OFL-1.1 AND MIT)",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.11.11",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.11.tgz",
@@ -3315,6 +3326,12 @@
       "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
       "dev": true
     },
+    "node_modules/lodash.throttle": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
+      "integrity": "sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==",
+      "license": "MIT"
+    },
     "node_modules/loose-envify": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
@@ -4074,6 +4091,20 @@
         "react-dom": ">=16.8"
       }
     },
+    "node_modules/react-scroll": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/react-scroll/-/react-scroll-1.9.0.tgz",
+      "integrity": "sha512-mamNcaX9Ng+JeSbBu97nWwRhYvL2oba+xR2GxvyXsbDeGP+gkYIKZ+aDMMj/n20TbV9SCWm/H7nyuNTSiXA6yA==",
+      "license": "MIT",
+      "dependencies": {
+        "lodash.throttle": "^4.1.1",
+        "prop-types": "^15.7.2"
+      },
+      "peerDependencies": {
+        "react": "^15.5.4 || ^16.0.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^15.5.4 || ^16.0.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
     "node_modules/read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
diff --git a/client/src/App.jsx b/client/src/App.jsx
index 69b3d5d..81312d6 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -6,6 +6,8 @@ import Categories from "./pages/Categories/categories";
 import Customize from "./pages/Customize/customize";
 import Shop from "./pages/Shop/shop";
 import Login from "./pages/Login/login";
+import ResetPassword from "./components/Reset-Password";
+import ForgotPassword from "./components/Forgot-Password";
 import Signup from "./pages/Signup/signup";
 import Layout_retailer from "./components/layout-retailer";
 import Designer_home from "./pages/Designers";
@@ -33,6 +35,8 @@ function App() {
                     <Route path="customize" element={<Customize />} />
                     <Route path="shop" element={<Shop />} />
                     <Route path="login" element={<Login />} />
+                    <Route path="/forgot-password" element={<ForgotPassword />} />
+                    <Route path="/reset-password/:token/:id" element={<ResetPassword />} />
                     <Route path="signup" element={<Signup />} />
                     <Route path="designers" element={<Designer_home />} />
                     <Route path="about" element={<About />} />
diff --git a/client/src/components/Forgot-Password/index.jsx b/client/src/components/Forgot-Password/index.jsx
new file mode 100644
index 0000000..eecc0df
--- /dev/null
+++ b/client/src/components/Forgot-Password/index.jsx
@@ -0,0 +1,54 @@
+import React, { useState } from "react";
+import axios from "axios";
+import toast from "react-hot-toast";
+
+const ForgotPassword = () => {
+    const [email, setEmail] = useState("");
+
+    const handleSubmit = async (e) => {
+        e.preventDefault();
+        try {
+            const response = await axios.post(
+                "http://localhost:3000/api/users/forgot-password",
+                { email },
+                {
+                    headers: {
+                        "Content-Type": "application/json",
+                    }
+                }
+            );
+            toast.success(response.data.message);
+        } catch (error) {
+            toast.error(error.response.data.message);
+        }
+    };
+
+    return (
+        <div className="flex items-center justify-center min-h-screen bg-slate-100">
+            <div className="bg-white p-8 rounded-lg shadow-md w-full max-w-md">
+                <h2 className="text-3xl font-bold text-center my-4 mb-12 text-gray-600">Find Your Account</h2>
+                <form onSubmit={handleSubmit} className="space-y-6">
+                    <div className="my-3">
+                        <label className="block text-lg text-gray-400 mb-2">Enter your email below.</label>
+                        <input
+                            type="email"
+                             className="appearance-none border pl-4 border-gray-300 shadow-sm focus:shadow-md focus:placeholder-gray-600 transition rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
+                             value={email}
+                             placeholder="Email"
+                            onChange={(e) => setEmail(e.target.value)}
+                            required
+                        />
+                    </div>
+                    <button
+                        type="submit"
+                        className="w-full py-2 px-4 bg-indigo-500 text-white rounded-md hover:bg-indigo-600"
+                    >
+                        Send Reset Link
+                    </button>
+                </form>
+            </div>
+        </div>
+    );
+};
+
+export default ForgotPassword;
\ No newline at end of file
diff --git a/client/src/components/Reset-Password/index.jsx b/client/src/components/Reset-Password/index.jsx
new file mode 100644
index 0000000..7b4a21b
--- /dev/null
+++ b/client/src/components/Reset-Password/index.jsx
@@ -0,0 +1,76 @@
+import React, { useState } from "react";
+import { useParams } from "react-router-dom";
+import axios from "axios";
+import toast from "react-hot-toast";
+import { Navigate } from "react-router-dom";
+const ResetPassword = () => {
+    const { token } = useParams();
+    const { id } = useParams();
+    const [password, setPassword] = useState("");
+    const [confirmPassword, setConfirmPassword] = useState("");
+    const [reset, setreset] = useState(false);
+
+    const handleSubmit = async (e) => {
+        e.preventDefault();
+        if (password !== confirmPassword) {
+            return toast.error("Passwords do not match");
+        }
+        try {
+            const response = await axios.post(
+                `http://localhost:3000/api/users/reset-password/${token}/${id}`,
+                { password },
+                {
+                    headers: {
+                        "Content-Type": "application/json",
+                    }
+                }
+            );
+            toast.success(response.data.message);
+            setreset(true);
+        } catch (error) {
+            toast.error(error.response.data.message);
+        }
+    };
+    
+    if (reset) {
+        return <Navigate replace to="/login" />;
+    }
+
+    return (
+        <div className="flex items-center justify-center min-h-screen bg-slate-100">
+            <div className="bg-white p-8 rounded-lg shadow-md w-full max-w-md">
+                <h2 className="text-2xl font-bold text-center mb-6">Reset Password</h2>
+                <form onSubmit={handleSubmit}>
+                    <div className="mb-4">
+                        <label className="block text-gray-700">New Password:</label>
+                        <input
+                            type="password"
+                            className="appearance-none border pl-4 border-gray-300 shadow-sm focus:shadow-md focus:placeholder-gray-600 transition rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
+                            value={password}
+                            onChange={(e) => setPassword(e.target.value)}
+                            required
+                        />
+                    </div>
+                    <div className="mb-4">
+                        <label className="block text-gray-700">Confirm Password:</label>
+                        <input
+                            type="password"
+                            className="appearance-none border pl-4 border-gray-300 shadow-sm focus:shadow-md focus:placeholder-gray-600 transition rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
+                            value={confirmPassword}
+                            onChange={(e) => setConfirmPassword(e.target.value)}
+                            required
+                        />
+                    </div>
+                    <button
+                        type="submit"
+                        className="w-full py-2 px-4 bg-indigo-500 text-white rounded-md hover:bg-indigo-600"
+                    >
+                        Reset Password
+                    </button>
+                </form>
+            </div>
+        </div>
+    );
+};
+
+export default ResetPassword;
diff --git a/client/src/pages/Login/login.jsx b/client/src/pages/Login/login.jsx
index d1b85a1..af9faa8 100644
--- a/client/src/pages/Login/login.jsx
+++ b/client/src/pages/Login/login.jsx
@@ -1,8 +1,8 @@
-import { React, useState } from "react";
+import React, { useState } from "react";
 import { Link, Navigate } from "react-router-dom";
 import axios from "axios";
 import toast from "react-hot-toast";
-import {useDispatch} from "react-redux";
+import { useDispatch } from "react-redux";
 import { logIn } from "../../redux/auth-slice";
 
 const Login = () => {
@@ -10,6 +10,7 @@ const Login = () => {
     const [password, setPassword] = useState("");
     const [authenticated, setAuthenticated] = useState(false);
     const dispatch = useDispatch();
+
     const loginf = async (e, email, password) => {
         e.preventDefault();
         if (!email && !password)
@@ -30,17 +31,18 @@ const Login = () => {
                     withCredentials: true,
                 }
             );
-            dispatch(logIn({email:email}));
+            dispatch(logIn({ email: email }));
             toast(data.message);
             setAuthenticated(true);
         } catch (error) {
             toast.error(error.response.data.message);
-            // console.error(error);
         }
     };
+
     if (authenticated) {
         return <Navigate replace to="/" />;
     }
+
     return (
         <>
             <div className="">
@@ -56,7 +58,7 @@ const Login = () => {
                             </div>
                             <div className="relative">
                                 <input
-                                    className="appearance-none border pl-12 border-gray-100 shadow-sm focus:shadow-md focus:placeholder-gray-600  transition  rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
+                                    className="appearance-none border pl-12 border-gray-100 shadow-sm focus:shadow-md focus:placeholder-gray-600 transition rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
                                     id="email"
                                     type="text"
                                     placeholder="Email"
@@ -77,9 +79,9 @@ const Login = () => {
                             </div>
                             <div className="relative mt-3">
                                 <input
-                                    className="appearance-none border pl-12 border-gray-100 shadow-sm focus:shadow-md focus:placeholder-gray-600  transition  rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
+                                    className="appearance-none border pl-12 border-gray-100 shadow-sm focus:shadow-md focus:placeholder-gray-600 transition rounded-md w-full py-3 text-gray-600 leading-tight focus:outline-none focus:ring-gray-600 focus:shadow-outline"
                                     id="username"
-                                    type="text"
+                                    type="password"
                                     placeholder="Password"
                                     name="password"
                                     onChange={(e) => {
@@ -117,14 +119,22 @@ const Login = () => {
                                     Sign in
                                 </button>
                             </div>
+                            <div className="flex items-center justify-center mt-4">
+                                <Link
+                                    to="/forgot-password"
+                                    className="text-indigo-500 hover:underline"
+                                >
+                                    Forgot Password?
+                                </Link>
+                            </div>
                             <hr className="m-4" />
                             <div className="flex items-center justify-center mt-5">
-                                <span className=" text-gray-500">
-                                    DO NOT HAVE A ACCOUNT ?!
-                                </span>{" "}
+                                <span className="text-gray-500">
+                                    DO NOT HAVE AN ACCOUNT?!
+                                </span>
                                 <Link
                                     to="/signup"
-                                    className="text-white py-2 px-4 ml-3 uppercase rounded bg-green-400 hover:bg-green-500 shadow hover:shadow-lg font-medium transition transform  "
+                                    className="text-white py-2 px-4 ml-3 uppercase rounded bg-green-400 hover:bg-green-500 shadow hover:shadow-lg font-medium transition transform"
                                 >
                                     REGISTER
                                 </Link>
diff --git a/server/.env b/server/.env
index e998cee..7d46577 100644
--- a/server/.env
+++ b/server/.env
@@ -6,4 +6,7 @@
 
 
 
-DATABASE_URL="mysql://user:password@localhost:3306/drawn2shoe"
\ No newline at end of file
+DATABASE_URL="mysql://user:password@localhost:3306/drawn2shoe"
+
+EMAIL=yourmail@gmail.com
+PASSWORD=your_password
diff --git a/server/controllers/forgotPassword.js b/server/controllers/forgotPassword.js
new file mode 100644
index 0000000..660ab4f
--- /dev/null
+++ b/server/controllers/forgotPassword.js
@@ -0,0 +1,66 @@
+import { prisma } from "../app.js";
+import bcrypt from "bcryptjs";
+import { v4 as uuidv4 } from "uuid";
+import { sendResetEmail } from "../utils/email.js";
+
+export const requestPasswordReset = async (req, res) => {
+    const { email } = req.body;
+    const user = await prisma.mainuser.findUnique({ where: { email } });
+    if (!user) {
+        return res.status(404).json({ message: "User not found" });
+    }
+
+    const token = uuidv4();
+    const hashedToken = await bcrypt.hash(token, 10);
+
+
+    // Ensure any previous tokens for this user are deleted
+    await prisma.passwordResetToken.deleteMany({
+        where: { userId: user.email }
+    });
+
+   const passwd = await prisma.passwordResetToken.create({
+        data: {
+            token: hashedToken,
+            userId: user.email,
+            expiresAt: new Date(Date.now() + 3600000), // 1 hour from now
+        }
+    });
+
+    const resetUrl = `http://localhost:5173/reset-password/${token}/${passwd.id}`;
+    await sendResetEmail(email, resetUrl);
+
+    res.status(200).json({ message: "Password reset link has been sent to your email" });
+};
+export const resetPassword = async (req, res) => {
+    const { token } = req.params;
+    const { password } = req.body;
+    const {id} = req.params;
+    const resetToken = await prisma.passwordResetToken.findUnique({
+        where: {
+            expiresAt: { gte: new Date() },
+
+            id:parseInt(id, 10)
+        }
+    });
+
+    if (!resetToken) {
+        return res.status(400).json({ message: "Invalid or expired token1" });
+    }
+
+    const isValid = await bcrypt.compare(token, resetToken.token);
+    if (!isValid) {
+        return res.status(400).json({ message: "Invalid or expired token2" });
+    }
+
+    const hashedPassword = await bcrypt.hash(password, 10);
+
+    await prisma.mainuser.update({
+        where: { email: resetToken.userId },
+        data: { passwd: hashedPassword }
+    });
+
+    await prisma.passwordResetToken.delete({ where: { id: resetToken.id } });
+
+    res.status(200).json({ message: "Password has been reset successfully" });
+};
diff --git a/server/package-lock.json b/server/package-lock.json
index 5df5c72..2ce8f82 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -16,7 +16,9 @@
         "dotenv": "^16.3.1",
         "express": "^4.18.2",
         "jsonwebtoken": "^9.0.2",
-        "mysql": "^2.18.1"
+        "mysql": "^2.18.1",
+        "nodemailer": "^6.9.14",
+        "uuid": "^10.0.0"
       },
       "devDependencies": {
         "prisma": "^5.16.2"
@@ -712,6 +714,15 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/nodemailer": {
+      "version": "6.9.14",
+      "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.9.14.tgz",
+      "integrity": "sha512-Dobp/ebDKBvz91sbtRKhcznLThrKxKt97GI2FAlAyy+fk19j73Uz3sBXolVtmcXjaorivqsbbbjDY+Jkt4/bQA==",
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
     "node_modules/object-assign": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -991,6 +1002,19 @@
         "node": ">= 0.4.0"
       }
     },
+    "node_modules/uuid": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
diff --git a/server/package.json b/server/package.json
index f1b09e1..f4be375 100644
--- a/server/package.json
+++ b/server/package.json
@@ -8,7 +8,6 @@
     "start": "node server.js",
     "dev": "nodemon server.js",
     "test": "echo \"Error: no test specified\" && exit 1",
-
     "migrate": "npx prisma migrate dev --name init",
     "generate": "npx prisma generate"
   },
@@ -22,7 +21,9 @@
     "dotenv": "^16.3.1",
     "express": "^4.18.2",
     "jsonwebtoken": "^9.0.2",
-    "mysql": "^2.18.1"
+    "mysql": "^2.18.1",
+    "nodemailer": "^6.9.14",
+    "uuid": "^10.0.0"
   },
   "devDependencies": {
     "prisma": "^5.16.2"
diff --git a/server/prisma/migrations/20240729205650_add_password_reset_token/migration.sql b/server/prisma/migrations/20240729205650_add_password_reset_token/migration.sql
new file mode 100644
index 0000000..da61d72
--- /dev/null
+++ b/server/prisma/migrations/20240729205650_add_password_reset_token/migration.sql
@@ -0,0 +1,13 @@
+-- CreateTable
+CREATE TABLE `PasswordResetToken` (
+    `id` INTEGER NOT NULL AUTO_INCREMENT,
+    `token` VARCHAR(191) NOT NULL,
+    `userId` VARCHAR(191) NOT NULL,
+    `expiresAt` DATETIME(3) NOT NULL,
+
+    UNIQUE INDEX `PasswordResetToken_token_key`(`token`),
+    PRIMARY KEY (`id`)
+) DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;
+
+-- AddForeignKey
+ALTER TABLE `PasswordResetToken` ADD CONSTRAINT `PasswordResetToken_userId_fkey` FOREIGN KEY (`userId`) REFERENCES `Mainuser`(`email`) ON DELETE RESTRICT ON UPDATE CASCADE;
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index 7372fe0..fa42ecb 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -60,6 +60,17 @@ model Mainuser {
   retailer   Retailer?
   wishlist   Wishlist[]
   designs    Design[] 
+  passwordResetTokens PasswordResetToken[]
+}
+
+model PasswordResetToken {
+  id        Int      @id @default(autoincrement())
+  token     String
+  userId    String
+  expiresAt DateTime
+  user      Mainuser @relation(fields: [userId], references: [email])
+
+  @@unique([token])
 }
 
 model Wishlist {
diff --git a/server/routes/user.js b/server/routes/user.js
index 3f4ffa2..1585f47 100644
--- a/server/routes/user.js
+++ b/server/routes/user.js
@@ -1,5 +1,6 @@
 import express from "express";
 import { login, signup, getMyProfile,updateUserProfile, registerdesigner, registerretailer } from "../controllers/user.js";
+import { requestPasswordReset, resetPassword } from "../controllers/forgotPassword.js";
 import { isAuthenticated } from "../middlewares/auth.js";
 
 const router = express.Router();
@@ -9,6 +10,10 @@ router.post("/login", login);
 
 router.post("/signup", signup);
 
+router.post("/forgot-password", requestPasswordReset);
+
+router.post("/reset-password/:token/:id", resetPassword);
+
 router.get("/me", isAuthenticated, getMyProfile);
 
 router.patch("/me", isAuthenticated, updateUserProfile); 
diff --git a/server/utils/email.js b/server/utils/email.js
new file mode 100644
index 0000000..34c7885
--- /dev/null
+++ b/server/utils/email.js
@@ -0,0 +1,28 @@
+import nodemailer from "nodemailer";
+
+export const sendResetEmail = async (email, resetUrl) => {
+    const transporter = nodemailer.createTransport({
+        service: "Gmail",
+        port: 465,
+        
+        secureConnection:false,
+
+        auth: {
+            user: process.env.EMAIL,
+            pass: process.env.PASSWORD,
+        },
+
+        tls: {
+            rejectunAuthorized:true
+        }
+    });
+
+    const mailOptions = {
+        from: process.env.EMAIL,
+        to: email,
+        subject: "Password Reset Request",
+        text: `You requested a password reset. Click the link to reset your password: ${resetUrl}`,
+    };
+
+    await transporter.sendMail(mailOptions);
+};