diff --git a/src/App.jsx b/src/App.jsx
index c509a354b..35b18d460 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -28,7 +28,6 @@ const Contributors = React.lazy(() =>
   import("./pages/FooterPages/ContributorPage"),
 );
 // ------------------------------------- Components ------------------------------------------------
-const Favorite = React.lazy(() => import("./components/Favorite"));
 const Notifications = React.lazy(() => import("./components/Notification"));
 const Post = React.lazy(() => import("./components/Post"));
 const SideBar = React.lazy(() => import("./components/SideBar"));
@@ -388,14 +387,6 @@ function App() {
             />
 
             <Route path="*" element={<NotFound />} />
-            <Route
-              path="/dummygram/favourites"
-              element={
-                <ErrorBoundary inApp={true}>
-                  <Favorite />
-                </ErrorBoundary>
-              }
-            />
           </Routes>
           {/* below scroll button must be checked for implementation */}
           <FaArrowCircleUp
diff --git a/src/components/Favorite.jsx b/src/components/Favorite.jsx
deleted file mode 100644
index 22024f58c..000000000
--- a/src/components/Favorite.jsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import { Loader, ShareModal } from "../reusableComponents";
-import { Post, SideBar } from "./index";
-import React, { useContext, useEffect, useState } from "react";
-import { auth, db } from "../lib/firebase";
-import { doc, getDoc } from "firebase/firestore";
-
-import { Box } from "@mui/material";
-import { RowModeContext } from "../hooks/useRowMode";
-import { useSnackbar } from "notistack";
-
-function Favorite() {
-  const [openShareModal, setOpenShareModal] = useState(false);
-  const [currentPostLink, setCurrentPostLink] = useState("");
-  const [postText, setPostText] = useState("");
-  const [posts, setPosts] = useState([]);
-  const [loading, setLoading] = useState(true);
-
-  const rowMode = useContext(RowModeContext);
-  const { enqueueSnackbar } = useSnackbar();
-
-  let savedPostsArr = JSON.parse(localStorage.getItem("posts")) || [];
-
-  useEffect(() => {
-    const posts = [];
-    if (savedPostsArr.length > 0) {
-      const fetchPosts = async () => {
-        try {
-          const fetchSavedPosts = savedPostsArr.map(async (id) => {
-            try {
-              const docRef = doc(db, "posts", id);
-              const docSnap = await getDoc(docRef);
-              if (docSnap.exists()) {
-                posts.push({ id: docSnap.id, post: docSnap.data() });
-              }
-            } catch (error) {
-              enqueueSnackbar("Error while fetching all posts", {
-                variant: "error",
-              });
-              setLoading(false);
-            }
-          });
-
-          await Promise.all(fetchSavedPosts); // Wait for all fetch requests to complete
-          setLoading(false);
-          setPosts(posts);
-        } catch (error) {
-          enqueueSnackbar("Error while fetching all posts", {
-            variant: "error",
-          });
-          setLoading(false);
-        }
-      };
-
-      fetchPosts();
-    } else {
-      setLoading(false);
-    }
-  }, []);
-
-  return (
-    <>
-      <SideBar />
-      {loading ? (
-        <div
-          style={{
-            width: "100vw",
-            height: "100vh",
-            display: "flex",
-            justifyContent: "center",
-            alignItems: "center",
-          }}
-        >
-          <Loader />
-        </div>
-      ) : (
-        <div>
-          <ShareModal
-            openShareModal={openShareModal}
-            setOpenShareModal={setOpenShareModal}
-            currentPostLink={currentPostLink}
-            postText={postText}
-          />
-          <Box>
-            <div
-              className="profile__favourites"
-              style={{ marginTop: "5.5rem", marginBottom: "1.5rem" }}
-              align="center"
-            >
-              {posts.length ? (
-                <>
-                  <h1 style={{ color: "var(--color)" }}>Your Saved Posts</h1>
-                  <div
-                    className={`${rowMode ? "app__posts" : "app_posts_column"}`}
-                  >
-                    {posts.map(({ id, post }) => (
-                      <Post
-                        rowMode={true}
-                        key={id}
-                        postId={id}
-                        user={auth.currentUser}
-                        post={post}
-                        shareModal={setOpenShareModal}
-                        setLink={setCurrentPostLink}
-                        setPostText={setPostText}
-                      />
-                    ))}
-                  </div>
-                </>
-              ) : (
-                <p style={{ color: "var(--color)" }}>
-                  You have nothing in saved
-                </p>
-              )}
-            </div>
-          </Box>
-        </div>
-      )}
-    </>
-  );
-}
-
-export default Favorite;
diff --git a/src/components/SideBar/index.css b/src/components/SideBar/index.css
index d736bae3d..54f7742db 100644
--- a/src/components/SideBar/index.css
+++ b/src/components/SideBar/index.css
@@ -85,7 +85,7 @@
 
 .sidebar_user_dropdown_container {
   position: absolute;
-  top: 390px;
+  top: 333px;
   left: 100px;
   padding: 0;
   border-radius: 10px;
diff --git a/src/components/SideBar/index.jsx b/src/components/SideBar/index.jsx
index e1987f68a..f649474d3 100644
--- a/src/components/SideBar/index.jsx
+++ b/src/components/SideBar/index.jsx
@@ -11,7 +11,6 @@ import AccountCircleIcon from "@mui/icons-material/AccountCircle";
 import AddCircleOutlineIcon from "@mui/icons-material/AddCircleOutline";
 import { AiOutlineClose } from "react-icons/ai";
 import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
-import BookmarksIcon from "@mui/icons-material/Bookmarks";
 import { ClickAwayListener } from "@mui/material";
 import { Dialog } from "@mui/material";
 import ErrorBoundary from "../../reusableComponents/ErrorBoundary";
@@ -100,21 +99,6 @@ function SideBar({ anonymous }) {
               <AddCircleOutlineIcon className="icon" /> <span>Create</span>
             </div>
           </li>
-          <li
-            onClick={() =>
-              navigate(`/dummygram/${anonymous ? "signup" : "favourites"}`)
-            }
-            className={
-              location.pathname.includes("/dummygram/favourites")
-                ? "activeTab"
-                : ""
-            }
-          >
-            <div className="sidebar_align">
-              <BookmarksIcon className="icon" />
-              <span>Saved</span>
-            </div>
-          </li>
           <li
             onClick={() =>
               navigate(`/dummygram/${anonymous ? "signup" : "notifications"}`)
diff --git a/src/components/index.js b/src/components/index.js
index 9e181bb33..1d3c07c7d 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1,7 +1,6 @@
 import Caption from "./Post/Caption";
 import ChatBox from "./CommunityChat";
 import EditProfile from "./EditProfile";
-import Favorite from "./Favorite";
 import GuestSignInBtn from "./Guest/GuestSignInBtn";
 import GuestSignUpBtn from "./Guest/GuestSignUpBtn";
 import ImgUpload from "./ImgUpload";
@@ -19,7 +18,6 @@ export {
   Caption,
   ChatBox,
   EditProfile,
-  Favorite,
   GuestSignInBtn,
   GuestSignUpBtn,
   ImgUpload,
diff --git a/src/pages/Profile/index.css b/src/pages/Profile/index.css
index b8ba5d5ee..0f23238bf 100644
--- a/src/pages/Profile/index.css
+++ b/src/pages/Profile/index.css
@@ -16,6 +16,55 @@
   margin: auto;
 }
 
+.feed_btn_container {
+  margin-left: 17vw;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 40px;
+  padding: 10px;
+}
+
+.feed_change_btn {
+  font-size: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-top: 15px;
+  padding-bottom: 10px;
+  padding-inline: 20px;
+  cursor: pointer;
+  background: var(--bg-color);
+  border: none;
+  color: var(--text-secondary);
+}
+
+.feed_btn_deactivated {
+  opacity: 0.7;
+  color: var(--profile-color);
+}
+
+.feed_btn_deactivated:hover {
+  opacity: 1;
+}
+
+.feed_btn_activated {
+  border-top: 4px solid;
+}
+
+.feed_btn_text {
+  margin-left: 8px;
+}
+
+.outer-profile-box {
+  position: relative;
+  margin-top: 0;
+  width: 85%;
+  padding-block: 5px;
+  padding-inline: 6px;
+  border: none;
+  margin: 0rem auto 2rem;
+}
 .user-details-section {
   display: flex;
   z-index: 99;
@@ -231,6 +280,12 @@
   transition: all 0.3s ease;
 }
 
+.no_posts_msg {
+  text-align: center;
+  margin-top: 20px;
+  margin-bottom: 40px;
+}
+
 /* media query */
 
 @media screen and (max-width: 600px) {
@@ -265,7 +320,25 @@
   }
 }
 
+@media screen and (max-width: 1200px) {
+  .background-image-container {
+    padding: 4em 0 0 8vw;
+  }
+
+  .feed_btn_container {
+    margin-left: 8vw;
+  }
+}
+
 @media screen and (max-width: 800px) {
+  .outer-profile-box {
+    width: calc(100% - 10vw);
+  }
+
+  .feed_btn_container {
+    margin-left: 0;
+  }
+
   .background-image-container {
     padding: 0 !important;
     padding-top: 4em !important;
@@ -294,15 +367,6 @@
   }
 }
 
-@media screen and (max-width: 1200px) {
-  .background-image-container {
-    padding: 4em 0 0 8vw;
-  }
-  .user-details-section {
-    padding: 0 12vw;
-  }
-}
-
 @media screen and (min-width: 1200px) {
   .outer-profile-box {
     width: calc(100% - 34vw);
diff --git a/src/pages/Profile/index.jsx b/src/pages/Profile/index.jsx
index a597c1c29..573d13314 100644
--- a/src/pages/Profile/index.jsx
+++ b/src/pages/Profile/index.jsx
@@ -10,15 +10,18 @@ import {
   query,
   where,
 } from "firebase/firestore";
+import { doc, getDoc } from "firebase/firestore";
 import { lazy, useEffect, useState } from "react";
 import { playErrorSound, playSuccessSound } from "../../js/sounds";
 import { useNavigate, useParams } from "react-router-dom";
 
+import BookmarksIcon from "@mui/icons-material/Bookmarks";
 import Cam from "@mui/icons-material/CameraAltOutlined";
 import EditIcon from "@mui/icons-material/Edit";
 import { EditProfile } from "../../components";
 import ErrorBoundary from "../../reusableComponents/ErrorBoundary";
 import { FaUserCircle } from "react-icons/fa";
+import GridOnIcon from "@mui/icons-material/GridOn";
 import { Loader } from "../../reusableComponents";
 import LocationOnIcon from "@mui/icons-material/LocationOn";
 import NotFound from "../NotFound";
@@ -38,6 +41,9 @@ function Profile() {
 
   const [user, setUser] = useState(null);
   const [feed, setFeed] = useState([]);
+  const [savedPosts, setSavedPosts] = useState([]);
+  // const [open, setOpen] = useState(false);
+  const [isSavedPostsLoading, setIsSavedPostsLoading] = useState(true);
   const [friendRequestSent, setFriendRequestSent] = useState(false);
   const [userData, setUserData] = useState(null);
   const [isEditing, setIsEditing] = useState(false);
@@ -46,6 +52,7 @@ function Profile() {
   const [editing, setEditing] = useState(false);
   const [bgimgurl, setBgimgurl] = useState(null);
   const [backgroundImage, setBackgroundImage] = useState(null);
+  const [showSaved, setShowSaved] = useState(false);
 
   let name = "";
   let avatar = "";
@@ -314,6 +321,41 @@ function Profile() {
     };
   }, [user, name]);
 
+  async function getSavedPosts() {
+    let savedPostsArr = JSON.parse(localStorage.getItem("posts")) || [];
+    const posts = [];
+    if (savedPostsArr.length > 0 && savedPosts.length === 0) {
+      try {
+        const fetchSavedPosts = savedPostsArr.map(async (id) => {
+          try {
+            const docRef = doc(db, "posts", id);
+            const docSnap = await getDoc(docRef);
+            if (docSnap.exists()) {
+              posts.push({ id: docSnap.id, post: docSnap.data() });
+            }
+          } catch (error) {
+            console.log(error, "err");
+            enqueueSnackbar("Error while fetching all posts", {
+              variant: "error",
+            });
+          } finally {
+            setIsSavedPostsLoading(false);
+          }
+        });
+        await Promise.all(fetchSavedPosts); // Wait for all fetch requests to complete
+        setSavedPosts(posts);
+      } catch (error) {
+        enqueueSnackbar("Error while fetching all posts", {
+          variant: "error",
+        });
+      } finally {
+        setIsSavedPostsLoading(false);
+      }
+    } else {
+      setIsSavedPostsLoading(false);
+    }
+  }
+
   return (
     <>
       <ErrorBoundary>
@@ -458,7 +500,40 @@ function Profile() {
             </div>
           </div>
 
-          <ProfieFeed feed={feed} user={user} />
+          <div className="feed_btn_container">
+            <button
+              className={`feed_change_btn ${
+                showSaved ? "feed_btn_deactivated" : "feed_btn_activated"
+              }`}
+              onClick={() => setShowSaved(false)}
+            >
+              <GridOnIcon /> <span className="feed_btn_text">Feed</span>
+            </button>
+            {user?.uid === uid && (
+              <button
+                className={`feed_change_btn ${
+                  showSaved ? "feed_btn_activated" : "feed_btn_deactivated"
+                }`}
+                onClick={() => {
+                  getSavedPosts();
+                  setShowSaved(true);
+                }}
+              >
+                <BookmarksIcon /> <span className="feed_btn_text">Saved</span>
+              </button>
+            )}
+          </div>
+          {showSaved ? (
+            isSavedPostsLoading ? (
+              <Loader />
+            ) : savedPosts.length === 0 ? (
+              <p className="no_posts_msg">Nothing in saved</p>
+            ) : (
+              <ProfieFeed feed={savedPosts} />
+            )
+          ) : (
+            <ProfieFeed feed={feed} />
+          )}
         </>
       ) : userExists ? (
         <Loader />