diff --git a/Client/package-lock.json b/Client/package-lock.json
index 79ac309a3..2ad129bd4 100644
--- a/Client/package-lock.json
+++ b/Client/package-lock.json
@@ -11,7 +11,7 @@
         "@emotion/react": "^11.11.4",
         "@emotion/styled": "^11.11.5",
         "@fontsource/roboto": "^5.0.13",
-        "@mui/icons-material": "^5.15.16",
+        "@mui/icons-material": "^5.15.17",
         "@mui/material": "^5.15.16",
         "@mui/x-data-grid": "7.3.2",
         "@mui/x-date-pickers": "7.3.2",
@@ -1127,9 +1127,9 @@
       }
     },
     "node_modules/@mui/icons-material": {
-      "version": "5.15.16",
-      "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.15.16.tgz",
-      "integrity": "sha512-s8vYbyACzTNZRKv+20fCfVXJwJqNcVotns2EKnu1wmAga6wv2LAo5kB1d5yqQqZlMFtp34EJvRXf7cy8X0tJVA==",
+      "version": "5.15.17",
+      "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.15.17.tgz",
+      "integrity": "sha512-xVzl2De7IY36s/keHX45YMiCpsIx3mNv2xwDgtBkRSnZQtVk+Gqufwj1ktUxEyjzEhBl0+PiNJqYC31C+n1n6A==",
       "dependencies": {
         "@babel/runtime": "^7.23.9"
       },
diff --git a/Client/package.json b/Client/package.json
index 7d5c47a8d..cca88fb31 100644
--- a/Client/package.json
+++ b/Client/package.json
@@ -13,7 +13,7 @@
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
     "@fontsource/roboto": "^5.0.13",
-    "@mui/icons-material": "^5.15.16",
+    "@mui/icons-material": "^5.15.17",
     "@mui/material": "^5.15.16",
     "@mui/x-data-grid": "7.3.2",
     "@mui/x-date-pickers": "7.3.2",
diff --git a/Client/src/Components/DashboardMenu/index.css b/Client/src/Components/DashboardMenu/index.css
new file mode 100644
index 000000000..37c84655b
--- /dev/null
+++ b/Client/src/Components/DashboardMenu/index.css
@@ -0,0 +1,15 @@
+.icon-container {
+    display: flex;
+    align-items: center; 
+    margin-bottom: 12px; 
+  }
+  
+  .text-container {
+    display: flex;
+    align-items: center;
+  }
+  
+  .dashboard-menu-text {
+    margin-left: 8px;
+  }
+  
\ No newline at end of file
diff --git a/Client/src/Components/DashboardMenu/index.jsx b/Client/src/Components/DashboardMenu/index.jsx
new file mode 100644
index 000000000..716d68497
--- /dev/null
+++ b/Client/src/Components/DashboardMenu/index.jsx
@@ -0,0 +1,58 @@
+import LanguageIcon from "@mui/icons-material/Language";
+import ReportGmailerrorredIcon from "@mui/icons-material/ReportGmailerrorred";
+import SensorsIcon from "@mui/icons-material/Sensors";
+import SettingsIcon from "@mui/icons-material/Settings";
+import AllInclusiveIcon from "@mui/icons-material/AllInclusive";
+import SvgIcon from '@mui/material/SvgIcon';
+import './index.css'; 
+
+/**
+ * @component
+ * DashboardMenu component displays a menu with icons and corresponding text.
+ * Each menu item consists of an icon and a text label.
+ * 
+ * @returns {JSX.Element} The JSX element representing the DashboardMenu component.
+ */
+
+function DashboardMenu() {
+  return (
+    <div className="dashboard-menu-container"> 
+      <div className="icon-container">
+        <SvgIcon component={LanguageIcon} />
+        <div className="text-container">
+          <span className="dashboard-menu-text">Monitors</span>
+        </div>
+      </div>
+
+      <div className="icon-container">
+        <SvgIcon component={ReportGmailerrorredIcon} />
+        <div className="text-container">
+          <span className="dashboard-menu-text">Incidents</span>
+        </div>
+      </div>
+
+      <div className="icon-container">
+        <SvgIcon component={SensorsIcon} />
+        <div className="text-container">
+          <span className="dashboard-menu-text">Status Pages</span>
+        </div>
+      </div>
+
+      <div className="icon-container">
+        <SvgIcon component={AllInclusiveIcon} />
+        <div className="text-container">
+          <span className="dashboard-menu-text">Integrations</span>
+        </div>
+      </div>
+
+      <div className="icon-container">
+        <SvgIcon component={SettingsIcon} />
+        <div className="text-container">
+          <span className="dashboard-menu-text">Settings</span>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default DashboardMenu;
diff --git a/Client/src/Pages/Home/index.jsx b/Client/src/Pages/Home/index.jsx
index 8742da6f1..ff5cb454e 100644
--- a/Client/src/Pages/Home/index.jsx
+++ b/Client/src/Pages/Home/index.jsx
@@ -1,6 +1,7 @@
 import DropdownTeamMember from "../../Components/DropdownTeamMember";
 import Search from "../../Components/Search";
 import "./index.css";
+import DashboardMenu from "../../Components/DashboardMenu";
 
 const Home = () => {
   return (
@@ -8,6 +9,7 @@ const Home = () => {
       <div>Home</div>
       <DropdownTeamMember />
       <Search />
+      <DashboardMenu />
     </>
   );
 };