Adding the project palette

src/components/Drawer.jsx

-import React, { useState } from "react";
+import React, { useState } from "react"
 import {
   Drawer,
   IconButton,
   List,
   ListItem,
   ListItemText,
-} from "@material-ui/core";
-import ListItemIcon from '@mui/material/ListItemIcon';
-import Divider from '@mui/material/Divider';
-import MenuRoundedIcon from '@mui/icons-material/MenuRounded';
-import InventoryRoundedIcon from '@mui/icons-material/InventoryRounded';
-import PeopleOutlineRoundedIcon from '@mui/icons-material/PeopleOutlineRounded';
-import LocalMallRoundedIcon from '@mui/icons-material/LocalMallRounded';
-import ArticleRoundedIcon from '@mui/icons-material/ArticleRounded';
+} from "@material-ui/core"
+import ListItemIcon from "@mui/material/ListItemIcon"
+import Divider from "@mui/material/Divider"
+import MenuRoundedIcon from "@mui/icons-material/MenuRounded"
+import InventoryRoundedIcon from "@mui/icons-material/InventoryRounded"
+import PeopleOutlineRoundedIcon from "@mui/icons-material/PeopleOutlineRounded"
+import LocalMallRoundedIcon from "@mui/icons-material/LocalMallRounded"
+import ArticleRoundedIcon from "@mui/icons-material/ArticleRounded"
 
-import { NavLink } from "./styled";
+import { NavLink } from "./styled"
+import theme from "./palette"
+
+const myPalette = theme.palette
 
 function DrawerComponent() {
-  const [openDrawer, setOpenDrawer] = useState(false);
-  const [selectedIndex, setSelectedIndex] = useState(1);
+  const [openDrawer, setOpenDrawer] = useState(false)
+  const [selectedIndex, setSelectedIndex] = useState(1)
 
   const handleListItemClick = (event, index) => {
-    setSelectedIndex(index);
-  };
+    setSelectedIndex(index)
+  }
 
   return (
     <>
@@ -92,10 +95,10 @@ function DrawerComponent() {
       </Drawer>
 
       <IconButton onClick={() => setOpenDrawer(!openDrawer)}>
-        <MenuRoundedIcon sx={{ color: "#ffffff" }} fontSize="large" />
+        <MenuRoundedIcon sx={{ color: myPalette.primary.contrastText }} fontSize="large" />
       </IconButton>
     </>
-  );
+  )
 };
 
-export default DrawerComponent;
+export default DrawerComponent

src/components/palette.js

+import { createTheme } from "@mui/material/styles"
+import { lightBlue, cyan } from "@mui/material/colors"
+
+const theme = createTheme({
+  palette: {
+    primary: {
+      main: "#074B6B",
+      light: lightBlue[900],
+      dark: "#07415C",
+      contrastText: "#fff",
+      text: "#404040",
+    },
+    secondary: {
+      main: cyan[400],
+      light: cyan[300],
+      dark: cyan[700],
+      contrastText: "#fff",
+    },
+  },
+})
+
+export default theme

src/views/Home.jsx

-import React from "react";
+import React from "react"
 
 const Home = () => {
   return (
     <div>Listo</div>
-  );
-};
+  )
+}
 
-export default Home;
+export default Home