diff --git a/src/components/TileBasic/index.js b/src/components/TileBasic/index.js
index d73c4cb..77e6ab4 100644
--- a/src/components/TileBasic/index.js
+++ b/src/components/TileBasic/index.js
@@ -14,7 +14,7 @@ const useStyles = makeStyles({
   margin: {
     marginBottom: '20px'
   },
-  centerContent: {
+  tileContent: {
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',
@@ -39,6 +39,22 @@ const useStyles = makeStyles({
         }
       }
     }
+  },
+  disabledTileContent: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    flexDirection: 'column',
+    marginLeft: '20px',
+    boxShadow: '0px 4px 24px rgba(0, 0, 0, 0.05)',
+    borderRadius: '8px',
+    marginBottom: '20px',
+    opacity: '0.5',
+    '& svg': {
+      '&path': {
+        stroke: '#007AFF !important'
+      }
+    }
   }
 });
 
@@ -50,27 +66,43 @@ export default function TileBasic({ tiles }) {
       <MDBox px={2} py={3}>
         <Grid container spacing={2}>
           {tiles &&
-            tiles.map((items) => (
+            tiles.map((item) => (
               <>
                 <Grid item xs={12} sm={6} md={tiles.length > 4 ? 4 : 6}>
-                  <Link
-                    to={items.path}
-                    state={{ name: items.name, address: items.address, id: items._id }}
-                  >
+                  {item.disabled ? (
                     <MDBox
-                      key={items.name + items.path}
-                      data={{ name: items.name, path: items.path }}
-                      className={classes.centerContent}
+                      key={item.name + item.path}
+                      data={{ name: item.name, path: item.path }}
+                      className={classes.disabledTileContent}
                       sx={{
                         height: 230,
                         backgroundColor: ({ palette: { white } }) => white.main,
                         padding: '32px 40px'
                       }}
                     >
-                      {items.icon}
-                      {items.name}
+                      {item.icon}
+                      {item.name}
                     </MDBox>
-                  </Link>
+                  ) : (
+                    <Link
+                      to={item.path}
+                      state={{ name: item.name, address: item.address, id: item._id }}
+                    >
+                      <MDBox
+                        key={item.name + item.path}
+                        data={{ name: item.name, path: item.path }}
+                        className={classes.tileContent}
+                        sx={{
+                          height: 230,
+                          backgroundColor: ({ palette: { white } }) => white.main,
+                          padding: '32px 40px'
+                        }}
+                      >
+                        {item.icon}
+                        {item.name}
+                      </MDBox>
+                    </Link>
+                  )}
                 </Grid>
               </>
             ))}
diff --git a/src/pages/homepage/index.js b/src/pages/homepage/index.js
index 8ceb9ca..f0d9509 100644
--- a/src/pages/homepage/index.js
+++ b/src/pages/homepage/index.js
@@ -11,11 +11,13 @@ function HomepageScreen() {
     {
       name: 'Search Inventory',
       path: '/',
+      disabled: true,
       icon: <SearchInventoryIcon color="#007AFF" />
     },
     {
       name: 'Scan',
       path: '/',
+      disabled: true,
       icon: <ScanIcon color="#007AFF" />
     },
     {
@@ -26,6 +28,7 @@ function HomepageScreen() {
     {
       name: 'Reports',
       path: '/',
+      disabled: true,
       icon: <ReportsIcon color="#007AFF" />
     }
   ];