diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 2c39f2c..68373a2 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -80,6 +80,7 @@
       "integrity": "sha512-2BCOP7TN8M+gVDj7/ht3hsaO/B/n5oDbiAyyvnRlNOs+u1o+JWNYTQrmpuNp1/Wq2gcFrI01JAW+paEKDMx/CA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.3",
@@ -1817,6 +1818,7 @@
       "integrity": "sha512-6mDvHUFSjyT2B2yeNx2nUgMxh9LtOWvkhIU3uePn2I2oyNymUAX1NIsdgviM4CH+JSrp2D2hsMvJOkxY+0wNRA==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "csstype": "^3.0.2"
       }
@@ -1871,6 +1873,7 @@
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -2121,6 +2124,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.8.19",
         "caniuse-lite": "^1.0.30001751",
@@ -2762,6 +2766,7 @@
       "integrity": "sha512-t5aPOpmtJcZcz5UJyY2GbvpDlsK5E8JqRqoKtfiKE3cNh437KIqfJr3A3AKf5k64NPx6d0G3dno6XDY05PqPtw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.8.0",
         "@eslint-community/regexpp": "^4.12.1",
@@ -4360,6 +4365,7 @@
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -4612,6 +4618,7 @@
       "resolved": "https://registry.npmjs.org/react/-/react-19.2.0.tgz",
       "integrity": "sha512-tmbWg6W31tQLeB5cdIBOicJDJRR2KzXsV7uSK9iNfLWQ5bIZfxuPEHp7M8wiHyHnn0DD1i7w3Zmin0FtkrwoCQ==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4621,6 +4628,7 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.0.tgz",
       "integrity": "sha512-UlbRu4cAiGaIewkPyiRGJk0imDN2T3JjieT6spoL2UeSf5od4n5LB/mQ4ejmxhCFT1tYe8IvaFulzynWovsEFQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "scheduler": "^0.27.0"
       },
@@ -4666,6 +4674,7 @@
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
       "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/use-sync-external-store": "^0.0.6",
         "use-sync-external-store": "^1.4.0"
@@ -4809,7 +4818,8 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
       "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/redux-thunk": {
       "version": "3.1.0",
@@ -5452,6 +5462,7 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-7.1.12.tgz",
       "integrity": "sha512-ZWyE8YXEXqJrrSLvYgrRP7p62OziLW7xI5HYGWFzOvupfAlrLvURSzv/FyGyy0eidogEM3ujU+kUG1zuHgb6Ug==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.5.0",
diff --git a/frontend/src/components/Navbar.jsx b/frontend/src/components/Navbar.jsx
index f586b3a..a7d82d6 100644
--- a/frontend/src/components/Navbar.jsx
+++ b/frontend/src/components/Navbar.jsx
@@ -2,7 +2,7 @@ import React, { useState } from "react";
 import { Link, useLocation } from "react-router-dom";
 import { Menu, X } from "lucide-react";
 import { motion, AnimatePresence } from "framer-motion";
-
+import { Mail } from "lucide-react";
 export default function Navbar() {
   const [isOpen, setIsOpen] = useState(false);
   const location = useLocation();
@@ -23,14 +23,15 @@ export default function Navbar() {
       initial={{ opacity: 0, y: -10 }}
       animate={{ opacity: 1, y: 0 }}
       transition={{ duration: 0.4 }}
-      className="w-full sticky top-0 z-50 bg-white/80 backdrop-blur-md border-b border-gray-200"
+      className="w-full sticky top-0 z-50 bg-gray-300 backdrop-blur-md border-b border-gray-200"
     >
       <div className="max-w-6xl mx-auto px-6 py-4 flex justify-between items-center">
         {/* Logo */}
         <Link
           to="/"
-          className="text-2xl font-semibold text-slate-800 tracking-tight"
+          className="flex gap-4 text-2xl font-semibold text-slate-800 tracking-tight"
         >
+          <Mail className="w-8 h-8 text-gray-500" />
           MailMERN
         </Link>
 
diff --git a/frontend/src/pages/Home.jsx b/frontend/src/pages/Home.jsx
index 75822f1..7e27d99 100644
--- a/frontend/src/pages/Home.jsx
+++ b/frontend/src/pages/Home.jsx
@@ -1,29 +1,97 @@
 import React from "react";
+import { useNavigate } from "react-router-dom";
 import ChatbotWidget from "../components/ChatbotWidget";
+import {Mail,Brain, BarChart3, Send, Users, Sparkles, Github } from "lucide-react";
 
 export default function Home() {
+  const navigate = useNavigate();
+
   return (
-    <div className="page home">
-      <h1>Welcome to MailMERN 🚀</h1>
-      <p>
-        This is the open-source MERN starter to build a Mass Email &
-        Smart Reply System.
-      </p>
-      
-      <div className="mt-8 p-6 bg-blue-50 border border-blue-200 rounded-lg">
-        <h2 className="text-xl font-semibold text-blue-900 mb-3">🤖 Try Our AI Assistant</h2>
-        <p className="text-blue-800 mb-4">
-          Click the chat button in the bottom right corner to interact with our AI assistant. 
-          It can help you with questions about features, pricing, support, and more!
+    <div className="relative min-h-screen bg-gradient-to-br from-gray-200 via-white to-gray-200 overflow-hidden text-gray-800">
+      <div className="absolute top-0 left-0 w-96 h-96 bg-gray-400 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-pulse"></div>
+      <div className="absolute bottom-0 right-0 w-96 h-96 bg-gray-400 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-pulse"></div>
+
+      <section className="text-center px-6 md:px-20 mt-20">
+        <h2 className="text-5xl md:text-6xl font-extrabold text-black leading-tight">
+          Automate Conversations.<br />
+          <span className="text-gray-500">Scale Your Email Marketing.</span>
+        </h2>
+        <p className="mt-6 text-lg text-gray-600 max-w-2xl mx-auto">
+          Build, send, and automate your email campaigns with <strong>AI-powered assistance</strong>.
+          MailMERN helps you send mass emails, reply smartly, and manage campaigns — all open-source and built with MERN.
         </p>
-        <div className="flex flex-wrap gap-2">
-          <span className="px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm">Ask about features</span>
-          <span className="px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm">Get pricing info</span>
-          <span className="px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm">Request support</span>
-          <span className="px-3 py-1 bg-blue-100 text-blue-800 rounded-full text-sm">General questions</span>
+
+        <div className="mt-8 flex justify-center gap-4">
+          <button
+            onClick={() => navigate("/login")}
+            className="px-6 py-3 flex gap-2 bg-gray-500 text-white rounded-full font-semibold hover:bg-gray-700 transition-all duration-300"
+          >
+           <Send className="w-6 h-6 text-white" />
+            Start Now
+          </button>
+          <a
+            href="https://github.com/OPCODE-Open-Spring-Fest/MailMERN"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="px-6 py-3 flex gap-2 border border-gray-500 text-gray-700 rounded-full font-semibold hover:bg-gray-50 transition-all duration-300"
+          >
+            <Github className="w-6 h-6 text-gray-700" />
+             View on GitHub
+          </a>
+        </div>
+      </section>
+
+      {/*Features*/}
+      <section className="mt-24 px-6 mb-24 md:px-20">
+        <h3 className="text-center text-3xl font-bold text-gray-900 mb-10">
+          Powerful Features of MailMERN 
+        </h3>
+        <div className="grid md:grid-cols-3 gap-8">
+          {[
+            {
+              icon: <Send className="w-8 h-8 text-gray-500" />,
+              title: "Mass Email Sending",
+              desc: "Send thousands of personalized emails with one click using secure SMTP or API integrations."
+            },
+            {
+              icon: <Brain className="w-8 h-8 text-gray-500" />,
+              title: "AI Auto-Responder",
+              desc: "Automatically reply to user queries, schedule meetings, and answer FAQs with AI."
+            },
+            {
+              icon: <BarChart3 className="w-8 h-8 text-gray-500" />,
+              title: "Analytics Dashboard",
+              desc: "Track open rates, clicks, and engagement metrics in real-time with visual insights."
+            },
+            {
+              icon: <Users className="w-8 h-8 text-gray-500" />,
+              title: "Contact Management",
+              desc: "Upload, segment, and manage your contact lists with ease using MongoDB integration."
+            },
+            {
+              icon: <Sparkles className="w-8 h-8 text-gray-500" />,
+              title: "Smart Scheduling",
+              desc: "Schedule campaigns and follow-ups automatically using Node Cron."
+            },
+            {
+              icon: <Mail className="w-8 h-8 text-gray-500" />,
+              title: "Template Builder",
+              desc: "Design professional HTML email templates with custom layouts and reusable blocks."
+            },
+          ].map((feature, idx) => (
+            <div
+              key={idx}
+              className="bg-white/70 backdrop-blur-lg border border-gray-100 shadow-md rounded-2xl p-6 hover:shadow-lg hover:-translate-y-1 transition-all duration-300"
+            >
+              <div className="flex items-center gap-3 mb-3">
+                {feature.icon}
+                <h4 className="text-lg font-semibold text-gray-900">{feature.title}</h4>
+              </div>
+              <p className="text-gray-600 text-sm">{feature.desc}</p>
+            </div>
+          ))}
         </div>
-      </div>
-      
+      </section>
       <ChatbotWidget />
     </div>
   );
diff --git a/package-lock.json b/package-lock.json
index 5315f92..04d04a0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -312,6 +312,7 @@
       "integrity": "sha512-QoiaXANRkSXK6p0Duvt56W208du4P9Uye9hWLWgGMDTEoKPhuenzNcC4vGUmrNkiOKTlIrBoyNQYNpSwfEZXSg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "undici-types": "~7.16.0"
       }
@@ -576,6 +577,7 @@
       "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "env-paths": "^2.2.1",
         "import-fresh": "^3.3.0",
@@ -619,7 +621,8 @@
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
       "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/dargs": {
       "version": "8.1.0",
@@ -1415,8 +1418,7 @@
       "version": "0.27.0",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
       "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/semver": {
       "version": "7.7.3",