diff --git a/apps/ui/src/Route.tsx b/apps/ui/src/Route.tsx
index a7135fc5..7d5b16c9 100644
--- a/apps/ui/src/Route.tsx
+++ b/apps/ui/src/Route.tsx
@@ -109,7 +109,7 @@ import EditScheduleModal from 'modals/EditScheduleModal'
 import VoiceOptionsModal from 'modals/VoiceOptionsModal'
 import LlmSettingsModal from 'modals/LlmSettingsModal'
 import { InviteUsers, CreateUserAccess } from 'pages/InviteUsers'
-import { Pods, PodsContent } from 'pages/Pods'
+import { Pods, PodsContent, MainPod } from 'pages/Pods'
 import Subnets from 'pages/Subnets'
 
 
@@ -418,7 +418,7 @@ const Route = () => {
               </Router>
 
               <Router path='pods' element={<Pods />} key={document.location.href}>
-                {/* <Router index element={<Pods />} key={document.location.href} /> */}
+                <Router index element={<MainPod />} key={document.location.href} />
                 <Router
                   path={'create-pod'}
                   element={<PodsContent />}
diff --git a/apps/ui/src/pages/Navigation/MainNavigation.tsx b/apps/ui/src/pages/Navigation/MainNavigation.tsx
index fdd6850a..cb5c2df9 100644
--- a/apps/ui/src/pages/Navigation/MainNavigation.tsx
+++ b/apps/ui/src/pages/Navigation/MainNavigation.tsx
@@ -35,7 +35,8 @@ import Tooltip from 'share-ui/components/Tooltip/Tooltip'
 import Chats from 'share-ui/components/Icon/Icons/components/Chats'
 import Integrations from 'share-ui/components/Icon/Icons/components/integrations'
 import FineTuning from 'share-ui/components/Icon/Icons/components/FineTuning'
-import Book from 'share-ui/components/Icon/Icons/components/Book'
+// eslint-disable-next-line import/no-named-as-default
+import Cloud from 'share-ui/components/Icon/Icons/components/Cloud'
 
 const MainNavigation = ({ user }: { user: any }) => {
   const domainEnv = import.meta.env
@@ -193,7 +194,7 @@ const MainNavigation = ({ user }: { user: any }) => {
             isActive={includes(active, 'pods')}
             onClick={() => onHandleClick('/pods')}
           >
-            <Book size={30} />
+            <Cloud size={30} fill={includes(active, 'pods') ? '#ffffff' : '#000000'} />
             {includes(active, 'pods') && <StyledCorner />}
           </StyledLi>
         </Tooltip>
@@ -362,6 +363,11 @@ const StyledSessionIcon = styled(Session)`
     fill: ${({ theme }) => theme.body.iconColor};
   }
 `
+export const StyledCloudOutlineIcon = styled(Cloud)`
+  path {
+    fill: ${({ theme }) => theme.body.iconColor};
+  }
+`
 const StyledBottomSection = styled.div`
   margin-top: auto;
 
diff --git a/apps/ui/src/pages/Pods/Details.tsx b/apps/ui/src/pages/Pods/Details.tsx
index 2e799db1..712661e7 100644
--- a/apps/ui/src/pages/Pods/Details.tsx
+++ b/apps/ui/src/pages/Pods/Details.tsx
@@ -24,7 +24,7 @@ const Details = () => {
     return (
         <Box 
             sx={{  
-                width: 'calc(100% + 18px)',
+                width: '100%',
                 boxSizing: 'border-box',
                 display: 'flex',
                 justifyContent: 'start'
@@ -68,7 +68,7 @@ const Details = () => {
 
                     <StyledPodTemplate>
                         <Box display={'flex'}>
-                            <img src="https://www.runpod.io/console/_next/static/media/pytorchLogo.d7f67168.svg" alt="" width={85} />
+                            <img src="https://cdn.worldvectorlogo.com/logos/elastic-cloud.svg" alt="" width={85} />
                             <Box
                                 display={'flex'}
                                 flexDirection={'column'}
@@ -76,10 +76,10 @@ const Details = () => {
                                 ml={3}
                             >
                                 <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14}>
-                                    RunPod Pytorch 2.0.1
+                                    Pytorch 2.0.1
                                 </Typography>
                                 <Typography color="rgba(34, 51, 84, 0.7)" fontSize={12}>
-                                    runpod/pytorch:2.0.1-py3.10-cuda11.8.0-devel-ubuntu22.04
+                                    pytorch:2.0.1-py3.10-cuda11.8.0-devel-ubuntu22.04
                                 </Typography>
                             </Box>
                         </Box>
diff --git a/apps/ui/src/pages/Pods/MainPod.tsx b/apps/ui/src/pages/Pods/MainPod.tsx
new file mode 100644
index 00000000..fb713245
--- /dev/null
+++ b/apps/ui/src/pages/Pods/MainPod.tsx
@@ -0,0 +1,36 @@
+import styled from 'styled-components'
+import { buttonStyles } from './styles'
+import Button from '@mui/material/Button'
+import { useNavigate } from 'react-router-dom'
+
+
+const MainPod = () => {
+  const navigate = useNavigate()
+
+    return (
+        <StyledContainer>
+            <Button 
+                onClick={() => navigate('/pods/create-pod')}
+                variant="contained"
+                sx={{
+                    ...buttonStyles,
+                    width: '400px',
+                    height: '150px'
+                }}
+                size='small'
+            >
+                Add new pod
+            </Button>
+        </StyledContainer>
+    )
+}
+
+export default MainPod
+
+const StyledContainer = styled.div`
+    width: 100%;
+    height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+`
\ No newline at end of file
diff --git a/apps/ui/src/pages/Pods/Pods.tsx b/apps/ui/src/pages/Pods/Pods.tsx
index 42949b81..b6232ad7 100644
--- a/apps/ui/src/pages/Pods/Pods.tsx
+++ b/apps/ui/src/pages/Pods/Pods.tsx
@@ -12,12 +12,12 @@ import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
 
 const cpu = [
-    {  cpu: 'runpod/base:0.5.1-cpu', ram: '46 GB', running: true  },
-    {  cpu: 'runpod/base:0.5.1-cpu', ram: '32 GB', running: false  },
-    {  cpu: 'runpod/base:0.5.1-cpu', ram: '16 GB', running: true  },
-    {  cpu: 'runpod/base:0.5.1-cpu', ram: '128 GB', running: false  },
-    {  cpu: 'runpod/base:0.5.1-cpu', ram: '46 GB', running: false  },
-    {  cpu: 'runpod/base:0.5.1-cpu', ram: '50 GB', running: true  },
+    {  cpu: 'base:0.5.1-cpu', ram: '46 GB', running: true  },
+    {  cpu: 'base:0.5.1-cpu', ram: '32 GB', running: false  },
+    {  cpu: 'base:0.5.1-cpu', ram: '16 GB', running: true  },
+    {  cpu: 'base:0.5.1-cpu', ram: '128 GB', running: false  },
+    {  cpu: 'base:0.5.1-cpu', ram: '46 GB', running: false  },
+    {  cpu: 'base:0.5.1-cpu', ram: '50 GB', running: true  },
 ]
 
 
@@ -48,7 +48,7 @@ const Pods = () => {
                                     mt={1} 
                                     sx={{ 
                                         width: '100%', 
-                                        background: 'rgb(217,217,217)',
+                                        background: 'rgba(217, 217, 217, 0.342)',
                                         borderStartStartRadius: '10px',
                                         borderEndStartRadius: '10px',
                                         cursor: 'pointer'
@@ -73,10 +73,10 @@ const Pods = () => {
                                         </Box>
 
                                         <Box display={'flex'} flexDirection={'column'} justifyContent={'center'}>
-                                            <Typography fontSize={13} fontWeight={400} sx={{
+                                            <Typography fontSize={13} fontWeight={500} sx={{
                                                 color: item.running ? 'green' : 'red',
-                                                background: item.running ? '#0eff2229' : '#ff0e0e1f',
-                                                padding: '2px 5px',
+                                                background: item.running ? 'rgba(0, 255, 110, 0.12)' : 'rgba(255, 0, 0, 0.12)',
+                                                padding: '4px 15px',
                                                 borderRadius: '8px'
                                             }}>
                                                  {item.running ? 'Running' : 'Stopped'}
diff --git a/apps/ui/src/pages/Pods/PodsContent.tsx b/apps/ui/src/pages/Pods/PodsContent.tsx
index e8931dd0..4597e608 100644
--- a/apps/ui/src/pages/Pods/PodsContent.tsx
+++ b/apps/ui/src/pages/Pods/PodsContent.tsx
@@ -51,7 +51,7 @@ const temp_data = {
 
 
 const PodsContent = () => {
-    const [selectPod, setSelectPod] = React.useState<null | number>(1) 
+    const [selectPod, setSelectPod] = React.useState<null | number>(null) 
 
     const data_keys = Object.keys(temp_data)
     return (
@@ -59,7 +59,7 @@ const PodsContent = () => {
             <StyledContainer>
                 <Box 
                     sx={{  
-                        width: 'calc(100% + 18px)',
+                        width: '100%',
                         boxSizing: 'border-box',
                         display: 'flex',
                         justifyContent: 'start'
@@ -104,6 +104,8 @@ const PodsContent = () => {
                     </>
                 }
 
+
+
             </StyledContainer>
         </StyledBox>
     )
diff --git a/apps/ui/src/pages/Pods/Price.tsx b/apps/ui/src/pages/Pods/Price.tsx
index eca50b40..44a5d965 100644
--- a/apps/ui/src/pages/Pods/Price.tsx
+++ b/apps/ui/src/pages/Pods/Price.tsx
@@ -1,56 +1,77 @@
 import Box from '@mui/material/Box';
-import { borderBoxStyles } from './styles'
+import { borderBoxStyles, buttonStyles } from './styles'
 import Typography from '@mui/material/Typography';
+import Button from '@mui/material/Button'
 
 
 const Price = () => {
     return (
-        
-        <Box 
-            sx={{  
-                width: 'calc(100% + 18px)',
+
+        <Box
+            sx={{
+                width: '100%',
                 boxSizing: 'border-box',
-                display: 'flex',
-                justifyContent: 'space-between'
             }}
         >
-            <Box
-                sx={{ ...borderBoxStyles, width: '49%' }}
-                display={'flex'}
-                flexDirection={'column'}
+
+            <Box 
+                sx={{  
+                    display: 'flex',
+                    justifyContent: 'space-between'
+                }}
             >
-                <Typography fontSize={16} fontWeight={700}>
-                    Pricing Summary
-                </Typography>
-                <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} mt={2} fontWeight={400}>
-                    GPU Cost: $0.74 / hr
-                </Typography>
-                <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
-                    Running Disk Cost: $0.006 / hr
-                </Typography>
-                <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
-                    Exited Disk Cost: $0.006 / hr
-                </Typography>
+                <Box
+                    sx={{ ...borderBoxStyles, width: '49%' }}
+                    display={'flex'}
+                    flexDirection={'column'}
+                >
+                    <Typography fontSize={16} fontWeight={700}>
+                        Pricing Summary
+                    </Typography>
+                    <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} mt={2} fontWeight={400}>
+                        GPU Cost: $0.74 / hr
+                    </Typography>
+                    <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
+                        Running Disk Cost: $0.006 / hr
+                    </Typography>
+                    <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
+                        Exited Disk Cost: $0.006 / hr
+                    </Typography>
+                </Box>
+                <Box
+                    sx={{ ...borderBoxStyles, width: '49%' }}
+                    display={'flex'}
+                    flexDirection={'column'}
+                >
+                    <Typography fontSize={16} fontWeight={700}>
+                        Pricing Summary
+                    </Typography>
+                    <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} mt={2} fontWeight={400}>
+                        GPU Cost: $0.74 / hr
+                    </Typography>
+                    <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
+                        Running Disk Cost: $0.006 / hr
+                    </Typography>
+                    <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
+                        Exited Disk Cost: $0.006 / hr
+                    </Typography>
+                </Box>
+                
             </Box>
-            <Box
-                sx={{ ...borderBoxStyles, width: '49%' }}
-                display={'flex'}
-                flexDirection={'column'}
-            >
-                <Typography fontSize={16} fontWeight={700}>
-                    Pricing Summary
-                </Typography>
-                <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} mt={2} fontWeight={400}>
-                    GPU Cost: $0.74 / hr
-                </Typography>
-                <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
-                    Running Disk Cost: $0.006 / hr
-                </Typography>
-                <Typography color="rgba(34, 51, 84, 0.7)" fontSize={14} fontWeight={400}>
-                    Exited Disk Cost: $0.006 / hr
-                </Typography>
+
+            <Box>
+                <Button 
+                    variant="contained"
+                    sx={{
+                        ...buttonStyles,
+                        width: '100%',
+                    }}
+                >
+                    Deploy On-Demand
+                </Button>
             </Box>
         </Box>
+        
     )
 }
 
diff --git a/apps/ui/src/pages/Pods/index.ts b/apps/ui/src/pages/Pods/index.ts
index c60760d7..4ca43647 100644
--- a/apps/ui/src/pages/Pods/index.ts
+++ b/apps/ui/src/pages/Pods/index.ts
@@ -1,2 +1,3 @@
 export { default as Pods } from './Pods'
-export { default as PodsContent } from './PodsContent'
\ No newline at end of file
+export { default as PodsContent } from './PodsContent'
+export { default as MainPod } from './MainPod'
\ No newline at end of file
diff --git a/apps/ui/src/share-ui/components/Icon/Icons/components/Cloud.tsx b/apps/ui/src/share-ui/components/Icon/Icons/components/Cloud.tsx
new file mode 100644
index 00000000..bdae81a6
--- /dev/null
+++ b/apps/ui/src/share-ui/components/Icon/Icons/components/Cloud.tsx
@@ -0,0 +1,26 @@
+/* eslint-disable */
+/* tslint:disable */
+import * as React from 'react'
+export interface Cloud extends React.SVGAttributes<SVGElement> {
+  size?: string | number
+}
+const Cloud: React.FC<Cloud> = ({ size, ...props }) => (
+    <svg fill="#000000" width={ size || "20" } height={ size || "20" } {...props} version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" 
+         viewBox="0 0 485 485" xmlSpace="preserve">
+    <g>
+        <path d="M485,214.04c0-39.199-28.706-71.819-66.201-77.947c-11.771-51.31-57.693-88.639-111.478-88.639
+            c-48.103,0-90.977,30.346-107.368,74.864c-55.911,12.776-100.346,57.227-112.081,114.524C38.376,243.191,0,285.59,0,336.783
+            c0,55.561,45.202,100.763,100.763,100.763h264.602c55.561,0,100.763-45.202,100.763-100.763c0-20.852-6.369-40.242-17.261-56.334
+            C471.077,266.202,485,241.528,485,214.04z M307.321,77.454c42.765,0,78.79,31.97,83.798,74.365l1.564,13.24h13.332
+            c27.01,0,48.984,21.973,48.984,48.98c0,18.897-10.598,35.657-27.051,43.832c-14.023-11.145-31.071-18.641-49.695-21.031
+            c-13.857-67.654-73.302-117.397-143.4-118.233C249.819,93.616,277.171,77.454,307.321,77.454z M365.364,407.546H100.763
+            C61.744,407.546,30,375.802,30,336.783s31.746-70.763,70.768-70.763H114.1l1.564-13.24
+            c7.018-59.398,57.488-104.191,117.399-104.191s110.382,44.792,117.399,104.191l1.564,13.24h13.332
+            c39.021,0,70.768,31.744,70.768,70.763S404.383,407.546,365.364,407.546z"/>
+    </g>
+    </svg>
+)
+Cloud.displayName = 'Book'
+export default Cloud
+/* tslint:enable */
+/* eslint-enable */