diff --git a/index.html b/index.html
index 3386ca010..a667d1ecf 100644
--- a/index.html
+++ b/index.html
@@ -14,4 +14,4 @@
 	<script type="module" src="/src/main.jsx"></script>
 </body>
 
-</html>
+</html>
\ No newline at end of file
diff --git a/package.json b/package.json
index 52b2eb0f0..2853123a8 100644
--- a/package.json
+++ b/package.json
@@ -19,9 +19,9 @@
 		"@mui/lab": "6.0.0-beta.28",
 		"@mui/material": "6.4.5",
 		"@mui/x-charts": "^7.5.1",
+		"@reduxjs/toolkit": "2.6.0",
 		"@mui/x-data-grid": "7.27.0",
 		"@mui/x-date-pickers": "7.27.0",
-		"@reduxjs/toolkit": "2.6.0",
 		"@solana/wallet-adapter-base": "0.9.23",
 		"@solana/wallet-adapter-material-ui": "0.16.34",
 		"@solana/wallet-adapter-react": "0.15.35",
@@ -32,16 +32,18 @@
 		"dayjs": "1.11.13",
 		"flag-icons": "7.3.2",
 		"html2canvas": "^1.4.1",
+		"maplibre-gl": "5.1.1",
 		"i18next": "^24.2.2",
 		"immutability-helper": "^3.1.1",
 		"joi": "17.13.3",
-		"maplibre-gl": "5.1.1",
+		"jwt-decode": "^4.0.0",
 		"mui-color-input": "^5.0.1",
 		"react": "18.3.1",
 		"react-dnd": "^16.0.1",
 		"react-dnd-html5-backend": "^16.0.1",
 		"react-dom": "^18.2.0",
 		"react-i18next": "^15.4.0",
+		"react-icons": "5.4.0",
 		"react-redux": "9.2.0",
 		"react-router": "^6.23.0",
 		"react-router-dom": "^6.23.1",
diff --git a/src/Components/Buttons/RoundGradientButton.jsx b/src/Components/Buttons/RoundGradientButton.jsx
new file mode 100644
index 000000000..f9e14735c
--- /dev/null
+++ b/src/Components/Buttons/RoundGradientButton.jsx
@@ -0,0 +1,30 @@
+import React from "react";
+import Button from "@mui/material/Button";
+import { styled } from "@mui/material/styles";
+
+const RoundGradientButton = styled(Button)(({ theme }) => ({
+  position: "relative",
+  border: "5px solid transparent",
+  backgroundClip: "padding-box",
+  borderRadius: 30,
+  fontSize: "1.2rem",
+  color: theme.palette.primary.contrastText,
+  backgroundColor: theme.palette.background.main,
+
+  "&:after": {
+    position: "absolute",
+    top: -3,
+    left: -3,
+    right: -3,
+    bottom: -3,
+    background:
+      theme.palette.mode === "dark"
+        ? "linear-gradient(90deg, #842bd2, #ff5451, #8c52ff)"
+        : "linear-gradient(90deg, #842bd2, #ff5451, #8c52ff)",
+    content: '""',
+    zIndex: -1,
+    borderRadius: 30,
+  },
+}));
+
+export default RoundGradientButton;
diff --git a/src/Components/Charts/DePINStatusPageBarChart/index.jsx b/src/Components/Charts/DePINStatusPageBarChart/index.jsx
new file mode 100644
index 000000000..65c6278f1
--- /dev/null
+++ b/src/Components/Charts/DePINStatusPageBarChart/index.jsx
@@ -0,0 +1,181 @@
+// Components
+import { Stack, Box, Tooltip, Typography } from "@mui/material";
+
+// Utils
+import { useTheme } from "@emotion/react";
+import { useState, useEffect } from "react";
+import PropTypes from "prop-types";
+import { formatDateWithTz } from "../../../Utils/timeUtils";
+import { useSelector } from "react-redux";
+
+const PlaceholderCheck = ({ daysToShow }) => {
+	const theme = useTheme();
+
+	return (
+		<Box
+			width={`calc(30vw / ${daysToShow})`}
+			height="100%"
+			backgroundColor={theme.palette.primary.lowContrast}
+			sx={{
+				borderRadius: theme.spacing(1.5),
+			}}
+		/>
+	);
+};
+
+PlaceholderCheck.propTypes = {
+	daysToShow: PropTypes.number,
+};
+
+const Check = ({ check, daysToShow }) => {
+	const [animate, setAnimate] = useState(false);
+
+	const theme = useTheme();
+	useEffect(() => {
+		setAnimate(true);
+	}, []);
+	const uiTimezone = useSelector((state) => state.ui.timezone);
+
+	return (
+		<Tooltip
+			title={
+				<>
+					<Typography>
+						{formatDateWithTz(check._id, "ddd, MMMM D, YYYY", uiTimezone)}
+					</Typography>
+					<Box mt={theme.spacing(2)}>
+						<Stack
+							display="inline-flex"
+							direction="row"
+							justifyContent="space-between"
+							gap={theme.spacing(4)}
+						>
+							<Typography
+								component="span"
+								sx={{ opacity: 0.8 }}
+							>
+								Uptime percentage
+							</Typography>
+							<Typography component="span">
+								{check.upPercentage.toFixed(2)}
+								<Typography
+									component="span"
+									sx={{ opacity: 0.8 }}
+								>
+									{" "}
+									%
+								</Typography>
+							</Typography>
+						</Stack>
+					</Box>
+				</>
+			}
+			placement="top"
+			key={`check-${check?._id}`}
+			slotProps={{
+				popper: {
+					className: "bar-tooltip",
+					modifiers: [
+						{
+							name: "offset",
+							options: {
+								offset: [0, -10],
+							},
+						},
+					],
+					sx: {
+						"& .MuiTooltip-tooltip": {
+							backgroundColor: theme.palette.secondary.main,
+							border: 1,
+							borderColor: theme.palette.primary.lowContrast,
+							borderRadius: theme.shape.borderRadius,
+							boxShadow: theme.shape.boxShadow,
+							px: theme.spacing(4),
+							py: theme.spacing(3),
+						},
+						"& .MuiTooltip-tooltip p": {
+							/* TODO Font size should point to theme */
+							fontSize: 12,
+							color: theme.palette.secondary.contrastText,
+							fontWeight: 500,
+						},
+						"& .MuiTooltip-tooltip span": {
+							/* TODO Font size should point to theme */
+							fontSize: 11,
+							color: theme.palette.secondary.contrastText,
+							fontWeight: 600,
+						},
+					},
+				},
+			}}
+		>
+			<Box
+				position="relative"
+				width={`calc(30vw / ${daysToShow})`}
+				height="100%"
+				backgroundColor={theme.palette.error.lowContrast}
+				sx={{
+					borderRadius: theme.spacing(1.5),
+				}}
+			>
+				<Box
+					position="absolute"
+					bottom={0}
+					width="100%"
+					height={`${animate ? check.upPercentage : 0}%`}
+					backgroundColor={theme.palette.success.lowContrast}
+					sx={{
+						borderRadius: theme.spacing(1.5),
+						transition: "height 600ms cubic-bezier(0.4, 0, 0.2, 1)",
+					}}
+				/>
+			</Box>
+		</Tooltip>
+	);
+};
+
+Check.propTypes = {
+	check: PropTypes.object,
+	daysToShow: PropTypes.number,
+};
+
+const DePINStatusPageBarChart = ({ checks = [], daysToShow = 30 }) => {
+	if (checks.length !== daysToShow) {
+		const placeholders = Array(daysToShow - checks.length).fill("placeholder");
+		checks = [...checks, ...placeholders];
+	}
+	return (
+		<Stack
+			direction="row"
+			justifyContent="space-between"
+			width="100%"
+			flexWrap="nowrap"
+			height="50px"
+		>
+			{checks.map((check) => {
+				if (check === "placeholder") {
+					return (
+						<PlaceholderCheck
+							key={Math.random()}
+							daysToShow={daysToShow}
+						/>
+					);
+				}
+				return (
+					<Check
+						key={Math.random()}
+						check={check}
+						daysToShow={daysToShow}
+					/>
+				);
+			})}
+		</Stack>
+	);
+};
+
+DePINStatusPageBarChart.propTypes = {
+	checks: PropTypes.array,
+	daysToShow: PropTypes.number,
+};
+
+export default DePINStatusPageBarChart;
diff --git a/src/Components/Common/AppBar.jsx b/src/Components/Common/AppBar.jsx
new file mode 100644
index 000000000..df0660cf5
--- /dev/null
+++ b/src/Components/Common/AppBar.jsx
@@ -0,0 +1,216 @@
+import { useState } from "react";
+import { styled, alpha } from "@mui/material/styles";
+import Box from "@mui/material/Box";
+import AppBar from "@mui/material/AppBar";
+import Toolbar from "@mui/material/Toolbar";
+import Button from "@mui/material/Button";
+import IconButton from "@mui/material/IconButton";
+import Container from "@mui/material/Container";
+import MenuItem from "@mui/material/MenuItem";
+import Drawer from "@mui/material/Drawer";
+import MenuIcon from "@mui/icons-material/Menu";
+import CloseRoundedIcon from "@mui/icons-material/CloseRounded";
+import ThemeSwitch from "../ThemeSwitch";
+import { useTheme } from "@mui/material/styles";
+import { useSelector } from "react-redux";
+import { useLocation, useNavigate } from "react-router-dom";
+
+const StyledToolbar = styled(Toolbar)(({ theme, mode }) => ({
+	display: "flex",
+	alignItems: "center",
+	justifyContent: "space-between",
+	flexShrink: 0,
+	borderRadius: `calc(${theme.shape.borderRadius}px + 4px)`,
+	backdropFilter: "blur(24px)",
+	border: "1px solid",
+	borderColor:
+		mode === "light"
+			? alpha(theme.palette.common.black, 0.1)
+			: alpha(theme.palette.common.white, 0.1),
+	backgroundColor:
+		mode === "light"
+			? alpha(theme.palette.common.white, 0.4)
+			: alpha(theme.palette.common.black, 0.4),
+	boxShadow: theme.shadows[3],
+	padding: "8px 12px",
+}));
+
+const StyledMenuItem = styled(MenuItem)(({ theme }) => ({
+	fontSize: "1.1rem",
+	margin: theme.spacing(4, 2),
+}));
+
+const AppAppBar = () => {
+	const [open, setOpen] = useState(false);
+	const theme = useTheme();
+	const mode = useSelector((state) => state.ui.mode);
+	const location = useLocation();
+	const navigate = useNavigate();
+
+	// Debugging: Log the current theme mode
+	console.log("Current theme mode:", mode);
+
+	const logoSrc =
+		mode === "light" ? "/images/prism-black.png" : "/images/prism-white.png";
+
+	const toggleDrawer = (newOpen) => () => {
+		setOpen(newOpen);
+	};
+
+	const handleScroll = (id) => {
+		if (location.pathname === "/") {
+			const element = document.getElementById(id);
+			if (element) {
+				element.scrollIntoView({ behavior: "smooth" });
+			}
+		} else {
+			navigate(`/#${id}`);
+		}
+	};
+
+	return (
+		<AppBar
+			position="fixed"
+			sx={{
+				boxShadow: 0,
+				bgcolor: "transparent",
+				backgroundImage: "none",
+				border: "none",
+				mt: "calc(var(--template-frame-height, 0px) + 28px)",
+			}}
+		>
+			<Container maxWidth="lg">
+				<StyledToolbar
+					variant="dense"
+					disableGutters
+					mode={mode}
+				>
+					<Box sx={{ flexGrow: 1, display: "flex", alignItems: "center", px: 0 }}>
+						<img
+							src={logoSrc}
+							alt="Prism Logo"
+							style={{
+								height: "auto",
+								width: "auto",
+								marginRight: "10px",
+								maxHeight: "32px",
+							}}
+						/>
+						<Box sx={{ display: { xs: "none", md: "flex" } }}>
+							<Button
+								variant="text"
+								color="info"
+								size="large"
+								onClick={() => handleScroll("features")}
+							>
+								Features
+							</Button>
+							<Button
+								variant="text"
+								color="info"
+								size="large"
+								onClick={() => handleScroll("highlights")}
+							>
+								Highlights
+							</Button>
+							<Button
+								variant="text"
+								color="info"
+								size="large"
+								onClick={() => handleScroll("faq")}
+							>
+								FAQ
+							</Button>
+							<Button
+								variant="text"
+								color="info"
+								size="large"
+								href="https://uprock.com/blog"
+							>
+								Blog
+							</Button>
+						</Box>
+					</Box>
+					<Box
+						sx={{
+							display: { xs: "none", md: "flex" },
+							gap: 1,
+							alignItems: "center",
+						}}
+					>
+						{/* <Button color="primary" variant="text" size="small">
+              Sign in
+            </Button>
+            <Button color="primary" variant="contained" size="small">
+              Sign up
+            </Button> */}
+					</Box>
+					<Box
+						sx={{
+							display: { xs: "flex", md: "none" },
+
+							gap: 1,
+						}}
+					>
+						<IconButton
+							aria-label="Menu button"
+							onClick={toggleDrawer(true)}
+						>
+							<MenuIcon sx={{ color: theme.palette.text.primary }} />
+						</IconButton>
+						<Drawer
+							anchor="top"
+							open={open}
+							onClose={toggleDrawer(false)}
+							PaperProps={{
+								sx: {
+									top: 0,
+									marginTop: 0,
+									borderRadius: 0,
+									backgroundColor: theme.palette.background.paper,
+								},
+							}}
+						>
+							<Box sx={{ p: 4, backgroundColor: theme.palette.background.main }}>
+								<Box
+									sx={{
+										display: "flex",
+										justifyContent: "flex-end",
+									}}
+								>
+									<IconButton onClick={toggleDrawer(false)}>
+										<CloseRoundedIcon sx={{ color: theme.palette.text.primary }} />
+									</IconButton>
+								</Box>
+
+								<StyledMenuItem>Features</StyledMenuItem>
+								<StyledMenuItem>Testimonials</StyledMenuItem>
+								<StyledMenuItem>Highlights</StyledMenuItem>
+								<StyledMenuItem>FAQ</StyledMenuItem>
+								<StyledMenuItem
+									component="a"
+									href="https://uprock.com/blog"
+								>
+									Blog
+								</StyledMenuItem>
+								{/* <MenuItem>
+                  <Button color="primary" variant="contained" fullWidth>
+                    Sign up
+                  </Button>
+                </MenuItem>
+                <MenuItem>
+                  <Button color="primary" variant="outlined" fullWidth>
+                    Sign in
+                  </Button>
+                </MenuItem> */}
+							</Box>
+						</Drawer>
+					</Box>
+					<ThemeSwitch />
+				</StyledToolbar>
+			</Container>
+		</AppBar>
+	);
+};
+
+export default AppAppBar;
diff --git a/src/Components/Common/Footer.jsx b/src/Components/Common/Footer.jsx
new file mode 100644
index 000000000..4c33512be
--- /dev/null
+++ b/src/Components/Common/Footer.jsx
@@ -0,0 +1,214 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Container from '@mui/material/Container';
+import IconButton from '@mui/material/IconButton';
+import Link from '@mui/material/Link';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import { FaFacebook, FaLinkedin, FaGithub, FaTwitter, FaEnvelope } from 'react-icons/fa';
+
+
+function Copyright() {
+  return (
+    <Typography sx={{ color: 'text.secondary', mt: 1 }}>
+      {'Copyright © '}
+      <Link color="text.secondary" href="https://prism.uprock.com/">
+        UpRock
+      </Link>
+      &nbsp;
+      {new Date().getFullYear()}
+    </Typography>
+  );
+}
+
+export default function Footer() {
+  return (
+    <Container
+      sx={{
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        gap: { xs: 4, sm: 8 },
+        py: { xs: 24, sm: 24 },
+        px: { xs: 12, sm: 12 },
+        textAlign: { sm: 'center', md: 'left' },
+      }}
+    >
+     
+      <Box
+        sx={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          pt: { xs: 4, sm: 8 },
+          width: '100%',
+          borderColor: 'divider',
+        }}
+      >
+        <div>
+          <Link color="text.secondary" href="https://uprock.com/privacy-policy">
+            Privacy Policy
+          </Link>
+          <Typography sx={{ display: 'inline', mx: 0.5, opacity: 0.5 }}>
+            &nbsp;•&nbsp;
+          </Typography>
+          <Link color="text.secondary" href="https://uprock.com/terms-of-use">
+            Terms of Service
+          </Link>
+          <Copyright />
+        </div>
+        <Stack
+          direction="row"
+          spacing={1}
+          useFlexGap
+          sx={{ justifyContent: 'left', color: 'text.secondary' }}
+        >
+          <IconButton
+            color="inherit"
+            size="small"
+            href="mailto:prism@uprock.com?subject=Interested%20in%20UpRock%20Prism"
+            aria-label="Contact Us"
+            sx={{ alignSelf: 'center' }}
+          >
+            <FaEnvelope />
+          </IconButton>
+          <IconButton
+            color="inherit"
+            size="small"
+            href="https://facebook.com/uprockcom"
+            aria-label="Facebook"
+            sx={{ alignSelf: 'center' }}
+          >
+            <FaFacebook />
+          </IconButton>
+          <IconButton
+            color="inherit"
+            size="small"
+            href="https://x.com/uprockcom"
+            aria-label="X"
+            sx={{ alignSelf: 'center' }}
+          >
+            <FaTwitter />
+          </IconButton>
+          <IconButton
+            color="inherit"
+            size="small"
+            href="https://www.linkedin.com/company/uprock/"
+            aria-label="LinkedIn"
+            sx={{ alignSelf: 'center' }}
+          >
+            <FaLinkedin />
+          </IconButton>
+          <IconButton
+            color="inherit"
+            size="small"
+            href="https://github.com/uprockcom"
+            aria-label="GitHub"
+            sx={{ alignSelf: 'center' }}
+          >
+            <FaGithub />
+          </IconButton>
+
+        </Stack>
+      </Box>
+
+      <Box
+        sx={{
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center',
+          mt: 4,
+        }}
+      >
+        <Typography variant="h2" sx={{ color: 'text.secondary' }}>
+          Made with ❤️ by&nbsp;
+          <Link href="https://uprock.com" color="inherit" sx={{ mx: 0.5 }}>
+            UpRock&nbsp;
+          </Link>
+          &&nbsp; 
+          <Link href="https://bluewavelabs.ca" color="inherit" sx={{ mx: 0.5 }}>
+            Bluewave Labs
+          </Link>
+        </Typography>
+        <Box
+          sx={{
+            display: 'flex',
+            alignItems: 'center',
+            mt: 2,
+          }}
+        >
+          <Typography variant="h2" sx={{ color: 'text.secondary', mr: 1 }}>
+            Built on&nbsp;
+          </Typography>
+          <svg
+            id="Layer_1"
+            xmlns="http://www.w3.org/2000/svg"
+            xmlnsXlink="http://www.w3.org/1999/xlink"
+            x="0px"
+            y="0px"
+            viewBox="0 0 397.7 311.7"
+            xmlSpace="preserve"
+            width="15"
+            height="15"
+          >
+            <style type="text/css">
+              {`.st0{fill:url(#SVGID_1_);}
+                .st1{fill:url(#SVGID_2_);}
+                .st2{fill:url(#SVGID_3_);}`}
+            </style>
+            <linearGradient
+              id="SVGID_1_"
+              gradientUnits="userSpaceOnUse"
+              x1="360.8791"
+              y1="351.4553"
+              x2="141.213"
+              y2="-69.2936"
+              gradientTransform="matrix(1 0 0 -1 0 314)"
+            >
+              <stop offset="0" style={{ stopColor: 'rgb(0, 255, 163)' }} />
+              <stop offset="1" style={{ stopColor: 'rgb(220, 31, 255)' }} />
+            </linearGradient>
+            <path
+              className="st0"
+              d="M64.6,237.9c2.4-2.4,5.7-3.8,9.2-3.8h317.4c5.8,0,8.7,7,4.6,11.1l-62.7,62.7c-2.4,2.4-5.7,3.8-9.2,3.8H6.5 c-5.8,0-8.7-7-4.6-11.1L64.6,237.9z"
+            />
+            <linearGradient
+              id="SVGID_2_"
+              gradientUnits="userSpaceOnUse"
+              x1="264.8291"
+              y1="401.6014"
+              x2="45.163"
+              y2="-19.1475"
+              gradientTransform="matrix(1 0 0 -1 0 314)"
+            >
+              <stop offset="0" style={{ stopColor: 'rgb(0, 255, 163)' }} />
+              <stop offset="1" style={{ stopColor: 'rgb(220, 31, 255)' }} />
+            </linearGradient>
+            <path
+              className="st1"
+              d="M64.6,3.8C67.1,1.4,70.4,0,73.8,0h317.4c5.8,0,8.7,7,4.6,11.1l-62.7,62.7c-2.4,2.4-5.7,3.8-9.2,3.8H6.5 c-5.8,0-8.7-7-4.6-11.1L64.6,3.8z"
+            />
+            <linearGradient
+              id="SVGID_3_"
+              gradientUnits="userSpaceOnUse"
+              x1="312.5484"
+              y1="376.688"
+              x2="92.8822"
+              y2="-44.061"
+              gradientTransform="matrix(1 0 0 -1 0 314)"
+            >
+              <stop offset="0" style={{ stopColor: 'rgb(0, 255, 163)' }} />
+              <stop offset="1" style={{ stopColor: 'rgb(220, 31, 255)' }} />
+            </linearGradient>
+            <path
+              className="st2"
+              d="M333.1,120.1c-2.4-2.4-5.7-3.8-9.2-3.8H6.5c-5.8,0-8.7,7-4.6,11.1l62.7,62.7c2.4,2.4,5.7,3.8,9.2,3.8h317.4 c5.8,0,8.7-7,4.6-11.1L333.1,120.1z"
+            />
+          </svg>
+          <Typography variant="h2" sx={{ color: 'text.secondary', ml: 1 }}>
+          &nbsp;Solana
+          </Typography>
+        </Box>
+      </Box>
+    </Container>
+  );
+}
diff --git a/src/Components/Dot/index.jsx b/src/Components/Dot/index.jsx
index 0fd51730f..0676d0a6f 100644
--- a/src/Components/Dot/index.jsx
+++ b/src/Components/Dot/index.jsx
@@ -1,6 +1,6 @@
 import PropTypes from "prop-types";
 
-const Dot = ({ color = "gray", size = "4px" }) => {
+const Dot = ({ color = "gray", size = "4px", style }) => {
 	return (
 		<span
 			style={{
@@ -10,6 +10,7 @@ const Dot = ({ color = "gray", size = "4px" }) => {
 				borderRadius: "50%",
 				backgroundColor: color,
 				opacity: 0.8,
+				...style,
 			}}
 		/>
 	);
diff --git a/src/Components/Home/ArcadeEmbed.jsx b/src/Components/Home/ArcadeEmbed.jsx
new file mode 100644
index 000000000..4a522874d
--- /dev/null
+++ b/src/Components/Home/ArcadeEmbed.jsx
@@ -0,0 +1,17 @@
+import React from 'react';
+
+export function ArcadeEmbed() {
+  return (
+    <div style={{ position: 'relative', paddingBottom: 'calc(57.419936851601264% + 41px)', height: 0, width: '100%' }}>
+      <iframe
+        src="https://demo.arcade.software/sbWTOnn9WYdlTewqV7HI?embed&embed_mobile=tab&embed_desktop=inline&show_copy_link=true"
+        title="Explore Prism's Data Management Capabilities"
+        frameBorder="0"
+        loading="lazy"
+        allowFullScreen
+        allow="clipboard-write"
+        style={{ position: 'absolute', top: 0, left: 0, width: '100%', height: '100%', colorScheme: 'light' }}
+      />
+    </div>
+  );
+} 
\ No newline at end of file
diff --git a/src/Components/Home/Divider.jsx b/src/Components/Home/Divider.jsx
new file mode 100644
index 000000000..c00070c05
--- /dev/null
+++ b/src/Components/Home/Divider.jsx
@@ -0,0 +1,33 @@
+import React from 'react';
+import { Divider as MUIDivider } from '@mui/material';
+
+const Divider = () => {
+  return (
+    <MUIDivider
+      sx={{
+        background: 'linear-gradient(90deg, #842bd2, #ff5451, #8c52ff, #00bf63, #842bd2)',
+        backgroundSize: '400% 400%',
+        animation: 'gradientAnimation 10s ease infinite',
+        height: '2px', 
+        opacity: 0.3,
+      }}
+    />
+  );
+};
+
+export default Divider;
+
+const styles = `
+@keyframes gradientAnimation {
+  0% { background-position: 0% 50%; }
+  50% { background-position: 100% 50%; }
+  100% { background-position: 0% 50%; }
+}
+`;
+
+if (typeof document !== 'undefined') {
+  const styleSheet = document.createElement("style");
+  styleSheet.type = "text/css";
+  styleSheet.innerText = styles;
+  document.head.appendChild(styleSheet);
+} 
\ No newline at end of file
diff --git a/src/Components/Home/FAQ.jsx b/src/Components/Home/FAQ.jsx
new file mode 100644
index 000000000..726121c71
--- /dev/null
+++ b/src/Components/Home/FAQ.jsx
@@ -0,0 +1,158 @@
+import React from 'react';
+import Accordion from '@mui/material/Accordion';
+import AccordionDetails from '@mui/material/AccordionDetails';
+import AccordionSummary from '@mui/material/AccordionSummary';
+import Box from '@mui/material/Box';
+import Container from '@mui/material/Container';
+import Link from '@mui/material/Link';
+import Typography from '@mui/material/Typography';
+import { FaChevronDown } from 'react-icons/fa';
+import { useTheme } from '@mui/material/styles';
+
+export default function FAQ() {
+  const [expanded, setExpanded] = React.useState([]);
+  const theme = useTheme();
+
+  const handleChange =
+    (panel) => (event, isExpanded) => {
+      setExpanded(
+        isExpanded
+          ? [...expanded, panel]
+          : expanded.filter((item) => item !== panel),
+      );
+    };
+
+  return (
+    <Container
+      id="faq"
+      sx={{
+        py: { xs: 24, sm: 24 },
+        px: { xs: 12, sm: 12 },
+        position: 'relative',
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        gap: { xs: 3, sm: 6 },
+      }}
+    >
+      <Typography
+        component="h2"
+        variant="h4"
+        sx={{
+          color: 'text.primary',
+          width: { sm: '100%', md: '60%' },
+          textAlign: { sm: 'left', md: 'center' },
+          fontFamily: "BabaPro",
+        }}
+      >
+        Frequently Asked Questions
+      </Typography>
+      <Box sx={{ width: '100%' }}>
+        <Accordion
+          expanded={expanded.includes('panel1')}
+          onChange={handleChange('panel1')}
+          sx={{
+            borderRadius: 2,
+            px: 6,
+          }}
+        >
+          <AccordionSummary
+            expandIcon={<FaChevronDown color={theme.palette.text.primary} />}
+            aria-controls="panel1d-content"
+            id="panel1d-header"
+          >
+            <Typography component="span" variant="subtitle1" sx={{ mr: 10, fontWeight: 'bold' }}>
+              How does UpRock Prism ensure reliable uptime monitoring?
+            </Typography>
+          </AccordionSummary>
+          <AccordionDetails>
+            <Typography
+              gutterBottom
+              sx={{ maxWidth: { sm: '100%', md: '70%' }, pb: 6 }}
+            >
+              UpRock Prism leverages a decentralized network of real devices across the globe, providing continuous and accurate monitoring of your website's uptime and performance.
+            </Typography>
+          </AccordionDetails>
+        </Accordion>
+        <Accordion
+          expanded={expanded.includes('panel2')}
+          onChange={handleChange('panel2')}
+          sx={{
+            borderRadius: 2,
+            px: 6,
+          }}
+        >
+          <AccordionSummary
+            expandIcon={<FaChevronDown color={theme.palette.text.primary} />}
+            aria-controls="panel2d-content"
+            id="panel2d-header"
+          >
+            <Typography component="span" variant="subtitle1" sx={{ mr: 10, fontWeight: 'bold' }}>
+              What kind of insights can I gain from UpRock Prism?
+            </Typography>
+          </AccordionSummary>
+          <AccordionDetails>
+            <Typography
+              gutterBottom
+              sx={{ maxWidth: { sm: '100%', md: '70%' }, pb: 6 }}
+            >
+              UpRock Prism provides detailed insights into your website's performance, including load times, downtime incidents, and speed test metrics, helping you optimize and improve your digital presence.
+            </Typography>
+          </AccordionDetails>
+        </Accordion>
+        <Accordion
+          expanded={expanded.includes('panel3')}
+          onChange={handleChange('panel3')}
+          sx={{
+            borderRadius: 2,
+            px: 6,
+          }}
+        >
+          <AccordionSummary
+            expandIcon={<FaChevronDown color={theme.palette.text.primary} />}
+            aria-controls="panel3d-content"
+            id="panel3d-header"
+          >
+            <Typography component="span" variant="subtitle1" sx={{ mr: 10, fontWeight: 'bold' }}>
+              How does the decentralized network benefit my business?
+            </Typography>
+          </AccordionSummary>
+          <AccordionDetails>
+            <Typography
+              gutterBottom
+              sx={{ maxWidth: { sm: '100%', md: '70%' }, pb: 6 }}
+            >
+              The decentralized network ensures that data is collected from diverse locations, providing a comprehensive view of your website's performance globally, and reducing the risk of single points of failure.
+            </Typography>
+          </AccordionDetails>
+        </Accordion>
+        {/* <Accordion
+          expanded={expanded.includes('panel4')}
+          onChange={handleChange('panel4')}
+          sx={{
+            borderRadius: 2,
+            px: 6,
+          }}
+        >
+          <AccordionSummary
+            expandIcon={<FaChevronDown color={theme.palette.text.primary} />}
+            aria-controls="panel4d-content"
+            id="panel4d-header"
+          >
+            <Typography component="span" variant="subtitle1" sx={{ mr: 10, fontWeight: 'bold' }}>
+              Is UpRock Prism easy to integrate with existing systems?
+            </Typography>
+          </AccordionSummary>
+          <AccordionDetails>
+            <Typography
+              gutterBottom
+              sx={{ maxWidth: { sm: '100%', md: '70%' }, pb: 6 }}
+            >
+              Yes, UpRock Prism is designed to seamlessly integrate with your existing infrastructure, providing easy setup and compatibility with various platforms and tools.
+            </Typography>
+          </AccordionDetails>
+        </Accordion> */}
+      </Box>
+    </Container>
+  );
+}
diff --git a/src/Components/Home/Features.jsx b/src/Components/Home/Features.jsx
new file mode 100644
index 000000000..077094121
--- /dev/null
+++ b/src/Components/Home/Features.jsx
@@ -0,0 +1,189 @@
+import { Box, Container, Typography, Stack, Card } from "@mui/material";
+import {
+	FaGlobe,
+	FaTachometerAlt,
+	FaServer,
+	FaDocker,
+	FaHeartbeat,
+	FaExclamationTriangle,
+	FaEnvelope,
+	FaCalendarAlt,
+	FaLock,
+} from "react-icons/fa";
+import { useTheme } from "@mui/material/styles";
+import { useSelector } from "react-redux";
+
+const features = [
+	{
+		title: "Website Monitoring",
+		description:
+			"Leverage our global network to ensure your website is always up and running, with real-time performance insights from every corner of the world.",
+		icon: FaGlobe,
+	},
+	{
+		title: "Page Speed Insights",
+		description:
+			"Optimize your site with precise speed metrics and recommendations, powered by data from a worldwide community of real users.",
+		icon: FaTachometerAlt,
+	},
+	{
+		title: "Infrastructure Monitoring",
+		description:
+			"Gain comprehensive visibility into your systems with community-driven insights on CPU, memory, and disk usage.",
+		icon: FaServer,
+	},
+	{
+		title: "Docker Monitoring",
+		description:
+			"Monitor container health and performance with real-time data from our extensive global network.",
+		icon: FaDocker,
+	},
+	{
+		title: "Ping Monitoring",
+		description:
+			"Ensure network reliability with customizable ping checks, supported by our distributed community infrastructure.",
+		icon: FaHeartbeat,
+	},
+	{
+		title: "Incident Management",
+		description:
+			"Stay ahead of issues with proactive incident management, backed by detailed status and impact analysis.",
+		icon: FaExclamationTriangle,
+	},
+	{
+		title: "Email Notifications",
+		description:
+			"Receive instant alerts when issues are detected, ensuring you're always informed.",
+		icon: FaEnvelope,
+	},
+	{
+		title: "Maintenance Windows",
+		description:
+			"Effortlessly schedule and manage maintenance with automated notifications.",
+		icon: FaCalendarAlt,
+	},
+	{
+		title: "Self-Hosted",
+		description: "Deploy on your own infrastructure for complete control.",
+		icon: FaLock,
+	},
+];
+
+export default function FeatureGrid() {
+	const theme = useTheme();
+	const mode = useSelector((state) => state.ui.mode);
+
+	return (
+		<Box
+			id="Features"
+			sx={{
+				py: 24,
+				px: 12,
+				color: theme.palette.primary.contrastText,
+				backgroundImage:
+					mode === "light"
+						? `radial-gradient(circle at center, #ffffff, white)`
+						: `radial-gradient(circle at center, #2a2547, black)`,
+			}}
+		>
+			<Container
+				sx={{
+					position: "relative",
+					display: "flex",
+					flexDirection: "column",
+					alignItems: "center",
+					gap: { xs: 6, sm: 12 },
+				}}
+			>
+				<Box
+					sx={{
+						width: { sm: "100%", md: "80%" },
+						textAlign: "center",
+					}}
+				>
+					<Typography
+						component="h2"
+						variant="h4"
+						gutterBottom
+						fontFamily="BabaPro"
+					>
+						Features
+					</Typography>
+					<Typography
+						variant="h6"
+						sx={{
+							color: theme.palette.secondary.contrastText,
+							fontSize: "clamp(0.9rem, 2.5vw, 1.1rem)",
+						}}
+					>
+						Experience unparalleled distributed uptime monitoring, precise data
+						extraction, and comprehensive speed testing. Our platform ensures optimal
+						performance, real-time insights, and proactive issue resolution, powered by
+						decentralized network of real user devices.
+					</Typography>
+				</Box>
+				<Box
+					sx={{
+						display: "grid",
+						gridTemplateColumns: {
+							xs: "1fr",
+							sm: "repeat(2, 1fr)",
+							md: "repeat(3, 1fr)",
+						},
+						gap: 6,
+					}}
+				>
+					{features.map((feature, index) => (
+						<Box
+							key={index}
+							sx={{ display: "flex", flexDirection: "column", height: "100%" }}
+						>
+							<Stack
+								direction="column"
+								component={Card}
+								spacing={5}
+								sx={{
+									color: "inherit",
+									p: 8,
+									height: "100%",
+									borderColor: "hsla(220, 25%, 25%, 0.3)",
+									backgroundColor: "theme.palette.text.secondary",
+								}}
+							>
+								<Box
+									sx={{
+										display: "flex",
+										justifyContent: "center",
+										alignItems: "center",
+										width: 36,
+										height: 36,
+										borderRadius: "50%",
+										bgcolor: theme.palette.primary.main,
+										color: theme.palette.background.default,
+									}}
+								>
+									<feature.icon
+										size={18}
+										color="currentColor"
+									/>
+								</Box>
+								<div>
+									<Typography
+										variant="h6"
+										gutterBottom
+										sx={{ fontWeight: "medium" }}
+									>
+										{feature.title}
+									</Typography>
+									<Typography sx={{ color: theme.palette.secondary.contrastText }}>
+										{feature.description}
+									</Typography>
+								</div>
+							</Stack>
+						</Box>
+					))}
+				</Box>
+			</Container>
+		</Box>
+	);
+}
diff --git a/src/Components/Home/Hero.jsx b/src/Components/Home/Hero.jsx
new file mode 100644
index 000000000..362626ea6
--- /dev/null
+++ b/src/Components/Home/Hero.jsx
@@ -0,0 +1,136 @@
+import React from "react";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import Typography from "@mui/material/Typography";
+import Link from "@mui/material/Link";
+import Stack from "@mui/material/Stack";
+import { styled, useTheme } from "@mui/material/styles";
+import { useSelector } from "react-redux";
+import { ArcadeEmbed } from "./ArcadeEmbed";
+import RoundGradientButton from "../Buttons/RoundGradientButton";
+
+const GradientText = styled(Typography)(({ theme }) => ({
+	fontSize: "inherit",
+	fontFamily: "BabaPro",
+	background: "linear-gradient(90deg, #842bd2, #ff5451, #8c52ff, #00bf63, #842bd2)",
+	backgroundSize: "400% 400%",
+	WebkitBackgroundClip: "text",
+	WebkitTextFillColor: "transparent",
+	animation: "gradientAnimation 8s ease infinite",
+	"@keyframes gradientAnimation": {
+		"0%": { backgroundPosition: "0% 50%" },
+		"50%": { backgroundPosition: "100% 50%" },
+		"100%": { backgroundPosition: "0% 50%" },
+	},
+}));
+
+const Hero = () => {
+	const theme = useTheme();
+	const mode = useSelector((state) => state.ui.mode);
+
+	return (
+		<Box
+			id="hero"
+			sx={{
+				width: "100%",
+				backgroundRepeat: "no-repeat",
+				px: 12,
+				backgroundImage:
+					mode === "light"
+						? "radial-gradient(ellipse 80% 50% at 50% -34%, hsl(215deg 100% 16%), transparent)"
+						: "radial-gradient(ellipse 80% 50% at 50% -34%, hsl(265deg 100% 20%), transparent)",
+			}}
+		>
+			<Container
+				sx={{
+					display: "flex",
+					flexDirection: "column",
+					alignItems: "center",
+					pt: { xs: 60, sm: 80 },
+					pb: { xs: 8, sm: 12 },
+				}}
+			>
+				<Stack
+					spacing={4}
+					sx={{ alignItems: "center", width: { xs: "100%", sm: "70%" }, mb: 10 }}
+				>
+					<Typography
+						variant="h2"
+						sx={{
+							display: "flex",
+							flexDirection: { xs: "column", sm: "row" },
+							alignItems: "center",
+							justifyContent: "center",
+							fontSize: "clamp(0.8rem, 4vw, 3rem)",
+							textAlign: "center",
+							fontFamily: "BabaPro",
+						}}
+					>
+						<GradientText
+							component="span"
+							variant="h2"
+						>
+							UpRock&nbsp;Prism
+						</GradientText>
+					</Typography>
+					<Typography
+						variant="h1"
+						sx={{
+							fontSize: "clamp(2rem, 6vw, 4.5rem)",
+							textAlign: "center",
+							fontFamily: "BabaPro",
+							color: theme.palette.primary.contrastText,
+						}}
+					>
+						Unmatched Uptime Monitoring
+					</Typography>
+					<Typography
+						sx={{
+							textAlign: "center",
+							color: theme.palette.primary.contrastText,
+							width: { xs: "100%", sm: "100%", md: "80%" },
+							lineHeight: 1.5,
+							fontSize: "clamp(0.9rem, 2.5vw, 1.1rem)",
+						}}
+					>
+						Elevate your digital presence with UpRock Prism, the first decentralized data
+						network for uptime monitoring and distributed performance testing. Gain
+						unparalleled insights from every corner of the world.
+					</Typography>
+					<Stack
+						direction="row"
+						justifyContent="center"
+						spacing={2}
+						sx={{ pt: 10, pb: 6, width: "100%" }}
+					>
+						<RoundGradientButton
+							variant="contained"
+							className="gradient-button"
+							href="/login"
+						>
+							Launch App
+						</RoundGradientButton>
+					</Stack>
+					<Typography
+						variant="caption"
+						color={theme.palette.secondary.contrastText}
+						sx={{ textAlign: "center" }}
+					>
+						By clicking &quot;Launch App&quot; you agree to our&nbsp;
+						<Link
+							href="https://uprock.com/terms-of-use"
+							color={theme.palette.primary.contrastText}
+						>
+							Terms of Use
+						</Link>
+						.
+					</Typography>
+				</Stack>
+				<ArcadeEmbed />
+			</Container>
+		</Box>
+	);
+};
+
+export default Hero;
diff --git a/src/Components/Home/Highlights.jsx b/src/Components/Home/Highlights.jsx
new file mode 100644
index 000000000..bcd8bb01f
--- /dev/null
+++ b/src/Components/Home/Highlights.jsx
@@ -0,0 +1,295 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Card from '@mui/material/Card';
+import MuiChip from '@mui/material/Chip';
+import Container from '@mui/material/Container';
+import Typography from '@mui/material/Typography';
+import { styled } from '@mui/material/styles';
+import PropTypes from 'prop-types';
+import StrokeAnimation from './StrokeAnimation';
+import { useSelector } from 'react-redux';
+
+import DevicesRoundedIcon from '@mui/icons-material/DevicesRounded';
+import EdgesensorHighRoundedIcon from '@mui/icons-material/EdgesensorHighRounded';
+import ViewQuiltRoundedIcon from '@mui/icons-material/ViewQuiltRounded';
+
+const items = [
+  {
+    icon: <ViewQuiltRoundedIcon />,
+    title: 'Unrivaled Dashboard',
+    description:
+      'Experience the ultimate control center with unparalleled insights into your website and online product performance.',
+    imageLight: "/images/dashboard-light.png",
+    imageDark: "/images/dashboard-dark.png",
+  },
+  {
+    icon: <EdgesensorHighRoundedIcon />,
+    title: 'Global Mobile Integration',
+    description:
+      'Harness the power of a groundbreaking DePIN network, with data from over 2.65 million devices worldwide.',
+    imageLight: "/images/dash-light.png",
+    imageDark: "/images/dash-dark.png",
+  },
+  {
+    icon: <DevicesRoundedIcon />,
+    title: 'Universal Platform Access',
+    description:
+      'Access Prism on any device, anywhere. Our platform ensures you receive comprehensive data from every corner of the globe.',
+    imageLight: "/images/all-platforms.png",
+    imageDark: "/images/all-platforms.png",
+  },
+];
+
+const Chip = styled(MuiChip)(({ theme, selected }) => ({
+  variants: [
+    {
+      props: { selected },
+      style: {
+        background:
+          'linear-gradient(to bottom right, hsl(210, 98%, 48%), hsl(210, 98%, 35%))',
+        color: 'hsl(0, 0%, 100%)',
+        borderColor: (theme.vars || theme).palette.primary.light,
+        '& .MuiChip-label': {
+          color: 'hsl(0, 0%, 100%)',
+        },
+        ...theme.applyStyles('dark', {
+          borderColor: (theme.vars || theme).palette.primary.dark,
+        }),
+      },
+    },
+  ],
+}));
+
+export function MobileLayout({ selectedItemIndex, handleItemClick, selectedFeature }) {
+  const mode = useSelector((state) => state.ui.mode);
+
+  if (!items[selectedItemIndex]) {
+    return null;
+  }
+
+  return (
+    <Box
+      sx={{
+        display: { xs: 'flex', sm: 'none' },
+        flexDirection: 'column',
+        gap: 2,
+      }}
+    >
+      <Box sx={{ display: 'flex', gap: 4, overflow: 'auto', mb: 4, pb: 6 }}>
+        {items.map(({ title }, index) => (
+          <Chip
+            size="medium"
+            key={index}
+            label={title}
+            onClick={() => handleItemClick(index)}
+            selected={selectedItemIndex === index}
+          />
+        ))}
+      </Box>
+      <Card variant="outlined">
+        <Box
+          sx={{
+            mb: 2,
+            position: 'relative',
+            minHeight: 280,
+            width: '100%',
+            overflow: 'hidden'
+          }}
+        >
+          <img
+            src={mode === 'dark'
+              ? items[selectedItemIndex].imageDark.replace('url("', '').replace('")', '')
+              : items[selectedItemIndex].imageLight.replace('url("', '').replace('")', '')
+            }
+            alt={items[selectedItemIndex].title}
+            style={{
+              width: '100%',
+              height: '100%',
+              objectFit: 'cover',
+              position: 'absolute',
+              top: 0,
+              left: 0
+            }}
+          />
+        </Box>
+        <Box sx={{ px: 6, py: 4 }}>
+          <Typography
+            gutterBottom
+            sx={{
+              color: 'text.primary',
+              fontWeight: 'medium',
+              fontSize: { xs: '1.5rem', sm: '2rem' },
+            }}
+          >
+            {selectedFeature.title}
+          </Typography>
+          <Typography sx={{ color: 'text.secondary', mb: 1.5 }}>
+            {selectedFeature.description}
+          </Typography>
+        </Box>
+      </Card>
+    </Box>
+  );
+}
+
+MobileLayout.propTypes = {
+  selectedItemIndex: PropTypes.number.isRequired,
+  handleItemClick: PropTypes.func.isRequired,
+  selectedFeature: PropTypes.shape({
+    title: PropTypes.string.isRequired,
+    description: PropTypes.string.isRequired,
+    imageLight: PropTypes.string.isRequired,
+    imageDark: PropTypes.string.isRequired,
+  }).isRequired,
+};
+
+export default function Features() {
+  const [selectedItemIndex, setSelectedItemIndex] = React.useState(0);
+  const mode = useSelector((state) => state.ui.mode);
+  const handleItemClick = (index) => {
+    setSelectedItemIndex(index);
+  };
+
+  const selectedFeature = items[selectedItemIndex];
+
+  return (
+    <Container id="features" sx={{ py: { xs: 8, sm: 16 }, px: { xs: 12, sm: 12 } }}>
+      <Box sx={{ width: { sm: '100%', md: '60%' } }}>
+        <Typography
+          component="h2"
+          variant="h4"
+          gutterBottom
+          fontFamily="BabaPro"
+          sx={{ color: 'text.primary' }}
+        >
+          Prism Highlights
+        </Typography>
+        <Typography
+          sx={{ color: 'text.secondary', mb: { xs: 12, sm: 12 } }}
+        >
+          Discover the world's first and most advanced uptime monitoring service, powered by a vibrant web3 community. Prism delivers superior insights and a clearer picture of your digital presence, supported by a global network of real devices.
+        </Typography>
+      </Box>
+      <Box
+        sx={{
+          display: 'flex',
+          flexDirection: { xs: 'column', md: 'row-reverse' },
+          gap: 2,
+        }}
+      >
+        <div>
+          <Box
+            sx={{
+              display: { xs: 'none', sm: 'flex' },
+              flexDirection: 'column',
+              gap: 2,
+              ml: 6,
+              mb: 0,
+              height: '100%',
+            }}
+          >
+            {items.map(({ icon, title, description }, index) => (
+              <Box
+                key={index}
+                component={Button}
+                onClick={() => handleItemClick(index)}
+                sx={[
+                  (theme) => ({
+                    p: 8,
+                    height: '100%',
+                    width: '100%',
+                    '&:hover': {
+                      backgroundColor: mode === 'dark'
+                        ? 'rgba(133, 113, 255, 0.1)'
+                        : (theme.vars || theme).palette.action.hover,
+                    },
+                  }),
+                  selectedItemIndex === index && {
+                    backgroundColor: (theme) => (mode === 'dark' ? 'rgba(133, 113, 255, 0.1)' : theme.palette.action.selected),
+                  },
+                ]}
+              >
+                <Box
+                  sx={[
+                    {
+                      width: '100%',
+                      display: 'flex',
+                      flexDirection: 'column',
+                      alignItems: 'left',
+                      gap: 1,
+                      py: 6,
+                      textAlign: 'left',
+                      textTransform: 'none',
+                      color: 'text.secondary',
+                    },
+                    selectedItemIndex === index && {
+                      color: 'text.primary',
+                    },
+                  ]}
+                >
+                  {icon}
+
+                  <Typography variant="h6">{title}</Typography>
+                  <Typography>{description}</Typography>
+                </Box>
+              </Box>
+            ))}
+          </Box>
+          <MobileLayout
+            selectedItemIndex={selectedItemIndex}
+            handleItemClick={handleItemClick}
+            selectedFeature={selectedFeature}
+          />
+        </div>
+        <Box id="stroke-animation"
+          sx={{
+            position: 'relative',
+            display: { xs: 'none', sm: 'flex' },
+            width: { xs: '100%', md: '70%' },
+            height: 'var(--items-image-height)',
+          }}
+        >
+          <Card
+            variant="outlined"
+            sx={{
+              height: '100%',
+              width: '100%',
+              display: { xs: 'none', sm: 'flex' },
+              pointerEvents: 'none',
+              mt: 0,
+            }}
+          >
+            <Box
+              sx={{
+                position: 'relative',
+                width: '100%',
+                height: 500,
+                overflow: 'hidden',
+                objectFit: 'contain',
+                objectPosition: 'center',
+              }}
+            >
+              <img
+                src={mode === 'dark'
+                  ? items[selectedItemIndex]?.imageDark.replace('url("', '').replace('")', '')
+                  : items[selectedItemIndex]?.imageLight.replace('url("', '').replace('")', '')
+                }
+                alt={items[selectedItemIndex]?.title}
+                style={{
+                  width: '100%',
+                  height: '100%',
+                  objectFit: 'contain',
+                  position: 'absolute',
+                  top: 0,
+                  left: 0
+                }}
+              />
+            </Box>
+          </Card>
+          <StrokeAnimation />
+        </Box>
+      </Box>
+    </Container>
+  );
+}
diff --git a/src/Components/Home/LogoCarousel.jsx b/src/Components/Home/LogoCarousel.jsx
new file mode 100644
index 000000000..62b56a510
--- /dev/null
+++ b/src/Components/Home/LogoCarousel.jsx
@@ -0,0 +1,111 @@
+import React from 'react';
+import { Box, Container, Typography, Grid } from '@mui/material';
+import { useSelector } from 'react-redux';
+import { useTheme } from '@mui/material/styles';
+
+
+// Swiper imports
+import { Swiper, SwiperSlide } from 'swiper/react';
+import { Autoplay } from 'swiper/modules';
+import 'swiper/css';
+import 'swiper/css/autoplay';
+
+const LogoCarousel = () => {
+  const mode = useSelector((state) => state.ui.mode);
+  const theme = useTheme();
+
+  const lightLogos = [
+    { src: '/images/borderless-dark.png', alt: 'borderless' },
+    { src: '/images/draperdragon-dark.png', alt: 'draperdragon' },
+    { src: '/images/animoca-dark.png', alt: 'animoca' },
+    { src: '/images/gydra-dark.png', alt: 'gydra' },
+    { src: '/images/fusion7-dark.png', alt: 'fusion7' },
+    { src: '/images/initialvc-dark.png', alt: 'initialvc' },
+    { src: '/images/gummies-dark.png', alt: 'gummies' },
+    { src: '/images/laserdigital-dark.png', alt: 'laserdigital' },
+    { src: '/images/depinhub-dark.png', alt: 'depinhub' },
+    { src: '/images/decentralised-dark.png', alt: 'decentralised' },
+    { src: '/images/sagadao-dark.png', alt: 'sagadao' },
+    { src: '/images/seancarey-dark.png', alt: 'seancarey' },
+    { src: '/images/alvarograce-dark.png', alt: 'alvarograce' },
+  ];
+
+  const darkLogos = [
+    { src: '/images/borderless-light.png', alt: 'borderless' },
+    { src: '/images/draperdragon-light.png', alt: 'draperdragon' },
+    { src: '/images/animoca-light.png', alt: 'animoca' },
+    { src: '/images/gydra-light.png', alt: 'gydra' },
+    { src: '/images/fusion7-light.png', alt: 'fusion7' },
+    { src: '/images/initialvc-light.png', alt: 'initialvc' },
+    { src: '/images/gummies-light.png', alt: 'gummies' },
+    { src: '/images/laserdigital-light.png', alt: 'laserdigital' },
+    { src: '/images/depinhub-light.png', alt: 'depinhub' },
+    { src: '/images/decentralised-light.png', alt: 'decentralised' },
+    { src: '/images/sagadao-light.png', alt: 'sagadao' },
+    { src: '/images/seancarey-light.png', alt: 'seancarey' },
+    { src: '/images/alvarograce-light.png', alt: 'alvarograce' },
+  ];
+
+  const logos = mode === 'light' ? lightLogos : darkLogos;
+
+  const logoStyle = {
+    width: 'auto',
+    height: '50px',
+    maxWidth: '100%',
+    margin: '0 12px',
+    opacity: 1,
+  };
+
+  return (
+    <Box
+      component="section"
+      className="brand-slider-section section-padding fix"
+      sx={{
+        py: 28,
+        px: 12,
+      }}
+    >
+      <Box className="brand-slider-container-wrapper">
+        <Box className="brand-slider-wrapper" textAlign="center">
+          <Typography
+            variant="h4"
+            sx={{ mb: 18, opacity: 1, color: theme.palette.text.primary }}
+            fontFamily="BabaPro"
+          >
+            Backed by the best
+          </Typography>
+
+          <Swiper
+            modules={[Autoplay]}
+            autoplay={{ delay: 0, disableOnInteraction: false }}
+            speed={5000}
+            loop={true}
+            breakpoints={{
+              0: { slidesPerView: 3, spaceBetween: 10 },
+              576: { slidesPerView: 4, centeredSlides: true },
+              768: { slidesPerView: 5 },
+              1025: { slidesPerView: 6 },
+              1400: { slidesPerView: 7 },
+              1600: { slidesPerView: 8 },
+            }}
+            spaceBetween={20}
+          >
+            {logos.map((logo, index) => (
+              <SwiperSlide key={index}>
+                <Box className="brand-logo">
+                  <img
+                    src={logo.src}
+                    alt={logo.alt}
+                    style={logoStyle}
+                  />
+                </Box>
+              </SwiperSlide>
+            ))}
+          </Swiper>
+        </Box>
+      </Box>
+    </Box>
+  );
+};
+
+export default LogoCarousel;
diff --git a/src/Components/Home/StrokeAnimation.jsx b/src/Components/Home/StrokeAnimation.jsx
new file mode 100644
index 000000000..eb22d2062
--- /dev/null
+++ b/src/Components/Home/StrokeAnimation.jsx
@@ -0,0 +1,55 @@
+import React from 'react';
+import { Box } from '@mui/material';
+
+export default function BorderBeam() {
+  return (
+    <Box
+      style={{
+        '--size': 250,
+        '--duration': 7,
+        '--anchor': 90,
+        '--border-width': 1.5,
+        '--color-from': '#842bd2',
+        '--color-to': '#ff5451',
+        '--delay': '-9s',
+      }}
+      sx={{
+        pointerEvents: 'none',
+        position: 'absolute',
+        inset: 0,
+        borderRadius: 'inherit',
+        border: 'calc(var(--border-width) * 1px) solid transparent',
+        maskClip: 'padding-box, border-box',
+        maskComposite: 'intersect',
+        maskImage: 'linear-gradient(transparent, transparent), linear-gradient(white, white)',
+
+        '&::after': {
+          content: '""',
+          position: 'absolute',
+
+          width: 'calc(var(--size) * 1px)',
+          height: 'calc(var(--size) * 1px)',
+
+          background: 'linear-gradient(to left, #842bd2, #ff5451, #8c52ff, #00bf63, transparent)',
+
+          // The “border-beam” keyframes:
+          animation: 'borderBeam calc(var(--duration) * 1s) infinite linear',
+          animationDelay: 'var(--delay)',
+
+          // The offset-path & offset-anchor are experimental:
+          offsetPath: 'rect(0 auto auto 0 round calc(var(--size) * 1px))',
+          offsetAnchor: 'calc(var(--anchor) * 1%) 50%',
+        },
+
+        /* Keyframes (Tailwind's `animate-border-beam`) 
+           We only need a single "to { offset-distance: 100%; }"
+        */
+        '@keyframes borderBeam': {
+          to: {
+            offsetDistance: '100%',
+          },
+        },
+      }}
+    />
+  );
+}
diff --git a/src/Components/StatBox/index.jsx b/src/Components/StatBox/index.jsx
index 58fdb7ebf..3c91e1aae 100644
--- a/src/Components/StatBox/index.jsx
+++ b/src/Components/StatBox/index.jsx
@@ -32,6 +32,7 @@ import useUtils from "../../Pages/Uptime/Monitors/Hooks/useUtils";
 
 const StatBox = ({
 	img,
+	icon: Icon,
 	alt,
 	heading,
 	subHeading,
@@ -114,6 +115,9 @@ const StatBox = ({
 					sx={{ marginRight: theme.spacing(8) }}
 				/>
 			)}
+			{Icon && (
+				<Icon sx={{ width: "30px", height: "30px", marginRight: theme.spacing(8) }} />
+			)}
 			<Stack>
 				<Typography component="h2">{heading}</Typography>
 				<Typography>{subHeading}</Typography>
@@ -128,6 +132,9 @@ StatBox.propTypes = {
 	gradient: PropTypes.bool,
 	status: PropTypes.string,
 	sx: PropTypes.object,
+	icon: PropTypes.elementType,
+	img: PropTypes.node,
+	alt: PropTypes.string,
 };
 
 export default StatBox;
diff --git a/src/Components/Subheader/index.jsx b/src/Components/Subheader/index.jsx
new file mode 100644
index 000000000..2ec22dcec
--- /dev/null
+++ b/src/Components/Subheader/index.jsx
@@ -0,0 +1,89 @@
+import PropTypes from "prop-types";
+import { useTheme } from "@emotion/react";
+import { Box, Stack, Typography } from "@mui/material";
+import { RowContainer } from "../StandardContainer";
+
+/**
+
+ *
+ * @component
+ * @example
+ *
+ * @param {string} props.headerText - Header text
+ * @param {number} props.headerLevel - Font characteristic of the header
+ * @param {string} props.subHeaderText - Subheader text
+ * @param {number} props.subHeaderLevel - Font characteristic of the subheader
+ * @param {string} props.rightCatagoryTitle - Message for right section
+ * @param {number} props.rightCatagoryTitleLevel - Font characteristic of the right section header
+ * @param {string} props.rightDescription - Description for right section
+ * @param {number} props.rightDescriptionLevel - Font characteristic of the right section description
+ * @returns {JSX.Element} The rendered component
+ */
+
+const SubHeader = ({
+	headerText,
+	headerLevel = 1,
+	subHeaderText,
+	subHeaderLevel = 1,
+	rightCatagoryTitle,
+	rightCatagoryTitleLevel = 2,
+	rightDescription,
+	rightDescriptionLevel = 2,
+}) => {
+	const theme = useTheme();
+
+	return (
+		<Stack
+			direction="row"
+			justifyContent="space-between"
+		>
+			<Stack direction={"column"}>
+				<Typography
+					component={`h${headerLevel}`}
+					variant={`h${headerLevel}`}
+					mb={theme.spacing(1)}
+				>
+					<Typography
+						component="span"
+						fontSize="inherit"
+						color={theme.palette.primary.contrastTextTertiary}
+					>
+						{headerText}
+					</Typography>
+				</Typography>
+				<Typography
+					variant={`body${subHeaderLevel}`}
+					color={theme.palette.primary.contrastTextTertiary}
+				>
+					{subHeaderText}
+				</Typography>
+			</Stack>
+
+			{rightCatagoryTitle && (
+				<RowContainer sx={{ width: "20%" }}>
+					<Stack>
+						<Typography variant={`body${rightCatagoryTitleLevel}`}>
+							{rightCatagoryTitle}
+						</Typography>
+						<Typography variant={`h${rightDescriptionLevel}`}>
+							{rightDescription}
+						</Typography>
+					</Stack>
+				</RowContainer>
+			)}
+		</Stack>
+	);
+};
+
+SubHeader.propTypes = {
+	headerText: PropTypes.string,
+	headerLevel: PropTypes.number,
+	subHeaderText: PropTypes.string,
+	subHeaderLevel: PropTypes.number,
+	rightCatagoryTitle: PropTypes.string,
+	rightCatagoryTitleLevel: PropTypes.number,
+	rightDescription: PropTypes.string,
+	rightDescriptionLevel: PropTypes.number,
+};
+
+export default SubHeader;
diff --git a/src/Pages/About/index.jsx b/src/Pages/About/index.jsx
new file mode 100644
index 000000000..84b90af55
--- /dev/null
+++ b/src/Pages/About/index.jsx
@@ -0,0 +1,15 @@
+import React from 'react';
+import AppBar from '../../Components/Common/AppBar';
+import Footer from '../../Components/Common/Footer';
+
+const AboutUs = () => {
+	return (
+		<div>
+			<AppBar />
+			<h1>About Us</h1>
+			<Footer />
+		</div>
+	);
+};
+
+export default AboutUs;
diff --git a/src/Pages/DistributedUptimeStatus/Create/Hooks/useDUStatusPageFetch.jsx b/src/Pages/DistributedUptimeStatus/Create/Hooks/useDUStatusPageFetch.jsx
new file mode 100644
index 000000000..eecb161a3
--- /dev/null
+++ b/src/Pages/DistributedUptimeStatus/Create/Hooks/useDUStatusPageFetch.jsx
@@ -0,0 +1,46 @@
+import { useEffect, useState, useCallback } from "react";
+import { networkService } from "../../../../main";
+import { useSelector } from "react-redux";
+import { createToast } from "../../../../Utils/toastUtils";
+
+const useDUStatusPageFetch = (isCreate = false, url) => {
+	const [isLoading, setIsLoading] = useState(true);
+	const [networkError, setNetworkError] = useState(false);
+	const [statusPage, setStatusPage] = useState(undefined);
+	const { authToken } = useSelector((state) => state.auth);
+	const fetchStatusPage = useCallback(async () => {
+		try {
+			const response = await networkService.getStatusPageByUrl({
+				authToken,
+				url,
+				type: "distributed",
+			});
+
+			if (!response?.data?.data) return;
+
+			const statusPage = response.data.data;
+			setStatusPage(statusPage);
+		} catch (error) {
+			// If there is a 404, status page is not found
+			if (error?.response?.status === 404) {
+				setStatusPage(undefined);
+				return;
+			}
+			createToast({ body: error.message });
+			setNetworkError(true);
+		} finally {
+			setIsLoading(false);
+		}
+	}, [authToken, url]);
+
+	useEffect(() => {
+		if (isCreate === true) {
+			return;
+		}
+		fetchStatusPage();
+	}, [isCreate, fetchStatusPage]);
+
+	return [statusPage, isLoading, networkError, fetchStatusPage];
+};
+
+export { useDUStatusPageFetch };
diff --git a/src/Pages/DistributedUptimeStatus/Create/index.jsx b/src/Pages/DistributedUptimeStatus/Create/index.jsx
index 3aa16a074..09673b53e 100644
--- a/src/Pages/DistributedUptimeStatus/Create/index.jsx
+++ b/src/Pages/DistributedUptimeStatus/Create/index.jsx
@@ -7,26 +7,34 @@ import VisuallyHiddenInput from "./Components/VisuallyHiddenInput";
 import Image from "../../../Components/Image";
 import LogoPlaceholder from "../../../assets/Images/logo_placeholder.svg";
 import Breadcrumbs from "../../../Components/Breadcrumbs";
+import Search from "../../../Components/Inputs/Search";
+import MonitorList from "../../StatusPage/Create/Components/MonitorList";
 // Utils
 import { useTheme } from "@emotion/react";
 import { useState, useEffect } from "react";
 import { useParams } from "react-router-dom";
-import { useStatusPageFetch } from "../../StatusPage/Status/Hooks/useStatusPageFetch";
+import { useDUStatusPageFetch } from "./Hooks/useDUStatusPageFetch";
 import { useCreateStatusPage } from "../../StatusPage/Create/Hooks/useCreateStatusPage";
 import { statusPageValidation } from "../../../Validation/validation";
 import { buildErrors } from "../../../Validation/error";
 import { createToast } from "../../../Utils/toastUtils";
 import { useNavigate } from "react-router-dom";
+import { useMonitorsFetch } from "../../StatusPage/Create/Hooks/useMonitorsFetch";
 
 const CreateStatus = () => {
 	const theme = useTheme();
 	const { monitorId, url } = useParams();
 	const navigate = useNavigate();
 	const isCreate = typeof url === "undefined";
+
 	const [createStatusPage, isLoading, networkError] = useCreateStatusPage(isCreate);
 
-	const [statusPage, statusPageMonitors, statusPageIsLoading, statusPageNetworkError] =
-		useStatusPageFetch(isCreate, url);
+	const [statusPage, statusPageIsLoading, statusPageNetworkError] = useDUStatusPageFetch(
+		isCreate,
+		url
+	);
+
+	const [monitors, monitorsIsLoading, monitorsNetworkError] = useMonitorsFetch();
 
 	const BREADCRUMBS = [
 		{ name: "distributed uptime", path: "/distributed-uptime" },
@@ -43,6 +51,8 @@ const CreateStatus = () => {
 		monitors: [monitorId],
 	});
 	const [errors, setErrors] = useState({});
+	const [search, setSearch] = useState("");
+	const [selectedMonitors, setSelectedMonitors] = useState([]);
 
 	const handleFormChange = (e) => {
 		const { name, value, checked, type } = e.target;
@@ -62,6 +72,16 @@ const CreateStatus = () => {
 		setForm({ ...form, [name]: value });
 	};
 
+	const handleMonitorsChange = (selectedMonitors) => {
+		handleFormChange({
+			target: {
+				name: "subMonitors",
+				value: selectedMonitors.map((monitor) => monitor._id),
+			},
+		});
+		setSelectedMonitors(selectedMonitors);
+	};
+
 	const handleImageUpload = (e) => {
 		const img = e.target?.files?.[0];
 		setForm((prev) => ({
@@ -73,19 +93,20 @@ const CreateStatus = () => {
 		let logoToSubmit = undefined;
 
 		// Handle image
-		if (typeof form.logo !== "undefined") {
+		if (typeof form.logo !== "undefined" && typeof form.logo.src === "undefined") {
 			logoToSubmit = {
 				src: URL.createObjectURL(form.logo),
 				name: form.logo.name,
 				type: form.logo.type,
 				size: form.logo.size,
 			};
+		} else if (typeof form.logo !== "undefined") {
+			logoToSubmit = form.logo;
 		}
 		const formToSubmit = { ...form };
 		if (typeof logoToSubmit !== "undefined") {
 			formToSubmit.logo = logoToSubmit;
 		}
-
 		// Validate
 		const { error } = statusPageValidation.validate(formToSubmit, { abortEarly: false });
 		if (typeof error === "undefined") {
@@ -127,12 +148,20 @@ const CreateStatus = () => {
 				companyName: statusPage?.companyName,
 				isPublished: statusPage?.isPublished,
 				timezone: statusPage?.timezone,
-				monitors: statusPageMonitors.map((monitor) => monitor._id),
+				monitors: statusPage?.monitors,
+				subMonitors: statusPage?.subMonitors.map((monitor) => monitor._id),
 				color: statusPage?.color,
 				logo: newLogo,
 			};
 		});
-	}, [isCreate, statusPage, statusPageMonitors]);
+		setSelectedMonitors(statusPage?.subMonitors);
+	}, [isCreate, statusPage]);
+
+	const imgSrc = form?.logo?.src
+		? form.logo.src
+		: form.logo
+			? URL.createObjectURL(form.logo)
+			: undefined;
 
 	return (
 		<Stack gap={theme.spacing(10)}>
@@ -212,7 +241,7 @@ const CreateStatus = () => {
 					alignItems="center"
 				>
 					<Image
-						src={form.logo ? URL.createObjectURL(form.logo) : undefined}
+						src={imgSrc}
 						alt="Logo"
 						minWidth={"300px"}
 						minHeight={"100px"}
@@ -234,6 +263,30 @@ const CreateStatus = () => {
 					</Box>
 				</Stack>
 			</ConfigBox>
+			<ConfigBox>
+				<Stack>
+					<Typography component="h2">Standard Monitors</Typography>
+					<Typography component="p">
+						Attach standard monitors to your status page.
+					</Typography>
+				</Stack>
+				<Stack gap={theme.spacing(18)}>
+					<Search
+						options={monitors ?? []}
+						multiple={true}
+						filteredBy="name"
+						value={selectedMonitors}
+						inputValue={search}
+						handleInputChange={setSearch}
+						handleChange={handleMonitorsChange}
+					/>
+					<MonitorList
+						monitors={monitors}
+						selectedMonitors={selectedMonitors}
+						setSelectedMonitors={handleMonitorsChange}
+					/>
+				</Stack>
+			</ConfigBox>
 			<Stack
 				direction="row"
 				justifyContent="flex-end"
diff --git a/src/Pages/DistributedUptimeStatus/Status/Components/MonitorsList/index.jsx b/src/Pages/DistributedUptimeStatus/Status/Components/MonitorsList/index.jsx
new file mode 100644
index 000000000..d9ed16e63
--- /dev/null
+++ b/src/Pages/DistributedUptimeStatus/Status/Components/MonitorsList/index.jsx
@@ -0,0 +1,66 @@
+// Components
+import { Stack, Box } from "@mui/material";
+import Host from "../../../../../Components/Host";
+import DePINStatusPageBarChart from "../../../../../Components/Charts/DePINStatusPageBarChart";
+import { StatusLabel } from "../../../../../Components/Label";
+
+//Utils
+import { useTheme } from "@mui/material/styles";
+import useUtils from "../../../../Uptime/Monitors/Hooks/useUtils";
+import PropTypes from "prop-types";
+const MonitorsList = ({
+	isLoading = false,
+	shouldRender = true,
+	monitors = [],
+	timeFrame,
+}) => {
+	const theme = useTheme();
+	const { determineState } = useUtils();
+	return (
+		<>
+			{monitors?.map((monitor) => {
+				const status = determineState(monitor);
+				return (
+					<Stack
+						key={monitor._id}
+						width="100%"
+						gap={theme.spacing(2)}
+					>
+						<Host
+							key={monitor._id}
+							url={monitor.url}
+							title={monitor.name}
+							percentageColor={monitor.percentageColor}
+							percentage={monitor.percentage}
+						/>
+						<Stack
+							direction="row"
+							alignItems="center"
+							gap={theme.spacing(20)}
+						>
+							<Box flex={9}>
+								<DePINStatusPageBarChart
+									checks={monitor?.checks?.slice().reverse()}
+									daysToShow={timeFrame}
+								/>
+							</Box>
+							<Box flex={1}>
+								<StatusLabel
+									status={status}
+									text={status}
+									customStyles={{ textTransform: "capitalize" }}
+								/>
+							</Box>
+						</Stack>
+					</Stack>
+				);
+			})}
+		</>
+	);
+};
+
+MonitorsList.propTypes = {
+	monitors: PropTypes.array.isRequired,
+};
+
+export default MonitorsList;
diff --git a/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx b/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx
new file mode 100644
index 000000000..011f470aa
--- /dev/null
+++ b/src/Pages/DistributedUptimeStatus/Status/Components/TimeframeHeader/index.jsx
@@ -0,0 +1,39 @@
+import { Stack, Button, ButtonGroup } from "@mui/material";
+import { RowContainer } from "../../../../../Components/StandardContainer";
+import { useTheme } from "@emotion/react";
+
+const TimeFrameHeader = ({ timeFrame, setTimeFrame }) => {
+	const theme = useTheme();
+	return (
+		<Stack
+			direction="row"
+			justifyContent="flex-end"
+		>
+			<ButtonGroup>
+				<Button
+					variant="group"
+					filled={(timeFrame === 30).toString()}
+					onClick={() => setTimeFrame(30)}
+				>
+					30 days
+				</Button>
+				<Button
+					variant="group"
+					filled={(timeFrame === 60).toString()}
+					onClick={() => setTimeFrame(60)}
+				>
+					60 days
+				</Button>
+				<Button
+					variant="group"
+					filled={(timeFrame === 90).toString()}
+					onClick={() => setTimeFrame(90)}
+				>
+					90 days
+				</Button>
+			</ButtonGroup>
+		</Stack>
+	);
+};
+
+export default TimeFrameHeader;
diff --git a/src/Pages/DistributedUptimeStatus/Status/Hooks/useStatusPageFetchByUrl.jsx b/src/Pages/DistributedUptimeStatus/Status/Hooks/useStatusPageFetchByUrl.jsx
index de68aed20..61c4f1b65 100644
--- a/src/Pages/DistributedUptimeStatus/Status/Hooks/useStatusPageFetchByUrl.jsx
+++ b/src/Pages/DistributedUptimeStatus/Status/Hooks/useStatusPageFetchByUrl.jsx
@@ -2,23 +2,41 @@ import { useState, useEffect } from "react";
 import { networkService } from "../../../../main";
 import { createToast } from "../../../../Utils/toastUtils";
 import { useSelector } from "react-redux";
+import { useTheme } from "@emotion/react";
+import { useMonitorUtils } from "../../../../Hooks/useMonitorUtils";
 
-const useStatusPageFetchByUrl = ({ url }) => {
+const useStatusPageFetchByUrl = ({ url, timeFrame }) => {
 	const [isLoading, setIsLoading] = useState(true);
 	const [networkError, setNetworkError] = useState(false);
 	const [statusPage, setStatusPage] = useState(undefined);
 	const [monitorId, setMonitorId] = useState(undefined);
 	const [isPublished, setIsPublished] = useState(false);
+	const { authToken } = useSelector((state) => state.auth);
+	const theme = useTheme();
+	const { getMonitorWithPercentage } = useMonitorUtils();
+
 	useEffect(() => {
 		const fetchStatusPageByUrl = async () => {
 			try {
-				const response = await networkService.getStatusPageByUrl({
+				const response = await networkService.getDistributedStatusPageByUrl({
+					authToken,
 					url,
 					type: "distributed",
+					timeFrame,
 				});
 				if (!response?.data?.data) return;
 				const statusPage = response.data.data;
-				setStatusPage(statusPage);
+
+				const monitorsWithPercentage = statusPage?.subMonitors.map((monitor) =>
+					getMonitorWithPercentage(monitor, theme)
+				);
+
+				const statusPageWithSubmonitorPercentages = {
+					...statusPage,
+					subMonitors: monitorsWithPercentage,
+				};
+				setStatusPage(statusPageWithSubmonitorPercentages);
+
 				setMonitorId(statusPage?.monitors[0]);
 				setIsPublished(statusPage?.isPublished);
 			} catch (error) {
@@ -31,7 +49,7 @@ const useStatusPageFetchByUrl = ({ url }) => {
 			}
 		};
 		fetchStatusPageByUrl();
-	}, [url]);
+	}, [authToken, url, getMonitorWithPercentage, theme, timeFrame]);
 
 	return [isLoading, networkError, statusPage, monitorId, isPublished];
 };
diff --git a/src/Pages/DistributedUptimeStatus/Status/index.jsx b/src/Pages/DistributedUptimeStatus/Status/index.jsx
index a1c6b473f..e0f6d32ae 100644
--- a/src/Pages/DistributedUptimeStatus/Status/index.jsx
+++ b/src/Pages/DistributedUptimeStatus/Status/index.jsx
@@ -16,6 +16,7 @@ import UptLogo from "../../../assets/icons/upt_logo.png";
 import PeopleAltOutlinedIcon from "@mui/icons-material/PeopleAltOutlined";
 import InfoBox from "../../../Components/InfoBox";
 import StatusHeader from "../../DistributedUptime/Details/Components/StatusHeader";
+import MonitorsList from "./Components/MonitorsList";
 
 //Utils
 import { useTheme } from "@mui/material/styles";
@@ -24,20 +25,27 @@ import { useParams } from "react-router-dom";
 import { useSubscribeToDetails } from "../../DistributedUptime/Details/Hooks/useSubscribeToDetails";
 import { useStatusPageFetchByUrl } from "./Hooks/useStatusPageFetchByUrl";
 import { useStatusPageDelete } from "../../StatusPage/Status/Hooks/useStatusPageDelete";
-import { useNavigate } from "react-router-dom";
-import { useLocation } from "react-router-dom";
+import TimeFrameHeader from "./Components/TimeframeHeader";
+import SubHeader from "../../../Components/Subheader";
+
+import { useNavigate, useLocation } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+
 const DistributedUptimeStatus = () => {
 	const { url } = useParams();
 	const location = useLocation();
+	const { t } = useTranslation();
 	const isPublic = location.pathname.startsWith("/status/distributed/public");
 
 	const elementToCapture = useRef(null);
 	// Local State
 	const [dateRange, setDateRange] = useState("day");
 	const [isDeleteOpen, setIsDeleteOpen] = useState(false);
+	const [timeFrame, setTimeFrame] = useState(30);
 	// Utils
 	const theme = useTheme();
 	const navigate = useNavigate();
+
 	const [
 		statusPageIsLoading,
 		statusPageNetworkError,
@@ -46,6 +54,7 @@ const DistributedUptimeStatus = () => {
 		isPublished,
 	] = useStatusPageFetchByUrl({
 		url,
+		timeFrame,
 	});
 
 	const [isLoading, networkError, connectionStatus, monitor, lastUpdateTrigger] =
@@ -153,12 +162,19 @@ const DistributedUptimeStatus = () => {
 				url={url}
 				type="distributed"
 			/>
-
+		
 			<StatusHeader
 				monitor={monitor}
 				connectionStatus={connectionStatus}
 				elementToCapture={elementToCapture}
 			/>
+			
+			<SubHeader 
+				headerText={t("distributedStatusHeaderText")} 
+				subHeaderText={t("distributedStatusSubHeaderText")}
+				rightCatagoryTitle={t("distributedRightCatagoryTitle")}
+				rightDescription = {t("distributedRightCatagoryDescription")}
+			/>
 
 			<NextExpectedCheck
 				lastUpdateTime={monitor?.timeSinceLastCheck ?? 0}
@@ -213,6 +229,14 @@ const DistributedUptimeStatus = () => {
 				monitor={monitor}
 				lastUpdateTrigger={lastUpdateTrigger}
 			/>
+			<TimeFrameHeader
+				timeFrame={timeFrame}
+				setTimeFrame={setTimeFrame}
+			/>
+			<MonitorsList
+				monitors={statusPage?.subMonitors}
+				timeFrame={timeFrame}
+			/>
 			<Footer />
 			<Dialog
 				// open={isOpen.deleteStats}
diff --git a/src/Pages/Landing/index.jsx b/src/Pages/Landing/index.jsx
new file mode 100644
index 000000000..5dfe281bc
--- /dev/null
+++ b/src/Pages/Landing/index.jsx
@@ -0,0 +1,33 @@
+import AppBar from "../../Components/Common/AppBar";
+import Footer from "../../Components/Common/Footer";
+import Hero from "../../Components/Home/Hero";
+import Features from "../../Components/Home/Features";
+import Highlights from "../../Components/Home/Highlights";
+import FAQ from "../../Components/Home/FAQ";
+import Divider from "../../Components/Home/Divider";
+import LogoCarousel from "../../Components/Home/LogoCarousel";
+
+const Landing = () => {
+	return (
+		<div>
+			<AppBar />
+			<Hero />
+			<LogoCarousel />
+			<Divider />
+			<div id="features">
+				<Features />
+			</div>
+			<Divider />
+			<div id="highlights">
+				<Highlights />
+			</div>
+			<Divider />
+			<div id="faq">
+				<FAQ />
+			</div>
+			<Footer />
+		</div>
+	);
+};
+
+export default Landing;
diff --git a/src/Pages/Settings/index.jsx b/src/Pages/Settings/index.jsx
index 40e3ac1ed..04b8658dc 100644
--- a/src/Pages/Settings/index.jsx
+++ b/src/Pages/Settings/index.jsx
@@ -367,7 +367,8 @@ const Settings = () => {
 						<Box>
 							<Typography component="h1">Wallet</Typography>
 							<Typography sx={{ mt: theme.spacing(2) }}>
-								Connect your wallet here. This is required for the Distributed Uptime monitor to connect to multiple nodes globally.  
+								Connect your wallet here. This is required for the Distributed Uptime
+								monitor to connect to multiple nodes globally.
 							</Typography>
 						</Box>
 						<Box>
diff --git a/src/Pages/StatusPage/Status/Components/MonitorsList/index.jsx b/src/Pages/StatusPage/Status/Components/MonitorsList/index.jsx
index 7f4af1e0c..10cfec129 100644
--- a/src/Pages/StatusPage/Status/Components/MonitorsList/index.jsx
+++ b/src/Pages/StatusPage/Status/Components/MonitorsList/index.jsx
@@ -8,7 +8,7 @@ import { StatusLabel } from "../../../../../Components/Label";
 import { useTheme } from "@mui/material/styles";
 import useUtils from "../../../../Uptime/Monitors/Hooks/useUtils";
 import PropTypes from "prop-types";
-const MonitorsList = ({ monitors = [] }) => {
+const MonitorsList = ({ isLoading = false, shouldRender = true, monitors = [] }) => {
 	const theme = useTheme();
 	const { determineState } = useUtils();
 	return (
@@ -24,7 +24,7 @@ const MonitorsList = ({ monitors = [] }) => {
 						<Host
 							key={monitor._id}
 							url={monitor.url}
-							title={monitor.title}
+							title={monitor.name}
 							percentageColor={monitor.percentageColor}
 							percentage={monitor.percentage}
 						/>
diff --git a/src/Utils/NetworkService.js b/src/Utils/NetworkService.js
index 6f5c093c0..1464a440b 100644
--- a/src/Utils/NetworkService.js
+++ b/src/Utils/NetworkService.js
@@ -919,6 +919,21 @@ class NetworkService {
 			},
 		});
 	}
+	async getDistributedStatusPageByUrl(config) {
+		const { authToken, url, type, timeFrame } = config;
+		const params = new URLSearchParams();
+		params.append("type", type);
+		params.append("timeFrame", timeFrame);
+		return this.axiosInstance.get(
+			`/status-page/distributed/${url}?${params.toString()}`,
+			{
+				headers: {
+					Authorization: `Bearer ${authToken}`,
+					"Content-Type": "application/json",
+				},
+			}
+		);
+	}
 
 	async getStatusPagesByTeamId(config) {
 		const { teamId } = config;
@@ -948,6 +963,15 @@ class NetworkService {
 			form.monitors.forEach((monitorId) => {
 				fd.append("monitors[]", monitorId);
 			});
+		// Handle subMonitors, even if it's an empty array
+		if (form.subMonitors && form.subMonitors.length > 0) {
+			form.subMonitors.forEach((monitorId) => {
+				fd.append("subMonitors[]", monitorId);
+			});
+		} else {
+			fd.append("deleteSubmonitors", true);
+		}
+
 		if (form?.logo?.src && form?.logo?.src !== "") {
 			const imageResult = await axios.get(form.logo.src, {
 				responseType: "blob",
diff --git a/src/Utils/Theme/globalTheme.js b/src/Utils/Theme/globalTheme.js
index c521cb117..66631edec 100644
--- a/src/Utils/Theme/globalTheme.js
+++ b/src/Utils/Theme/globalTheme.js
@@ -118,6 +118,7 @@ const baseTheme = (palette) => ({
 							},
 						},
 					],
+					height: 34,
 					fontWeight: 400,
 					borderRadius: 4,
 					boxShadow: "none",
diff --git a/src/Validation/validation.js b/src/Validation/validation.js
index 04088e44c..68c0b5f12 100644
--- a/src/Validation/validation.js
+++ b/src/Validation/validation.js
@@ -226,6 +226,7 @@ const statusPageValidation = joi.object({
 		"array.empty": "At least one monitor is required",
 		"any.required": "At least one monitor is required",
 	}),
+	subMonitors: joi.array().optional(),
 	logo: logoImageValidation,
 	showUptimePercentage: joi.boolean(),
 	showCharts: joi.boolean(),
diff --git a/src/assets/Images/jupiter_logo_banner_dark.svg b/src/assets/Images/jupiter_logo_banner_dark.svg
new file mode 100644
index 000000000..3d3e23b14
--- /dev/null
+++ b/src/assets/Images/jupiter_logo_banner_dark.svg
@@ -0,0 +1,35 @@
+<svg width="104" height="32" viewBox="0 0 104 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.09074 25.1666C4.44267 27.0471 6.17683 28.6205 8.1795 29.7838C10.1822 30.947 12.4081 31.6738 14.7114 31.9165C13.5264 30.1333 11.8039 28.4928 9.65354 27.2438C7.50318 25.9948 5.22591 25.3125 3.09074 25.1666Z" fill="url(#paint0_linear_13278_146906)"/>
+<path d="M12.543 22.2705C8.40015 19.8636 3.91612 19.2502 0.707662 20.3338C1.0174 21.3575 1.42589 22.3487 1.92738 23.2934C4.71498 23.2288 7.75856 23.9859 10.5906 25.6308C13.4227 27.2757 15.5888 29.5459 16.9143 32C17.9839 31.9672 19.0479 31.8309 20.0913 31.5932C19.4426 28.2698 16.6849 24.6779 12.543 22.2705Z" fill="url(#paint1_linear_13278_146906)"/>
+<path d="M32.2852 12.5009C31.7585 10.3584 30.8054 8.34403 29.4829 6.57804C28.1604 4.81205 26.4956 3.33067 24.5879 2.22235C22.6802 1.11403 20.5687 0.401504 18.3796 0.12731C16.1904 -0.146884 13.9684 0.02288 11.8463 0.626466C15.3915 1.06033 19.3267 2.39122 23.1859 4.63324C27.0452 6.87525 30.1533 9.63411 32.2852 12.5009Z" fill="url(#paint2_linear_13278_146906)"/>
+<path d="M27.1271 20.3583C25.3124 17.3446 22.2038 14.4588 18.3743 12.2342C14.5449 10.0095 10.4991 8.7388 6.98531 8.65474C3.894 8.58152 1.57389 9.48017 0.621548 11.1197C0.616124 11.1294 0.608531 11.1386 0.602566 11.1484C0.516877 11.4559 0.443119 11.7639 0.37587 12.0731C1.70568 11.5481 3.24645 11.2558 4.95969 11.2232C8.76959 11.1517 13.0334 12.3703 16.9681 14.6562C20.9027 16.9422 24.0759 20.0438 25.9003 23.3878C26.7182 24.8944 27.2285 26.3777 27.4308 27.7948C27.6662 27.5844 27.8972 27.3669 28.1212 27.1408C28.1272 27.1305 28.131 27.1196 28.1369 27.1088C29.0893 25.4677 28.721 23.0076 27.1271 20.3583Z" fill="url(#paint3_linear_13278_146906)"/>
+<path d="M15.4609 17.2485C9.59662 13.8416 3.11626 13.3079 -5.33621e-07 15.6855C0.00612042 16.4297 0.0630161 17.1726 0.170292 17.9091C1.08699 17.6312 2.03177 17.4562 2.98718 17.3874C6.46951 17.1254 10.3087 18.0957 13.7927 20.1207C17.2766 22.1458 20.023 25.0018 21.5209 28.1543C21.935 29.018 22.2508 29.9254 22.4624 30.8595C23.1555 30.5878 23.8294 30.2694 24.4794 29.9066C25.0011 26.0213 21.3268 20.656 15.4609 17.2485Z" fill="url(#paint4_linear_13278_146906)"/>
+<path d="M30.1434 15.3141C28.3082 12.3036 25.1724 9.40969 21.3158 7.17039C17.4593 4.93109 13.3977 3.64033 9.87257 3.53674C7.1853 3.45919 5.10382 4.11053 4.02457 5.34109C8.50588 4.58182 14.4168 5.85794 20.146 9.18625C25.8753 12.5146 29.9135 17.0181 31.4722 21.2868C32.0064 19.7406 31.5416 17.6098 30.1434 15.3141Z" fill="url(#paint5_linear_13278_146906)"/>
+<path d="M46.6645 9.90909L49.4003 9.90909L49.4003 19.0369C49.4003 19.8807 49.2107 20.6136 48.8314 21.2358C48.4564 21.858 47.9344 22.3374 47.2654 22.674C46.5963 23.0107 45.8186 23.179 44.9323 23.179C44.1439 23.179 43.428 23.0405 42.7845 22.7635C42.1453 22.4822 41.6382 22.0561 41.2632 21.4851C40.8882 20.9098 40.7029 20.1875 40.7071 19.3182L43.4621 19.3182C43.4706 19.6634 43.5409 19.9595 43.673 20.2067C43.8094 20.4496 43.9948 20.6371 44.2291 20.7692C44.4678 20.897 44.749 20.9609 45.0729 20.9609C45.4138 20.9609 45.7014 20.8885 45.9358 20.7436C46.1745 20.5945 46.3556 20.3771 46.4791 20.0916C46.6027 19.8061 46.6645 19.4545 46.6645 19.0369L46.6645 9.90909ZM57.9337 18.8196L57.9337 13.1818L60.6567 13.1818L60.6567 23L58.0423 23L58.0423 21.2166L57.9401 21.2166C57.7185 21.7919 57.3499 22.2543 56.8343 22.6037C56.3229 22.9531 55.6986 23.1278 54.9614 23.1278C54.3051 23.1278 53.7277 22.9787 53.2291 22.6804C52.7306 22.3821 52.3406 21.9581 52.0594 21.4084C51.7824 20.8587 51.6418 20.2003 51.6375 19.4332L51.6375 13.1818L54.3605 13.1818L54.3605 18.9474C54.3648 19.527 54.5203 19.9851 54.8272 20.3217C55.134 20.6584 55.5452 20.8267 56.0608 20.8267C56.3889 20.8267 56.6958 20.7521 56.9813 20.603C57.2668 20.4496 57.4969 20.2237 57.6716 19.9254C57.8506 19.6271 57.9379 19.2585 57.9337 18.8196ZM62.8348 26.6818L62.8348 13.1818L65.5194 13.1818L65.5194 14.831L65.6409 14.831C65.7602 14.5668 65.9328 14.2983 66.1586 14.0256C66.3888 13.7486 66.6871 13.5185 67.0535 13.3352C67.4243 13.1477 67.8845 13.054 68.4342 13.054C69.1501 13.054 69.8106 13.2415 70.4158 13.6165C71.0209 13.9872 71.5045 14.5476 71.8667 15.2976C72.229 16.0433 72.4101 16.9787 72.4101 18.1037C72.4101 19.1989 72.2332 20.1236 71.8795 20.8778C71.5301 21.6278 71.0528 22.1967 70.4477 22.5845C69.8469 22.968 69.1736 23.1598 68.4278 23.1598C67.8994 23.1598 67.4498 23.0724 67.0791 22.8977C66.7126 22.723 66.4122 22.5036 66.1778 22.2393C65.9435 21.9709 65.7645 21.7003 65.6409 21.4276L65.5578 21.4276L65.5578 26.6818L62.8348 26.6818ZM65.5003 18.0909C65.5003 18.6747 65.5812 19.1839 65.7432 19.6186C65.9051 20.0533 66.1395 20.392 66.4463 20.6349C66.7531 20.8736 67.126 20.9929 67.5649 20.9929C68.0081 20.9929 68.3831 20.8714 68.6899 20.6286C68.9967 20.3814 69.229 20.0405 69.3866 19.6058C69.5486 19.1669 69.6295 18.6619 69.6295 18.0909C69.6295 17.5241 69.5507 17.0256 69.393 16.5952C69.2354 16.1648 69.0031 15.8281 68.6963 15.5852C68.3895 15.3423 68.0123 15.2209 67.5649 15.2209C67.1217 15.2209 66.7467 15.3381 66.4399 15.5724C66.1373 15.8068 65.9051 16.1392 65.7432 16.5696C65.5812 17 65.5003 17.5071 65.5003 18.0909ZM74.2254 23L74.2254 13.1818L76.9484 13.1818L76.9484 23L74.2254 23ZM75.5933 11.9162C75.1885 11.9162 74.8412 11.782 74.5514 11.5135C74.2659 11.2408 74.1231 10.9148 74.1231 10.5355C74.1231 10.1605 74.2659 9.83878 74.5514 9.57031C74.8412 9.29759 75.1885 9.16122 75.5933 9.16122C75.9981 9.16122 76.3433 9.29759 76.6288 9.57031C76.9186 9.83878 77.0635 10.1605 77.0635 10.5355C77.0635 10.9148 76.9186 11.2408 76.6288 11.5135C76.3433 11.782 75.9981 11.9162 75.5933 11.9162ZM84.352 13.1818L84.352 15.2273L78.4394 15.2273L78.4394 13.1818L84.352 13.1818ZM79.7817 10.8295L82.5047 10.8295L82.5047 19.983C82.5047 20.2344 82.5431 20.4304 82.6198 20.571C82.6965 20.7074 82.803 20.8033 82.9394 20.8587C83.08 20.9141 83.2419 20.9418 83.4252 20.9418C83.553 20.9418 83.6808 20.9311 83.8087 20.9098C83.9365 20.8842 84.0345 20.8651 84.1027 20.8523L84.531 22.8786C84.3946 22.9212 84.2029 22.9702 83.9557 23.0256C83.7085 23.0852 83.4081 23.1215 83.0544 23.1342C82.3982 23.1598 81.8229 23.0724 81.3286 22.8722C80.8385 22.6719 80.4571 22.3608 80.1844 21.9389C79.9117 21.517 79.7774 20.9844 79.7817 20.3409L79.7817 10.8295ZM90.4948 23.1918C89.4848 23.1918 88.6155 22.9872 87.8868 22.5781C87.1624 22.1648 86.6041 21.581 86.2121 20.8267C85.82 20.0682 85.624 19.1712 85.624 18.1357C85.624 17.1257 85.82 16.2393 86.2121 15.4766C86.6041 14.7138 87.156 14.1193 87.8676 13.6932C88.5835 13.267 89.423 13.054 90.3861 13.054C91.0338 13.054 91.6368 13.1584 92.195 13.3672C92.7575 13.5717 93.2476 13.8807 93.6652 14.294C94.0871 14.7074 94.4152 15.2273 94.6496 15.8537C94.884 16.4759 95.0012 17.2045 95.0012 18.0398L95.0012 18.7876L86.7107 18.7876L86.7107 17.1001L92.4379 17.1001C92.4379 16.7081 92.3527 16.3608 92.1823 16.0582C92.0118 15.7557 91.7753 15.5192 91.4727 15.3487C91.1745 15.174 90.8272 15.0866 90.4308 15.0866C90.0175 15.0866 89.651 15.1825 89.3314 15.3743C89.0161 15.5618 88.7689 15.8153 88.5899 16.1349C88.411 16.4503 88.3193 16.8018 88.3151 17.1896L88.3151 18.794C88.3151 19.2798 88.4046 19.6996 88.5835 20.0533C88.7668 20.407 89.0246 20.6797 89.357 20.8715C89.6894 21.0632 90.0835 21.1591 90.5395 21.1591C90.8421 21.1591 91.1191 21.1165 91.3705 21.0313C91.6219 20.946 91.8371 20.8182 92.0161 20.6477C92.195 20.4773 92.3314 20.2685 92.4252 20.0213L94.9436 20.1875C94.8158 20.7926 94.5537 21.321 94.1574 21.7727C93.7654 22.2202 93.2583 22.5696 92.6361 22.821C92.0182 23.0682 91.3044 23.1918 90.4948 23.1918ZM96.7781 23L96.7781 13.1818L99.4181 13.1818L99.4181 14.8949L99.5203 14.8949C99.6993 14.2855 99.9997 13.8253 100.422 13.5142C100.843 13.1989 101.329 13.0412 101.879 13.0412C102.015 13.0412 102.162 13.0497 102.32 13.0668C102.478 13.0838 102.616 13.1072 102.736 13.1371L102.736 15.5533C102.608 15.5149 102.431 15.4808 102.205 15.451C101.979 15.4212 101.772 15.4063 101.585 15.4063C101.184 15.4063 100.826 15.4936 100.511 15.6683C100.2 15.8388 99.9529 16.0774 99.7696 16.3842C99.5906 16.6911 99.5012 17.0447 99.5012 17.4453L99.5012 23L96.7781 23Z" fill="white"/>
+<defs>
+<linearGradient id="paint0_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint1_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint3_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint5_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/assets/Images/jupiter_logo_banner_light.svg b/src/assets/Images/jupiter_logo_banner_light.svg
new file mode 100644
index 000000000..4744e0bcb
--- /dev/null
+++ b/src/assets/Images/jupiter_logo_banner_light.svg
@@ -0,0 +1,35 @@
+<svg width="104" height="32" viewBox="0 0 104 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.09074 25.1666C4.44267 27.0471 6.17683 28.6205 8.1795 29.7838C10.1822 30.947 12.4081 31.6738 14.7114 31.9165C13.5264 30.1333 11.8039 28.4928 9.65354 27.2438C7.50318 25.9948 5.22591 25.3125 3.09074 25.1666Z" fill="url(#paint0_linear_13278_146916)"/>
+<path d="M12.543 22.2705C8.40015 19.8636 3.91612 19.2502 0.707662 20.3338C1.0174 21.3575 1.42589 22.3487 1.92738 23.2934C4.71498 23.2288 7.75856 23.9859 10.5906 25.6308C13.4227 27.2757 15.5888 29.5459 16.9143 32C17.9839 31.9672 19.0479 31.8309 20.0913 31.5932C19.4426 28.2698 16.6849 24.6779 12.543 22.2705Z" fill="url(#paint1_linear_13278_146916)"/>
+<path d="M32.2852 12.5009C31.7585 10.3584 30.8054 8.34403 29.4829 6.57804C28.1604 4.81205 26.4956 3.33067 24.5879 2.22235C22.6802 1.11403 20.5687 0.401504 18.3796 0.12731C16.1904 -0.146884 13.9684 0.02288 11.8463 0.626466C15.3915 1.06033 19.3267 2.39122 23.1859 4.63324C27.0452 6.87525 30.1533 9.63411 32.2852 12.5009Z" fill="url(#paint2_linear_13278_146916)"/>
+<path d="M27.1271 20.3583C25.3124 17.3446 22.2038 14.4588 18.3743 12.2342C14.5449 10.0095 10.4991 8.7388 6.98531 8.65474C3.894 8.58152 1.57389 9.48017 0.621548 11.1197C0.616124 11.1294 0.608531 11.1386 0.602566 11.1484C0.516877 11.4559 0.443119 11.7639 0.37587 12.0731C1.70568 11.5481 3.24645 11.2558 4.95969 11.2232C8.76959 11.1517 13.0334 12.3703 16.9681 14.6562C20.9027 16.9422 24.0759 20.0438 25.9003 23.3878C26.7182 24.8944 27.2285 26.3777 27.4308 27.7948C27.6662 27.5844 27.8972 27.3669 28.1212 27.1408C28.1272 27.1305 28.131 27.1196 28.1369 27.1088C29.0893 25.4677 28.721 23.0076 27.1271 20.3583Z" fill="url(#paint3_linear_13278_146916)"/>
+<path d="M15.4609 17.2485C9.59662 13.8416 3.11626 13.3079 -5.33621e-07 15.6855C0.00612042 16.4297 0.0630161 17.1726 0.170292 17.9091C1.08699 17.6312 2.03177 17.4562 2.98718 17.3874C6.46951 17.1254 10.3087 18.0957 13.7927 20.1207C17.2766 22.1458 20.023 25.0018 21.5209 28.1543C21.935 29.018 22.2508 29.9254 22.4624 30.8595C23.1555 30.5878 23.8294 30.2694 24.4794 29.9066C25.0011 26.0213 21.3268 20.656 15.4609 17.2485Z" fill="url(#paint4_linear_13278_146916)"/>
+<path d="M30.1434 15.3141C28.3082 12.3036 25.1724 9.40969 21.3158 7.17039C17.4593 4.93109 13.3977 3.64033 9.87257 3.53674C7.1853 3.45919 5.10382 4.11053 4.02457 5.34109C8.50588 4.58182 14.4168 5.85794 20.146 9.18625C25.8753 12.5146 29.9135 17.0181 31.4722 21.2868C32.0064 19.7406 31.5416 17.6098 30.1434 15.3141Z" fill="url(#paint5_linear_13278_146916)"/>
+<path d="M46.6645 9.90909L49.4003 9.90909L49.4003 19.0369C49.4003 19.8807 49.2106 20.6136 48.8314 21.2358C48.4564 21.858 47.9344 22.3374 47.2653 22.674C46.5963 23.0107 45.8186 23.179 44.9322 23.179C44.1439 23.179 43.428 23.0405 42.7845 22.7635C42.1453 22.4822 41.6382 22.0561 41.2632 21.4851C40.8882 20.9098 40.7028 20.1875 40.7071 19.3182L43.4621 19.3182C43.4706 19.6634 43.5409 19.9595 43.673 20.2067C43.8094 20.4496 43.9947 20.6371 44.2291 20.7692C44.4677 20.897 44.749 20.9609 45.0729 20.9609C45.4138 20.9609 45.7014 20.8885 45.9358 20.7436C46.1744 20.5945 46.3555 20.3771 46.4791 20.0916C46.6027 19.8061 46.6645 19.4545 46.6645 19.0369L46.6645 9.90909ZM57.9337 18.8196L57.9337 13.1818L60.6567 13.1818L60.6567 23L58.0423 23L58.0423 21.2166L57.94 21.2166C57.7185 21.7919 57.3498 22.2543 56.8342 22.6037C56.3229 22.9531 55.6986 23.1278 54.9614 23.1278C54.3051 23.1278 53.7277 22.9787 53.2291 22.6804C52.7305 22.3821 52.3406 21.9581 52.0594 21.4084C51.7824 20.8587 51.6418 20.2003 51.6375 19.4332L51.6375 13.1818L54.3605 13.1818L54.3605 18.9474C54.3648 19.527 54.5203 19.9851 54.8271 20.3217C55.1339 20.6584 55.5452 20.8267 56.0608 20.8267C56.3889 20.8267 56.6957 20.7521 56.9812 20.603C57.2668 20.4496 57.4969 20.2237 57.6716 19.9254C57.8506 19.6271 57.9379 19.2585 57.9337 18.8196ZM62.8348 26.6818L62.8348 13.1818L65.5194 13.1818L65.5194 14.831L65.6409 14.831C65.7602 14.5668 65.9328 14.2983 66.1586 14.0256C66.3887 13.7486 66.687 13.5185 67.0535 13.3352C67.4242 13.1477 67.8845 13.054 68.4342 13.054C69.1501 13.054 69.8106 13.2415 70.4157 13.6165C71.0208 13.9872 71.5045 14.5476 71.8667 15.2976C72.2289 16.0433 72.41 16.9787 72.41 18.1037C72.41 19.1989 72.2332 20.1236 71.8795 20.8778C71.5301 21.6278 71.0528 22.1967 70.4477 22.5845C69.8468 22.968 69.1735 23.1598 68.4278 23.1598C67.8994 23.1598 67.4498 23.0724 67.0791 22.8977C66.7126 22.723 66.4122 22.5036 66.1778 22.2393C65.9434 21.9709 65.7644 21.7003 65.6409 21.4276L65.5578 21.4276L65.5578 26.6818L62.8348 26.6818ZM65.5002 18.0909C65.5002 18.6747 65.5812 19.1839 65.7431 19.6186C65.9051 20.0533 66.1394 20.392 66.4463 20.6349C66.7531 20.8736 67.1259 20.9929 67.5649 20.9929C68.0081 20.9929 68.3831 20.8714 68.6899 20.6286C68.9967 20.3814 69.2289 20.0405 69.3866 19.6058C69.5485 19.1669 69.6295 18.6619 69.6295 18.0909C69.6295 17.5241 69.5507 17.0256 69.393 16.5952C69.2353 16.1648 69.0031 15.8281 68.6963 15.5852C68.3894 15.3423 68.0123 15.2209 67.5649 15.2209C67.1217 15.2209 66.7467 15.3381 66.4399 15.5724C66.1373 15.8068 65.9051 16.1392 65.7431 16.5696C65.5812 17 65.5002 17.5071 65.5002 18.0909ZM74.2254 23L74.2254 13.1818L76.9484 13.1818L76.9484 23L74.2254 23ZM75.5933 11.9162C75.1884 11.9162 74.8411 11.782 74.5514 11.5135C74.2659 11.2408 74.1231 10.9148 74.1231 10.5355C74.1231 10.1605 74.2659 9.83878 74.5514 9.57031C74.8411 9.29759 75.1884 9.16122 75.5933 9.16122C75.9981 9.16122 76.3433 9.29759 76.6288 9.57031C76.9186 9.83878 77.0634 10.1605 77.0634 10.5355C77.0634 10.9148 76.9186 11.2408 76.6288 11.5135C76.3433 11.782 75.9981 11.9162 75.5933 11.9162ZM84.352 13.1818L84.352 15.2273L78.4393 15.2273L78.4393 13.1818L84.352 13.1818ZM79.7817 10.8295L82.5047 10.8295L82.5047 19.983C82.5047 20.2344 82.543 20.4304 82.6197 20.571C82.6964 20.7074 82.803 20.8033 82.9393 20.8587C83.08 20.9141 83.2419 20.9418 83.4251 20.9418C83.553 20.9418 83.6808 20.9311 83.8087 20.9098C83.9365 20.8842 84.0345 20.8651 84.1027 20.8523L84.531 22.8786C84.3946 22.9212 84.2028 22.9702 83.9557 23.0256C83.7085 23.0852 83.4081 23.1215 83.0544 23.1342C82.3981 23.1598 81.8229 23.0724 81.3285 22.8722C80.8385 22.6719 80.4571 22.3608 80.1844 21.9389C79.9116 21.517 79.7774 20.9844 79.7817 20.3409L79.7817 10.8295ZM90.4947 23.1918C89.4848 23.1918 88.6155 22.9872 87.8868 22.5781C87.1623 22.1648 86.6041 21.581 86.2121 20.8267C85.82 20.0682 85.624 19.1712 85.624 18.1357C85.624 17.1257 85.82 16.2393 86.2121 15.4766C86.6041 14.7138 87.156 14.1193 87.8676 13.6932C88.5835 13.267 89.423 13.054 90.3861 13.054C91.0338 13.054 91.6368 13.1584 92.195 13.3672C92.7575 13.5717 93.2476 13.8807 93.6652 14.294C94.0871 14.7074 94.4152 15.2273 94.6496 15.8537C94.8839 16.4759 95.0011 17.2045 95.0011 18.0398L95.0011 18.7876L86.7106 18.7876L86.7106 17.1001L92.4379 17.1001C92.4379 16.7081 92.3527 16.3608 92.1822 16.0582C92.0118 15.7557 91.7753 15.5192 91.4727 15.3487C91.1744 15.174 90.8271 15.0866 90.4308 15.0866C90.0175 15.0866 89.651 15.1825 89.3314 15.3743C89.016 15.5618 88.7689 15.8153 88.5899 16.1349C88.4109 16.4503 88.3193 16.8018 88.315 17.1896L88.315 18.794C88.315 19.2798 88.4045 19.6996 88.5835 20.0533C88.7668 20.407 89.0246 20.6797 89.3569 20.8715C89.6893 21.0632 90.0835 21.1591 90.5395 21.1591C90.842 21.1591 91.119 21.1165 91.3704 21.0313C91.6219 20.946 91.8371 20.8182 92.016 20.6477C92.195 20.4773 92.3314 20.2685 92.4251 20.0213L94.9436 20.1875C94.8158 20.7926 94.5537 21.321 94.1574 21.7727C93.7653 22.2202 93.2582 22.5696 92.6361 22.821C92.0182 23.0682 91.3044 23.1918 90.4947 23.1918ZM96.7781 23L96.7781 13.1818L99.418 13.1818L99.418 14.8949L99.5203 14.8949C99.6993 14.2855 99.9997 13.8253 100.422 13.5142C100.843 13.1989 101.329 13.0412 101.879 13.0412C102.015 13.0412 102.162 13.0497 102.32 13.0668C102.478 13.0838 102.616 13.1072 102.736 13.1371L102.736 15.5533C102.608 15.5149 102.431 15.4808 102.205 15.451C101.979 15.4212 101.772 15.4063 101.585 15.4063C101.184 15.4063 100.826 15.4936 100.511 15.6683C100.2 15.8388 99.9528 16.0774 99.7696 16.3842C99.5906 16.6911 99.5011 17.0447 99.5011 17.4453L99.5011 23L96.7781 23Z" fill="#111726"/>
+<defs>
+<linearGradient id="paint0_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint1_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint2_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint3_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint4_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint5_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/assets/Images/solana_logo_banner_dark.svg b/src/assets/Images/solana_logo_banner_dark.svg
new file mode 100644
index 000000000..08ec87cb1
--- /dev/null
+++ b/src/assets/Images/solana_logo_banner_dark.svg
@@ -0,0 +1,24 @@
+<svg width="646" height="96" viewBox="0 0 646 96" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1064_606)">
+<path d="M108.53 75.6899L90.81 94.6899C90.4267 95.1026 89.9626 95.432 89.4464 95.6573C88.9303 95.8827 88.3732 95.9994 87.81 95.9999H3.81C3.40937 95.9997 3.01749 95.8827 2.68235 95.6631C2.34722 95.4436 2.08338 95.1311 1.92313 94.7639C1.76288 94.3967 1.71318 93.9908 1.78012 93.5958C1.84706 93.2008 2.02772 92.8338 2.3 92.5399L20 73.5399C20.3833 73.1273 20.8474 72.7979 21.3636 72.5725C21.8797 72.3472 22.4368 72.2305 23 72.2299H107C107.404 72.2216 107.802 72.333 108.143 72.5502C108.484 72.7674 108.754 73.0806 108.917 73.4504C109.081 73.8203 109.131 74.2303 109.062 74.6288C108.993 75.0273 108.808 75.3965 108.53 75.6899ZM90.81 37.4199C90.4253 37.0091 89.9608 36.6811 89.445 36.4558C88.9292 36.2306 88.3728 36.1129 87.81 36.11H3.81C3.40937 36.1102 3.01749 36.2272 2.68235 36.4468C2.34722 36.6663 2.08338 36.9788 1.92313 37.346C1.76288 37.7132 1.71318 38.1191 1.78012 38.5141C1.84706 38.9091 2.02772 39.2761 2.3 39.57L20 58.58C20.3847 58.9908 20.8492 59.3188 21.365 59.5441C21.8808 59.7693 22.4372 59.887 23 59.8899H107C107.4 59.8878 107.79 59.7693 108.124 59.5491C108.458 59.3288 108.72 59.0162 108.879 58.6494C109.038 58.2826 109.087 57.8774 109.019 57.4833C108.952 57.0892 108.772 56.7232 108.5 56.43L90.81 37.4199ZM3.81 23.7699H87.81C88.3732 23.7694 88.9303 23.6527 89.4464 23.4273C89.9626 23.202 90.4267 22.8726 90.81 22.4599L108.53 3.45995C108.808 3.16647 108.993 2.79726 109.062 2.39877C109.131 2.00028 109.081 1.59031 108.917 1.22045C108.754 0.850591 108.484 0.537368 108.143 0.320195C107.802 0.103021 107.404 -0.0084012 107 -5.10783e-05H23C22.4368 0.000541762 21.8797 0.117167 21.3636 0.342553C20.8474 0.567938 20.3833 0.897249 20 1.30995L2.3 20.3099C2.02772 20.6038 1.84706 20.9708 1.78012 21.3658C1.71318 21.7608 1.76288 22.1667 1.92313 22.5339C2.08338 22.9011 2.34722 23.2136 2.68235 23.4331C3.01749 23.6527 3.40937 23.7697 3.81 23.7699Z" fill="url(#paint0_linear_1064_606)"/>
+<path d="M210.94 40.6002H166V25.8002H222.62V11.0002H165.85C163.91 10.9897 161.988 11.3613 160.192 12.0938C158.396 12.8264 156.761 13.9055 155.383 15.2696C154.004 16.6337 152.907 18.2561 152.155 20.044C151.403 21.832 151.01 23.7506 151 25.6902V40.6902C151.008 42.6315 151.398 44.5523 152.149 46.3425C152.9 48.1328 153.996 49.7575 155.375 51.1237C156.755 52.49 158.39 53.5709 160.187 54.3047C161.984 55.0385 163.909 55.4108 165.85 55.4002H210.85V70.2002H152.07V85.0002H210.94C212.88 85.0108 214.802 84.6391 216.598 83.9066C218.394 83.174 220.029 82.0949 221.407 80.7308C222.786 79.3667 223.883 77.7444 224.635 75.9564C225.387 74.1684 225.78 72.2498 225.79 70.3102V55.3102C225.782 53.3689 225.392 51.4482 224.641 49.6579C223.89 47.8676 222.794 46.2429 221.415 44.8767C220.035 43.5105 218.4 42.4296 216.603 41.6958C214.806 40.962 212.881 40.5897 210.94 40.6002Z" fill="white"/>
+<path d="M298 11H252.89C250.947 10.9842 249.02 11.3519 247.219 12.0821C245.419 12.8123 243.78 13.8905 242.397 15.2552C241.013 16.6198 239.913 18.2439 239.159 20.0345C238.404 21.8251 238.01 23.747 238 25.69V70.31C238.01 72.253 238.404 74.1749 239.159 75.9655C239.913 77.7561 241.013 79.3802 242.397 80.7448C243.78 82.1095 245.419 83.1877 247.219 83.9179C249.02 84.6481 250.947 85.0158 252.89 85H298C299.94 85.0105 301.862 84.6389 303.658 83.9064C305.454 83.1738 307.089 82.0947 308.467 80.7306C309.846 79.3665 310.943 77.7441 311.695 75.9562C312.447 74.1682 312.84 72.2496 312.85 70.31V25.69C312.84 23.7504 312.447 21.8318 311.695 20.0438C310.943 18.2559 309.846 16.6335 308.467 15.2694C307.089 13.9053 305.454 12.8262 303.658 12.0936C301.862 11.3611 299.94 10.9895 298 11ZM297.89 70.2H253V25.8H297.87L297.89 70.2Z" fill="white"/>
+<path d="M456 11.0001H412C410.06 10.9896 408.138 11.3612 406.342 12.0937C404.546 12.8263 402.911 13.9054 401.533 15.2695C400.154 16.6336 399.057 18.256 398.305 20.0439C397.553 21.8319 397.16 23.7505 397.15 25.6901V85.0001H412.15V60.6901H455.95V85.0001H470.95V25.6901C470.94 23.742 470.544 21.8152 469.786 20.0206C469.027 18.2261 467.922 16.5993 466.532 15.2338C465.143 13.8684 463.497 12.7914 461.689 12.0648C459.881 11.3382 457.948 10.9764 456 11.0001ZM455.89 45.8901H412.09V25.8001H455.89V45.8901Z" fill="white"/>
+<path d="M631.15 11.0002H587.15C585.21 10.9897 583.288 11.3613 581.492 12.0938C579.696 12.8264 578.062 13.9055 576.683 15.2696C575.304 16.6337 574.207 18.2561 573.455 20.044C572.703 21.832 572.31 23.7506 572.3 25.6902V85.0002H587.3V60.6902H631V85.0002H646V25.6902C645.99 23.7506 645.597 21.832 644.845 20.044C644.093 18.2561 642.996 16.6337 641.617 15.2696C640.238 13.9055 638.604 12.8264 636.808 12.0938C635.012 11.3613 633.09 10.9897 631.15 11.0002ZM631 45.8902H587.2V25.8002H631V45.8902Z" fill="white"/>
+<path d="M544 70.2001H538L516.55 17.2001C515.815 15.3716 514.55 13.8045 512.918 12.6999C511.286 11.5952 509.361 11.0033 507.39 11.0001H494.08C492.786 10.9935 491.504 11.2418 490.307 11.7307C489.109 12.2197 488.02 12.9397 487.1 13.8497C486.181 14.7598 485.45 15.8419 484.949 17.0345C484.448 18.227 484.187 19.5066 484.18 20.8001V85.0001H499.18V25.8001H505.18L526.62 78.8001C527.367 80.6251 528.642 82.1858 530.281 83.283C531.919 84.3803 533.848 84.9641 535.82 84.9601H549.13C550.424 84.9667 551.706 84.7185 552.903 84.2295C554.101 83.7406 555.19 83.0205 556.11 82.1105C557.029 81.2005 557.76 80.1183 558.261 78.9258C558.762 77.7332 559.023 76.4537 559.03 75.1601V11.0001H544V70.2001Z" fill="white"/>
+<path d="M341.1 11H326.1V70.31C326.11 72.2539 326.505 74.1766 327.26 75.9678C328.015 77.7591 329.116 79.3836 330.5 80.7484C331.884 82.1132 333.525 83.1912 335.326 83.9208C337.128 84.6504 339.056 85.0171 341 85H386V70.2H341.1V11Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_1064_606" x1="10.81" y1="98.29" x2="98.89" y2="-1.01005" gradientUnits="userSpaceOnUse">
+<stop offset="0.08" stop-color="#9945FF"/>
+<stop offset="0.3" stop-color="#8752F3"/>
+<stop offset="0.5" stop-color="#5497D5"/>
+<stop offset="0.6" stop-color="#43B4CA"/>
+<stop offset="0.72" stop-color="#28E0B9"/>
+<stop offset="0.97" stop-color="#19FB9B"/>
+</linearGradient>
+<clipPath id="clip0_1064_606">
+<rect width="646" height="96" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/Images/solana_logo_banner_light.svg b/src/assets/Images/solana_logo_banner_light.svg
new file mode 100644
index 000000000..774018a6a
--- /dev/null
+++ b/src/assets/Images/solana_logo_banner_light.svg
@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="646" height="96" viewBox="0 0 646 96" fill="none" version="1.1" id="svg36"
+   sodipodi:docname="solana_logo_banner_dark.svg" inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+   <sodipodi:namedview id="namedview38" pagecolor="#ffffff" bordercolor="#000000" borderopacity="0.25"
+      inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1"
+      showgrid="false" inkscape:zoom="2.0820433" inkscape:cx="324.68104" inkscape:cy="48.02974"
+      inkscape:window-width="1854" inkscape:window-height="1131" inkscape:window-x="0" inkscape:window-y="0"
+      inkscape:window-maximized="1" inkscape:current-layer="svg36" />
+   <g clip-path="url(#clip0_1064_606)" id="g16">
+      <path
+         d="M108.53 75.6899L90.81 94.6899C90.4267 95.1026 89.9626 95.432 89.4464 95.6573C88.9303 95.8827 88.3732 95.9994 87.81 95.9999H3.81C3.40937 95.9997 3.01749 95.8827 2.68235 95.6631C2.34722 95.4436 2.08338 95.1311 1.92313 94.7639C1.76288 94.3967 1.71318 93.9908 1.78012 93.5958C1.84706 93.2008 2.02772 92.8338 2.3 92.5399L20 73.5399C20.3833 73.1273 20.8474 72.7979 21.3636 72.5725C21.8797 72.3472 22.4368 72.2305 23 72.2299H107C107.404 72.2216 107.802 72.333 108.143 72.5502C108.484 72.7674 108.754 73.0806 108.917 73.4504C109.081 73.8203 109.131 74.2303 109.062 74.6288C108.993 75.0273 108.808 75.3965 108.53 75.6899ZM90.81 37.4199C90.4253 37.0091 89.9608 36.6811 89.445 36.4558C88.9292 36.2306 88.3728 36.1129 87.81 36.11H3.81C3.40937 36.1102 3.01749 36.2272 2.68235 36.4468C2.34722 36.6663 2.08338 36.9788 1.92313 37.346C1.76288 37.7132 1.71318 38.1191 1.78012 38.5141C1.84706 38.9091 2.02772 39.2761 2.3 39.57L20 58.58C20.3847 58.9908 20.8492 59.3188 21.365 59.5441C21.8808 59.7693 22.4372 59.887 23 59.8899H107C107.4 59.8878 107.79 59.7693 108.124 59.5491C108.458 59.3288 108.72 59.0162 108.879 58.6494C109.038 58.2826 109.087 57.8774 109.019 57.4833C108.952 57.0892 108.772 56.7232 108.5 56.43L90.81 37.4199ZM3.81 23.7699H87.81C88.3732 23.7694 88.9303 23.6527 89.4464 23.4273C89.9626 23.202 90.4267 22.8726 90.81 22.4599L108.53 3.45995C108.808 3.16647 108.993 2.79726 109.062 2.39877C109.131 2.00028 109.081 1.59031 108.917 1.22045C108.754 0.850591 108.484 0.537368 108.143 0.320195C107.802 0.103021 107.404 -0.0084012 107 -5.10783e-05H23C22.4368 0.000541762 21.8797 0.117167 21.3636 0.342553C20.8474 0.567938 20.3833 0.897249 20 1.30995L2.3 20.3099C2.02772 20.6038 1.84706 20.9708 1.78012 21.3658C1.71318 21.7608 1.76288 22.1667 1.92313 22.5339C2.08338 22.9011 2.34722 23.2136 2.68235 23.4331C3.01749 23.6527 3.40937 23.7697 3.81 23.7699Z"
+         fill="url(#paint0_linear_1064_606)" id="path2" />
+      <path
+         d="M210.94 40.6002H166V25.8002H222.62V11.0002H165.85C163.91 10.9897 161.988 11.3613 160.192 12.0938C158.396 12.8264 156.761 13.9055 155.383 15.2696C154.004 16.6337 152.907 18.2561 152.155 20.044C151.403 21.832 151.01 23.7506 151 25.6902V40.6902C151.008 42.6315 151.398 44.5523 152.149 46.3425C152.9 48.1328 153.996 49.7575 155.375 51.1237C156.755 52.49 158.39 53.5709 160.187 54.3047C161.984 55.0385 163.909 55.4108 165.85 55.4002H210.85V70.2002H152.07V85.0002H210.94C212.88 85.0108 214.802 84.6391 216.598 83.9066C218.394 83.174 220.029 82.0949 221.407 80.7308C222.786 79.3667 223.883 77.7444 224.635 75.9564C225.387 74.1684 225.78 72.2498 225.79 70.3102V55.3102C225.782 53.3689 225.392 51.4482 224.641 49.6579C223.89 47.8676 222.794 46.2429 221.415 44.8767C220.035 43.5105 218.4 42.4296 216.603 41.6958C214.806 40.962 212.881 40.5897 210.94 40.6002Z"
+         fill="white" id="path4" style="fill:#000000;fill-opacity:1" />
+      <path
+         d="M298 11H252.89C250.947 10.9842 249.02 11.3519 247.219 12.0821C245.419 12.8123 243.78 13.8905 242.397 15.2552C241.013 16.6198 239.913 18.2439 239.159 20.0345C238.404 21.8251 238.01 23.747 238 25.69V70.31C238.01 72.253 238.404 74.1749 239.159 75.9655C239.913 77.7561 241.013 79.3802 242.397 80.7448C243.78 82.1095 245.419 83.1877 247.219 83.9179C249.02 84.6481 250.947 85.0158 252.89 85H298C299.94 85.0105 301.862 84.6389 303.658 83.9064C305.454 83.1738 307.089 82.0947 308.467 80.7306C309.846 79.3665 310.943 77.7441 311.695 75.9562C312.447 74.1682 312.84 72.2496 312.85 70.31V25.69C312.84 23.7504 312.447 21.8318 311.695 20.0438C310.943 18.2559 309.846 16.6335 308.467 15.2694C307.089 13.9053 305.454 12.8262 303.658 12.0936C301.862 11.3611 299.94 10.9895 298 11ZM297.89 70.2H253V25.8H297.87L297.89 70.2Z"
+         fill="white" id="path6" style="fill:#000000" />
+      <path
+         d="M456 11.0001H412C410.06 10.9896 408.138 11.3612 406.342 12.0937C404.546 12.8263 402.911 13.9054 401.533 15.2695C400.154 16.6336 399.057 18.256 398.305 20.0439C397.553 21.8319 397.16 23.7505 397.15 25.6901V85.0001H412.15V60.6901H455.95V85.0001H470.95V25.6901C470.94 23.742 470.544 21.8152 469.786 20.0206C469.027 18.2261 467.922 16.5993 466.532 15.2338C465.143 13.8684 463.497 12.7914 461.689 12.0648C459.881 11.3382 457.948 10.9764 456 11.0001ZM455.89 45.8901H412.09V25.8001H455.89V45.8901Z"
+         fill="white" id="path8" style="fill:#000000" />
+      <path
+         d="M631.15 11.0002H587.15C585.21 10.9897 583.288 11.3613 581.492 12.0938C579.696 12.8264 578.062 13.9055 576.683 15.2696C575.304 16.6337 574.207 18.2561 573.455 20.044C572.703 21.832 572.31 23.7506 572.3 25.6902V85.0002H587.3V60.6902H631V85.0002H646V25.6902C645.99 23.7506 645.597 21.832 644.845 20.044C644.093 18.2561 642.996 16.6337 641.617 15.2696C640.238 13.9055 638.604 12.8264 636.808 12.0938C635.012 11.3613 633.09 10.9897 631.15 11.0002ZM631 45.8902H587.2V25.8002H631V45.8902Z"
+         fill="white" id="path10" style="fill:#000000" />
+      <path
+         d="M544 70.2001H538L516.55 17.2001C515.815 15.3716 514.55 13.8045 512.918 12.6999C511.286 11.5952 509.361 11.0033 507.39 11.0001H494.08C492.786 10.9935 491.504 11.2418 490.307 11.7307C489.109 12.2197 488.02 12.9397 487.1 13.8497C486.181 14.7598 485.45 15.8419 484.949 17.0345C484.448 18.227 484.187 19.5066 484.18 20.8001V85.0001H499.18V25.8001H505.18L526.62 78.8001C527.367 80.6251 528.642 82.1858 530.281 83.283C531.919 84.3803 533.848 84.9641 535.82 84.9601H549.13C550.424 84.9667 551.706 84.7185 552.903 84.2295C554.101 83.7406 555.19 83.0205 556.11 82.1105C557.029 81.2005 557.76 80.1183 558.261 78.9258C558.762 77.7332 559.023 76.4537 559.03 75.1601V11.0001H544V70.2001Z"
+         fill="white" id="path12" style="fill:#000000" />
+      <path
+         d="M341.1 11H326.1V70.31C326.11 72.2539 326.505 74.1766 327.26 75.9678C328.015 77.7591 329.116 79.3836 330.5 80.7484C331.884 82.1132 333.525 83.1912 335.326 83.9208C337.128 84.6504 339.056 85.0171 341 85H386V70.2H341.1V11Z"
+         fill="white" id="path14" style="fill:#000000" />
+   </g>
+   <defs id="defs34">
+      <linearGradient id="paint0_linear_1064_606" x1="10.81" y1="98.29" x2="98.89" y2="-1.01005"
+         gradientUnits="userSpaceOnUse">
+         <stop offset="0.08" stop-color="#9945FF" id="stop18" />
+         <stop offset="0.3" stop-color="#8752F3" id="stop20" />
+         <stop offset="0.5" stop-color="#5497D5" id="stop22" />
+         <stop offset="0.6" stop-color="#43B4CA" id="stop24" />
+         <stop offset="0.72" stop-color="#28E0B9" id="stop26" />
+         <stop offset="0.97" stop-color="#19FB9B" id="stop28" />
+      </linearGradient>
+      <clipPath id="clip0_1064_606">
+         <rect width="646" height="96" fill="white" id="rect31" />
+      </clipPath>
+   </defs>
+</svg>
\ No newline at end of file
diff --git a/src/assets/icons/bwu-icon.svg b/src/assets/icons/bwu-icon.svg
new file mode 100644
index 000000000..80ab50ad9
--- /dev/null
+++ b/src/assets/icons/bwu-icon.svg
@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="32" height="32" fill="#1570EF"/>
+<path d="M4.43466 24V9.45455H10.0028C11.054 9.45455 11.9276 9.62026 12.6236 9.9517C13.3243 10.2784 13.8475 10.7259 14.1932 11.294C14.5436 11.8622 14.7188 12.5062 14.7188 13.2259C14.7188 13.8177 14.6051 14.3243 14.3778 14.7457C14.1506 15.1624 13.8452 15.5009 13.4616 15.7614C13.0781 16.0218 12.6496 16.2088 12.1761 16.3224V16.4645C12.6922 16.4929 13.187 16.6515 13.6605 16.9403C14.1387 17.2244 14.5294 17.6269 14.8324 18.1477C15.1354 18.6686 15.2869 19.2983 15.2869 20.0369C15.2869 20.7898 15.1046 21.4669 14.7401 22.0682C14.3755 22.6648 13.8262 23.1359 13.0923 23.4815C12.3584 23.8272 11.4351 24 10.3224 24H4.43466ZM7.0696 21.7983H9.90341C10.8598 21.7983 11.5488 21.616 11.9702 21.2514C12.3963 20.8821 12.6094 20.4086 12.6094 19.831C12.6094 19.4001 12.5028 19.0118 12.2898 18.6662C12.0767 18.3158 11.7737 18.0412 11.3807 17.8423C10.9877 17.6387 10.5189 17.5369 9.97443 17.5369H7.0696V21.7983ZM7.0696 15.6406H9.67614C10.1307 15.6406 10.5402 15.5578 10.9048 15.392C11.2694 15.2216 11.5559 14.9825 11.7642 14.6747C11.9773 14.3622 12.0838 13.9929 12.0838 13.5668C12.0838 13.0033 11.8849 12.5393 11.4872 12.1747C11.0942 11.8101 10.5095 11.6278 9.73295 11.6278H7.0696V15.6406ZM25.5482 9.45455H28.1832V18.9574C28.1832 19.9991 27.937 20.9152 27.4445 21.706C26.9568 22.4967 26.2703 23.1146 25.3849 23.5597C24.4995 24 23.4649 24.2202 22.2812 24.2202C21.0927 24.2202 20.0558 24 19.1704 23.5597C18.285 23.1146 17.5984 22.4967 17.1107 21.706C16.623 20.9152 16.3792 19.9991 16.3792 18.9574V9.45455H19.0141V18.7372C19.0141 19.3433 19.1467 19.883 19.4119 20.3565C19.6817 20.83 20.0605 21.2017 20.5482 21.4716C21.0359 21.7367 21.6136 21.8693 22.2812 21.8693C22.9488 21.8693 23.5264 21.7367 24.0141 21.4716C24.5066 21.2017 24.8853 20.83 25.1505 20.3565C25.4156 19.883 25.5482 19.3433 25.5482 18.7372V9.45455Z" fill="white"/>
+</svg>
diff --git a/src/assets/icons/groups.svg b/src/assets/icons/groups.svg
new file mode 100644
index 000000000..fa2cae03c
--- /dev/null
+++ b/src/assets/icons/groups.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#5f6368"><g><rect fill="none" height="24" width="24"/></g><g><g/><g><g><path d="M16.67,13.13C18.04,14.06,19,15.32,19,17v3h4v-3 C23,14.82,19.43,13.53,16.67,13.13z" fill-rule="evenodd"/></g><g><circle cx="9" cy="8" fill-rule="evenodd" r="4"/></g><g><path d="M15,12c2.21,0,4-1.79,4-4c0-2.21-1.79-4-4-4c-0.47,0-0.91,0.1-1.33,0.24 C14.5,5.27,15,6.58,15,8s-0.5,2.73-1.33,3.76C14.09,11.9,14.53,12,15,12z" fill-rule="evenodd"/></g><g><path d="M9,13c-2.67,0-8,1.34-8,4v3h16v-3C17,14.34,11.67,13,9,13z" fill-rule="evenodd"/></g></g></g></svg>
\ No newline at end of file
diff --git a/src/assets/icons/jupiter_ag_logo.svg b/src/assets/icons/jupiter_ag_logo.svg
new file mode 100644
index 000000000..b344961c8
--- /dev/null
+++ b/src/assets/icons/jupiter_ag_logo.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="katman_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 800 800" style="enable-background:new 0 0 800 800;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#141726;}
+	.st1{fill:url(#SVGID_1_);}
+	.st2{fill:url(#SVGID_2_);}
+	.st3{fill:url(#SVGID_3_);}
+	.st4{fill:url(#SVGID_4_);}
+	.st5{fill:url(#SVGID_5_);}
+	.st6{fill:url(#SVGID_6_);}
+</style>
+<circle class="st0" cx="400" cy="400" r="400"/>
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="574.9257" y1="665.8727" x2="248.5257" y2="142.3127" gradientTransform="matrix(1 0 0 -1 0 800)">
+	<stop  offset="0.16" style="stop-color:#C6F462"/>
+	<stop  offset="0.89" style="stop-color:#33D9FF"/>
+</linearGradient>
+<path class="st1" d="M536,568.9c-66.8-108.5-166.4-170-289.4-195.6c-43.5-9-87.2-8.9-129.4,7.7c-28.9,11.4-33.3,23.4-19.7,53.7
+	c92.4-21.9,178.4-1.5,258.9,45c81.1,46.9,141.6,112.2,169.1,205c38.6-11.8,43.6-18.3,34.3-54.2C554.3,609.4,547.4,587.4,536,568.9
+	L536,568.9z"/>
+<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="572.5896" y1="667.3303" x2="246.1996" y2="143.7703" gradientTransform="matrix(1 0 0 -1 0 800)">
+	<stop  offset="0.16" style="stop-color:#C6F462"/>
+	<stop  offset="0.89" style="stop-color:#33D9FF"/>
+</linearGradient>
+<path class="st2" d="M609.1,480.6c-85.8-125-207.3-194.9-355.8-218.3c-39.3-6.2-79.4-4.5-116.2,14.3c-17.6,9-33.2,20.5-37.4,44.9
+	c115.8-31.9,219.7-3.7,317.5,53c98.3,57,175.1,133.5,205,251.1c20.8-18.4,24.5-41,19.1-62C633.9,534.8,625.5,504.5,609.1,480.6
+	L609.1,480.6z"/>
+<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="577.0148" y1="664.5671" x2="250.6247" y2="141.0071" gradientTransform="matrix(1 0 0 -1 0 800)">
+	<stop  offset="0.16" style="stop-color:#C6F462"/>
+	<stop  offset="0.89" style="stop-color:#33D9FF"/>
+</linearGradient>
+<path class="st3" d="M105,488.6c7.3,16.2,12.1,34.5,23,47.6c5.5,6.7,22.2,4.1,33.8,5.7c1.8,0.2,3.6,0.5,5.4,0.7
+	c102.9,15.3,184.1,65.1,242.1,152c3.4,5.1,8.9,12.7,13.4,12.7c17.4-0.1,34.9-2.8,52.5-4.5C449,557.5,232.8,438.3,105,488.6
+	L105,488.6z"/>
+<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="569.0272" y1="669.5518" x2="242.6272" y2="145.9917" gradientTransform="matrix(1 0 0 -1 0 800)">
+	<stop  offset="0.16" style="stop-color:#C6F462"/>
+	<stop  offset="0.89" style="stop-color:#33D9FF"/>
+</linearGradient>
+<path class="st4" d="M656.6,366.7C599.9,287.4,521.7,234.6,432.9,197c-61.5-26.1-125.2-41.8-192.8-33.7
+	c-23.4,2.8-45.3,9.5-63.4,24.7c230.9,5.8,404.6,105.8,524,303.3c0.2-13.1,2.2-27.7-2.6-39.5C686.1,422.5,674.7,392,656.6,366.7z"/>
+<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="571.6973" y1="667.8917" x2="245.2973" y2="144.3317" gradientTransform="matrix(1 0 0 -1 0 800)">
+	<stop  offset="0.16" style="stop-color:#C6F462"/>
+	<stop  offset="0.89" style="stop-color:#33D9FF"/>
+</linearGradient>
+<path class="st5" d="M709.8,325.3c-47-178.9-238-265-379.2-221.4C482.7,133.9,607.5,206.4,709.8,325.3z"/>
+<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="579.0382" y1="663.3111" x2="252.6482" y2="139.7511" gradientTransform="matrix(1 0 0 -1 0 800)">
+	<stop  offset="0.16" style="stop-color:#C6F462"/>
+	<stop  offset="0.89" style="stop-color:#33D9FF"/>
+</linearGradient>
+<path class="st6" d="M155.4,583.9c54.6,69.3,124,109.7,213,122.8C334.4,643.2,214.6,574.5,155.4,583.9L155.4,583.9z"/>
+</svg>
diff --git a/src/assets/icons/jupiter_logo_banner_dark.svg b/src/assets/icons/jupiter_logo_banner_dark.svg
new file mode 100644
index 000000000..3d3e23b14
--- /dev/null
+++ b/src/assets/icons/jupiter_logo_banner_dark.svg
@@ -0,0 +1,35 @@
+<svg width="104" height="32" viewBox="0 0 104 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.09074 25.1666C4.44267 27.0471 6.17683 28.6205 8.1795 29.7838C10.1822 30.947 12.4081 31.6738 14.7114 31.9165C13.5264 30.1333 11.8039 28.4928 9.65354 27.2438C7.50318 25.9948 5.22591 25.3125 3.09074 25.1666Z" fill="url(#paint0_linear_13278_146906)"/>
+<path d="M12.543 22.2705C8.40015 19.8636 3.91612 19.2502 0.707662 20.3338C1.0174 21.3575 1.42589 22.3487 1.92738 23.2934C4.71498 23.2288 7.75856 23.9859 10.5906 25.6308C13.4227 27.2757 15.5888 29.5459 16.9143 32C17.9839 31.9672 19.0479 31.8309 20.0913 31.5932C19.4426 28.2698 16.6849 24.6779 12.543 22.2705Z" fill="url(#paint1_linear_13278_146906)"/>
+<path d="M32.2852 12.5009C31.7585 10.3584 30.8054 8.34403 29.4829 6.57804C28.1604 4.81205 26.4956 3.33067 24.5879 2.22235C22.6802 1.11403 20.5687 0.401504 18.3796 0.12731C16.1904 -0.146884 13.9684 0.02288 11.8463 0.626466C15.3915 1.06033 19.3267 2.39122 23.1859 4.63324C27.0452 6.87525 30.1533 9.63411 32.2852 12.5009Z" fill="url(#paint2_linear_13278_146906)"/>
+<path d="M27.1271 20.3583C25.3124 17.3446 22.2038 14.4588 18.3743 12.2342C14.5449 10.0095 10.4991 8.7388 6.98531 8.65474C3.894 8.58152 1.57389 9.48017 0.621548 11.1197C0.616124 11.1294 0.608531 11.1386 0.602566 11.1484C0.516877 11.4559 0.443119 11.7639 0.37587 12.0731C1.70568 11.5481 3.24645 11.2558 4.95969 11.2232C8.76959 11.1517 13.0334 12.3703 16.9681 14.6562C20.9027 16.9422 24.0759 20.0438 25.9003 23.3878C26.7182 24.8944 27.2285 26.3777 27.4308 27.7948C27.6662 27.5844 27.8972 27.3669 28.1212 27.1408C28.1272 27.1305 28.131 27.1196 28.1369 27.1088C29.0893 25.4677 28.721 23.0076 27.1271 20.3583Z" fill="url(#paint3_linear_13278_146906)"/>
+<path d="M15.4609 17.2485C9.59662 13.8416 3.11626 13.3079 -5.33621e-07 15.6855C0.00612042 16.4297 0.0630161 17.1726 0.170292 17.9091C1.08699 17.6312 2.03177 17.4562 2.98718 17.3874C6.46951 17.1254 10.3087 18.0957 13.7927 20.1207C17.2766 22.1458 20.023 25.0018 21.5209 28.1543C21.935 29.018 22.2508 29.9254 22.4624 30.8595C23.1555 30.5878 23.8294 30.2694 24.4794 29.9066C25.0011 26.0213 21.3268 20.656 15.4609 17.2485Z" fill="url(#paint4_linear_13278_146906)"/>
+<path d="M30.1434 15.3141C28.3082 12.3036 25.1724 9.40969 21.3158 7.17039C17.4593 4.93109 13.3977 3.64033 9.87257 3.53674C7.1853 3.45919 5.10382 4.11053 4.02457 5.34109C8.50588 4.58182 14.4168 5.85794 20.146 9.18625C25.8753 12.5146 29.9135 17.0181 31.4722 21.2868C32.0064 19.7406 31.5416 17.6098 30.1434 15.3141Z" fill="url(#paint5_linear_13278_146906)"/>
+<path d="M46.6645 9.90909L49.4003 9.90909L49.4003 19.0369C49.4003 19.8807 49.2107 20.6136 48.8314 21.2358C48.4564 21.858 47.9344 22.3374 47.2654 22.674C46.5963 23.0107 45.8186 23.179 44.9323 23.179C44.1439 23.179 43.428 23.0405 42.7845 22.7635C42.1453 22.4822 41.6382 22.0561 41.2632 21.4851C40.8882 20.9098 40.7029 20.1875 40.7071 19.3182L43.4621 19.3182C43.4706 19.6634 43.5409 19.9595 43.673 20.2067C43.8094 20.4496 43.9948 20.6371 44.2291 20.7692C44.4678 20.897 44.749 20.9609 45.0729 20.9609C45.4138 20.9609 45.7014 20.8885 45.9358 20.7436C46.1745 20.5945 46.3556 20.3771 46.4791 20.0916C46.6027 19.8061 46.6645 19.4545 46.6645 19.0369L46.6645 9.90909ZM57.9337 18.8196L57.9337 13.1818L60.6567 13.1818L60.6567 23L58.0423 23L58.0423 21.2166L57.9401 21.2166C57.7185 21.7919 57.3499 22.2543 56.8343 22.6037C56.3229 22.9531 55.6986 23.1278 54.9614 23.1278C54.3051 23.1278 53.7277 22.9787 53.2291 22.6804C52.7306 22.3821 52.3406 21.9581 52.0594 21.4084C51.7824 20.8587 51.6418 20.2003 51.6375 19.4332L51.6375 13.1818L54.3605 13.1818L54.3605 18.9474C54.3648 19.527 54.5203 19.9851 54.8272 20.3217C55.134 20.6584 55.5452 20.8267 56.0608 20.8267C56.3889 20.8267 56.6958 20.7521 56.9813 20.603C57.2668 20.4496 57.4969 20.2237 57.6716 19.9254C57.8506 19.6271 57.9379 19.2585 57.9337 18.8196ZM62.8348 26.6818L62.8348 13.1818L65.5194 13.1818L65.5194 14.831L65.6409 14.831C65.7602 14.5668 65.9328 14.2983 66.1586 14.0256C66.3888 13.7486 66.6871 13.5185 67.0535 13.3352C67.4243 13.1477 67.8845 13.054 68.4342 13.054C69.1501 13.054 69.8106 13.2415 70.4158 13.6165C71.0209 13.9872 71.5045 14.5476 71.8667 15.2976C72.229 16.0433 72.4101 16.9787 72.4101 18.1037C72.4101 19.1989 72.2332 20.1236 71.8795 20.8778C71.5301 21.6278 71.0528 22.1967 70.4477 22.5845C69.8469 22.968 69.1736 23.1598 68.4278 23.1598C67.8994 23.1598 67.4498 23.0724 67.0791 22.8977C66.7126 22.723 66.4122 22.5036 66.1778 22.2393C65.9435 21.9709 65.7645 21.7003 65.6409 21.4276L65.5578 21.4276L65.5578 26.6818L62.8348 26.6818ZM65.5003 18.0909C65.5003 18.6747 65.5812 19.1839 65.7432 19.6186C65.9051 20.0533 66.1395 20.392 66.4463 20.6349C66.7531 20.8736 67.126 20.9929 67.5649 20.9929C68.0081 20.9929 68.3831 20.8714 68.6899 20.6286C68.9967 20.3814 69.229 20.0405 69.3866 19.6058C69.5486 19.1669 69.6295 18.6619 69.6295 18.0909C69.6295 17.5241 69.5507 17.0256 69.393 16.5952C69.2354 16.1648 69.0031 15.8281 68.6963 15.5852C68.3895 15.3423 68.0123 15.2209 67.5649 15.2209C67.1217 15.2209 66.7467 15.3381 66.4399 15.5724C66.1373 15.8068 65.9051 16.1392 65.7432 16.5696C65.5812 17 65.5003 17.5071 65.5003 18.0909ZM74.2254 23L74.2254 13.1818L76.9484 13.1818L76.9484 23L74.2254 23ZM75.5933 11.9162C75.1885 11.9162 74.8412 11.782 74.5514 11.5135C74.2659 11.2408 74.1231 10.9148 74.1231 10.5355C74.1231 10.1605 74.2659 9.83878 74.5514 9.57031C74.8412 9.29759 75.1885 9.16122 75.5933 9.16122C75.9981 9.16122 76.3433 9.29759 76.6288 9.57031C76.9186 9.83878 77.0635 10.1605 77.0635 10.5355C77.0635 10.9148 76.9186 11.2408 76.6288 11.5135C76.3433 11.782 75.9981 11.9162 75.5933 11.9162ZM84.352 13.1818L84.352 15.2273L78.4394 15.2273L78.4394 13.1818L84.352 13.1818ZM79.7817 10.8295L82.5047 10.8295L82.5047 19.983C82.5047 20.2344 82.5431 20.4304 82.6198 20.571C82.6965 20.7074 82.803 20.8033 82.9394 20.8587C83.08 20.9141 83.2419 20.9418 83.4252 20.9418C83.553 20.9418 83.6808 20.9311 83.8087 20.9098C83.9365 20.8842 84.0345 20.8651 84.1027 20.8523L84.531 22.8786C84.3946 22.9212 84.2029 22.9702 83.9557 23.0256C83.7085 23.0852 83.4081 23.1215 83.0544 23.1342C82.3982 23.1598 81.8229 23.0724 81.3286 22.8722C80.8385 22.6719 80.4571 22.3608 80.1844 21.9389C79.9117 21.517 79.7774 20.9844 79.7817 20.3409L79.7817 10.8295ZM90.4948 23.1918C89.4848 23.1918 88.6155 22.9872 87.8868 22.5781C87.1624 22.1648 86.6041 21.581 86.2121 20.8267C85.82 20.0682 85.624 19.1712 85.624 18.1357C85.624 17.1257 85.82 16.2393 86.2121 15.4766C86.6041 14.7138 87.156 14.1193 87.8676 13.6932C88.5835 13.267 89.423 13.054 90.3861 13.054C91.0338 13.054 91.6368 13.1584 92.195 13.3672C92.7575 13.5717 93.2476 13.8807 93.6652 14.294C94.0871 14.7074 94.4152 15.2273 94.6496 15.8537C94.884 16.4759 95.0012 17.2045 95.0012 18.0398L95.0012 18.7876L86.7107 18.7876L86.7107 17.1001L92.4379 17.1001C92.4379 16.7081 92.3527 16.3608 92.1823 16.0582C92.0118 15.7557 91.7753 15.5192 91.4727 15.3487C91.1745 15.174 90.8272 15.0866 90.4308 15.0866C90.0175 15.0866 89.651 15.1825 89.3314 15.3743C89.0161 15.5618 88.7689 15.8153 88.5899 16.1349C88.411 16.4503 88.3193 16.8018 88.3151 17.1896L88.3151 18.794C88.3151 19.2798 88.4046 19.6996 88.5835 20.0533C88.7668 20.407 89.0246 20.6797 89.357 20.8715C89.6894 21.0632 90.0835 21.1591 90.5395 21.1591C90.8421 21.1591 91.1191 21.1165 91.3705 21.0313C91.6219 20.946 91.8371 20.8182 92.0161 20.6477C92.195 20.4773 92.3314 20.2685 92.4252 20.0213L94.9436 20.1875C94.8158 20.7926 94.5537 21.321 94.1574 21.7727C93.7654 22.2202 93.2583 22.5696 92.6361 22.821C92.0182 23.0682 91.3044 23.1918 90.4948 23.1918ZM96.7781 23L96.7781 13.1818L99.4181 13.1818L99.4181 14.8949L99.5203 14.8949C99.6993 14.2855 99.9997 13.8253 100.422 13.5142C100.843 13.1989 101.329 13.0412 101.879 13.0412C102.015 13.0412 102.162 13.0497 102.32 13.0668C102.478 13.0838 102.616 13.1072 102.736 13.1371L102.736 15.5533C102.608 15.5149 102.431 15.4808 102.205 15.451C101.979 15.4212 101.772 15.4063 101.585 15.4063C101.184 15.4063 100.826 15.4936 100.511 15.6683C100.2 15.8388 99.9529 16.0774 99.7696 16.3842C99.5906 16.6911 99.5012 17.0447 99.5012 17.4453L99.5012 23L96.7781 23Z" fill="white"/>
+<defs>
+<linearGradient id="paint0_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint1_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint3_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+<linearGradient id="paint5_linear_13278_146906" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#C7F284"/>
+<stop offset="1" stop-color="#00BEF0"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/assets/icons/jupiter_logo_banner_light.svg b/src/assets/icons/jupiter_logo_banner_light.svg
new file mode 100644
index 000000000..4744e0bcb
--- /dev/null
+++ b/src/assets/icons/jupiter_logo_banner_light.svg
@@ -0,0 +1,35 @@
+<svg width="104" height="32" viewBox="0 0 104 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.09074 25.1666C4.44267 27.0471 6.17683 28.6205 8.1795 29.7838C10.1822 30.947 12.4081 31.6738 14.7114 31.9165C13.5264 30.1333 11.8039 28.4928 9.65354 27.2438C7.50318 25.9948 5.22591 25.3125 3.09074 25.1666Z" fill="url(#paint0_linear_13278_146916)"/>
+<path d="M12.543 22.2705C8.40015 19.8636 3.91612 19.2502 0.707662 20.3338C1.0174 21.3575 1.42589 22.3487 1.92738 23.2934C4.71498 23.2288 7.75856 23.9859 10.5906 25.6308C13.4227 27.2757 15.5888 29.5459 16.9143 32C17.9839 31.9672 19.0479 31.8309 20.0913 31.5932C19.4426 28.2698 16.6849 24.6779 12.543 22.2705Z" fill="url(#paint1_linear_13278_146916)"/>
+<path d="M32.2852 12.5009C31.7585 10.3584 30.8054 8.34403 29.4829 6.57804C28.1604 4.81205 26.4956 3.33067 24.5879 2.22235C22.6802 1.11403 20.5687 0.401504 18.3796 0.12731C16.1904 -0.146884 13.9684 0.02288 11.8463 0.626466C15.3915 1.06033 19.3267 2.39122 23.1859 4.63324C27.0452 6.87525 30.1533 9.63411 32.2852 12.5009Z" fill="url(#paint2_linear_13278_146916)"/>
+<path d="M27.1271 20.3583C25.3124 17.3446 22.2038 14.4588 18.3743 12.2342C14.5449 10.0095 10.4991 8.7388 6.98531 8.65474C3.894 8.58152 1.57389 9.48017 0.621548 11.1197C0.616124 11.1294 0.608531 11.1386 0.602566 11.1484C0.516877 11.4559 0.443119 11.7639 0.37587 12.0731C1.70568 11.5481 3.24645 11.2558 4.95969 11.2232C8.76959 11.1517 13.0334 12.3703 16.9681 14.6562C20.9027 16.9422 24.0759 20.0438 25.9003 23.3878C26.7182 24.8944 27.2285 26.3777 27.4308 27.7948C27.6662 27.5844 27.8972 27.3669 28.1212 27.1408C28.1272 27.1305 28.131 27.1196 28.1369 27.1088C29.0893 25.4677 28.721 23.0076 27.1271 20.3583Z" fill="url(#paint3_linear_13278_146916)"/>
+<path d="M15.4609 17.2485C9.59662 13.8416 3.11626 13.3079 -5.33621e-07 15.6855C0.00612042 16.4297 0.0630161 17.1726 0.170292 17.9091C1.08699 17.6312 2.03177 17.4562 2.98718 17.3874C6.46951 17.1254 10.3087 18.0957 13.7927 20.1207C17.2766 22.1458 20.023 25.0018 21.5209 28.1543C21.935 29.018 22.2508 29.9254 22.4624 30.8595C23.1555 30.5878 23.8294 30.2694 24.4794 29.9066C25.0011 26.0213 21.3268 20.656 15.4609 17.2485Z" fill="url(#paint4_linear_13278_146916)"/>
+<path d="M30.1434 15.3141C28.3082 12.3036 25.1724 9.40969 21.3158 7.17039C17.4593 4.93109 13.3977 3.64033 9.87257 3.53674C7.1853 3.45919 5.10382 4.11053 4.02457 5.34109C8.50588 4.58182 14.4168 5.85794 20.146 9.18625C25.8753 12.5146 29.9135 17.0181 31.4722 21.2868C32.0064 19.7406 31.5416 17.6098 30.1434 15.3141Z" fill="url(#paint5_linear_13278_146916)"/>
+<path d="M46.6645 9.90909L49.4003 9.90909L49.4003 19.0369C49.4003 19.8807 49.2106 20.6136 48.8314 21.2358C48.4564 21.858 47.9344 22.3374 47.2653 22.674C46.5963 23.0107 45.8186 23.179 44.9322 23.179C44.1439 23.179 43.428 23.0405 42.7845 22.7635C42.1453 22.4822 41.6382 22.0561 41.2632 21.4851C40.8882 20.9098 40.7028 20.1875 40.7071 19.3182L43.4621 19.3182C43.4706 19.6634 43.5409 19.9595 43.673 20.2067C43.8094 20.4496 43.9947 20.6371 44.2291 20.7692C44.4677 20.897 44.749 20.9609 45.0729 20.9609C45.4138 20.9609 45.7014 20.8885 45.9358 20.7436C46.1744 20.5945 46.3555 20.3771 46.4791 20.0916C46.6027 19.8061 46.6645 19.4545 46.6645 19.0369L46.6645 9.90909ZM57.9337 18.8196L57.9337 13.1818L60.6567 13.1818L60.6567 23L58.0423 23L58.0423 21.2166L57.94 21.2166C57.7185 21.7919 57.3498 22.2543 56.8342 22.6037C56.3229 22.9531 55.6986 23.1278 54.9614 23.1278C54.3051 23.1278 53.7277 22.9787 53.2291 22.6804C52.7305 22.3821 52.3406 21.9581 52.0594 21.4084C51.7824 20.8587 51.6418 20.2003 51.6375 19.4332L51.6375 13.1818L54.3605 13.1818L54.3605 18.9474C54.3648 19.527 54.5203 19.9851 54.8271 20.3217C55.1339 20.6584 55.5452 20.8267 56.0608 20.8267C56.3889 20.8267 56.6957 20.7521 56.9812 20.603C57.2668 20.4496 57.4969 20.2237 57.6716 19.9254C57.8506 19.6271 57.9379 19.2585 57.9337 18.8196ZM62.8348 26.6818L62.8348 13.1818L65.5194 13.1818L65.5194 14.831L65.6409 14.831C65.7602 14.5668 65.9328 14.2983 66.1586 14.0256C66.3887 13.7486 66.687 13.5185 67.0535 13.3352C67.4242 13.1477 67.8845 13.054 68.4342 13.054C69.1501 13.054 69.8106 13.2415 70.4157 13.6165C71.0208 13.9872 71.5045 14.5476 71.8667 15.2976C72.2289 16.0433 72.41 16.9787 72.41 18.1037C72.41 19.1989 72.2332 20.1236 71.8795 20.8778C71.5301 21.6278 71.0528 22.1967 70.4477 22.5845C69.8468 22.968 69.1735 23.1598 68.4278 23.1598C67.8994 23.1598 67.4498 23.0724 67.0791 22.8977C66.7126 22.723 66.4122 22.5036 66.1778 22.2393C65.9434 21.9709 65.7644 21.7003 65.6409 21.4276L65.5578 21.4276L65.5578 26.6818L62.8348 26.6818ZM65.5002 18.0909C65.5002 18.6747 65.5812 19.1839 65.7431 19.6186C65.9051 20.0533 66.1394 20.392 66.4463 20.6349C66.7531 20.8736 67.1259 20.9929 67.5649 20.9929C68.0081 20.9929 68.3831 20.8714 68.6899 20.6286C68.9967 20.3814 69.2289 20.0405 69.3866 19.6058C69.5485 19.1669 69.6295 18.6619 69.6295 18.0909C69.6295 17.5241 69.5507 17.0256 69.393 16.5952C69.2353 16.1648 69.0031 15.8281 68.6963 15.5852C68.3894 15.3423 68.0123 15.2209 67.5649 15.2209C67.1217 15.2209 66.7467 15.3381 66.4399 15.5724C66.1373 15.8068 65.9051 16.1392 65.7431 16.5696C65.5812 17 65.5002 17.5071 65.5002 18.0909ZM74.2254 23L74.2254 13.1818L76.9484 13.1818L76.9484 23L74.2254 23ZM75.5933 11.9162C75.1884 11.9162 74.8411 11.782 74.5514 11.5135C74.2659 11.2408 74.1231 10.9148 74.1231 10.5355C74.1231 10.1605 74.2659 9.83878 74.5514 9.57031C74.8411 9.29759 75.1884 9.16122 75.5933 9.16122C75.9981 9.16122 76.3433 9.29759 76.6288 9.57031C76.9186 9.83878 77.0634 10.1605 77.0634 10.5355C77.0634 10.9148 76.9186 11.2408 76.6288 11.5135C76.3433 11.782 75.9981 11.9162 75.5933 11.9162ZM84.352 13.1818L84.352 15.2273L78.4393 15.2273L78.4393 13.1818L84.352 13.1818ZM79.7817 10.8295L82.5047 10.8295L82.5047 19.983C82.5047 20.2344 82.543 20.4304 82.6197 20.571C82.6964 20.7074 82.803 20.8033 82.9393 20.8587C83.08 20.9141 83.2419 20.9418 83.4251 20.9418C83.553 20.9418 83.6808 20.9311 83.8087 20.9098C83.9365 20.8842 84.0345 20.8651 84.1027 20.8523L84.531 22.8786C84.3946 22.9212 84.2028 22.9702 83.9557 23.0256C83.7085 23.0852 83.4081 23.1215 83.0544 23.1342C82.3981 23.1598 81.8229 23.0724 81.3285 22.8722C80.8385 22.6719 80.4571 22.3608 80.1844 21.9389C79.9116 21.517 79.7774 20.9844 79.7817 20.3409L79.7817 10.8295ZM90.4947 23.1918C89.4848 23.1918 88.6155 22.9872 87.8868 22.5781C87.1623 22.1648 86.6041 21.581 86.2121 20.8267C85.82 20.0682 85.624 19.1712 85.624 18.1357C85.624 17.1257 85.82 16.2393 86.2121 15.4766C86.6041 14.7138 87.156 14.1193 87.8676 13.6932C88.5835 13.267 89.423 13.054 90.3861 13.054C91.0338 13.054 91.6368 13.1584 92.195 13.3672C92.7575 13.5717 93.2476 13.8807 93.6652 14.294C94.0871 14.7074 94.4152 15.2273 94.6496 15.8537C94.8839 16.4759 95.0011 17.2045 95.0011 18.0398L95.0011 18.7876L86.7106 18.7876L86.7106 17.1001L92.4379 17.1001C92.4379 16.7081 92.3527 16.3608 92.1822 16.0582C92.0118 15.7557 91.7753 15.5192 91.4727 15.3487C91.1744 15.174 90.8271 15.0866 90.4308 15.0866C90.0175 15.0866 89.651 15.1825 89.3314 15.3743C89.016 15.5618 88.7689 15.8153 88.5899 16.1349C88.4109 16.4503 88.3193 16.8018 88.315 17.1896L88.315 18.794C88.315 19.2798 88.4045 19.6996 88.5835 20.0533C88.7668 20.407 89.0246 20.6797 89.3569 20.8715C89.6893 21.0632 90.0835 21.1591 90.5395 21.1591C90.842 21.1591 91.119 21.1165 91.3704 21.0313C91.6219 20.946 91.8371 20.8182 92.016 20.6477C92.195 20.4773 92.3314 20.2685 92.4251 20.0213L94.9436 20.1875C94.8158 20.7926 94.5537 21.321 94.1574 21.7727C93.7653 22.2202 93.2582 22.5696 92.6361 22.821C92.0182 23.0682 91.3044 23.1918 90.4947 23.1918ZM96.7781 23L96.7781 13.1818L99.418 13.1818L99.418 14.8949L99.5203 14.8949C99.6993 14.2855 99.9997 13.8253 100.422 13.5142C100.843 13.1989 101.329 13.0412 101.879 13.0412C102.015 13.0412 102.162 13.0497 102.32 13.0668C102.478 13.0838 102.616 13.1072 102.736 13.1371L102.736 15.5533C102.608 15.5149 102.431 15.4808 102.205 15.451C101.979 15.4212 101.772 15.4063 101.585 15.4063C101.184 15.4063 100.826 15.4936 100.511 15.6683C100.2 15.8388 99.9528 16.0774 99.7696 16.3842C99.5906 16.6911 99.5011 17.0447 99.5011 17.4453L99.5011 23L96.7781 23Z" fill="#111726"/>
+<defs>
+<linearGradient id="paint0_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint1_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint2_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint3_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint4_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+<linearGradient id="paint5_linear_13278_146916" x1="21.5" y1="6.5" x2="6.66667" y2="32" gradientUnits="userSpaceOnUse">
+<stop offset="0.0001" stop-color="#A4D756"/>
+<stop offset="1" stop-color="#00B6E7"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/src/assets/icons/solana_logo_banner.svg b/src/assets/icons/solana_logo_banner.svg
new file mode 100644
index 000000000..08ec87cb1
--- /dev/null
+++ b/src/assets/icons/solana_logo_banner.svg
@@ -0,0 +1,24 @@
+<svg width="646" height="96" viewBox="0 0 646 96" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1064_606)">
+<path d="M108.53 75.6899L90.81 94.6899C90.4267 95.1026 89.9626 95.432 89.4464 95.6573C88.9303 95.8827 88.3732 95.9994 87.81 95.9999H3.81C3.40937 95.9997 3.01749 95.8827 2.68235 95.6631C2.34722 95.4436 2.08338 95.1311 1.92313 94.7639C1.76288 94.3967 1.71318 93.9908 1.78012 93.5958C1.84706 93.2008 2.02772 92.8338 2.3 92.5399L20 73.5399C20.3833 73.1273 20.8474 72.7979 21.3636 72.5725C21.8797 72.3472 22.4368 72.2305 23 72.2299H107C107.404 72.2216 107.802 72.333 108.143 72.5502C108.484 72.7674 108.754 73.0806 108.917 73.4504C109.081 73.8203 109.131 74.2303 109.062 74.6288C108.993 75.0273 108.808 75.3965 108.53 75.6899ZM90.81 37.4199C90.4253 37.0091 89.9608 36.6811 89.445 36.4558C88.9292 36.2306 88.3728 36.1129 87.81 36.11H3.81C3.40937 36.1102 3.01749 36.2272 2.68235 36.4468C2.34722 36.6663 2.08338 36.9788 1.92313 37.346C1.76288 37.7132 1.71318 38.1191 1.78012 38.5141C1.84706 38.9091 2.02772 39.2761 2.3 39.57L20 58.58C20.3847 58.9908 20.8492 59.3188 21.365 59.5441C21.8808 59.7693 22.4372 59.887 23 59.8899H107C107.4 59.8878 107.79 59.7693 108.124 59.5491C108.458 59.3288 108.72 59.0162 108.879 58.6494C109.038 58.2826 109.087 57.8774 109.019 57.4833C108.952 57.0892 108.772 56.7232 108.5 56.43L90.81 37.4199ZM3.81 23.7699H87.81C88.3732 23.7694 88.9303 23.6527 89.4464 23.4273C89.9626 23.202 90.4267 22.8726 90.81 22.4599L108.53 3.45995C108.808 3.16647 108.993 2.79726 109.062 2.39877C109.131 2.00028 109.081 1.59031 108.917 1.22045C108.754 0.850591 108.484 0.537368 108.143 0.320195C107.802 0.103021 107.404 -0.0084012 107 -5.10783e-05H23C22.4368 0.000541762 21.8797 0.117167 21.3636 0.342553C20.8474 0.567938 20.3833 0.897249 20 1.30995L2.3 20.3099C2.02772 20.6038 1.84706 20.9708 1.78012 21.3658C1.71318 21.7608 1.76288 22.1667 1.92313 22.5339C2.08338 22.9011 2.34722 23.2136 2.68235 23.4331C3.01749 23.6527 3.40937 23.7697 3.81 23.7699Z" fill="url(#paint0_linear_1064_606)"/>
+<path d="M210.94 40.6002H166V25.8002H222.62V11.0002H165.85C163.91 10.9897 161.988 11.3613 160.192 12.0938C158.396 12.8264 156.761 13.9055 155.383 15.2696C154.004 16.6337 152.907 18.2561 152.155 20.044C151.403 21.832 151.01 23.7506 151 25.6902V40.6902C151.008 42.6315 151.398 44.5523 152.149 46.3425C152.9 48.1328 153.996 49.7575 155.375 51.1237C156.755 52.49 158.39 53.5709 160.187 54.3047C161.984 55.0385 163.909 55.4108 165.85 55.4002H210.85V70.2002H152.07V85.0002H210.94C212.88 85.0108 214.802 84.6391 216.598 83.9066C218.394 83.174 220.029 82.0949 221.407 80.7308C222.786 79.3667 223.883 77.7444 224.635 75.9564C225.387 74.1684 225.78 72.2498 225.79 70.3102V55.3102C225.782 53.3689 225.392 51.4482 224.641 49.6579C223.89 47.8676 222.794 46.2429 221.415 44.8767C220.035 43.5105 218.4 42.4296 216.603 41.6958C214.806 40.962 212.881 40.5897 210.94 40.6002Z" fill="white"/>
+<path d="M298 11H252.89C250.947 10.9842 249.02 11.3519 247.219 12.0821C245.419 12.8123 243.78 13.8905 242.397 15.2552C241.013 16.6198 239.913 18.2439 239.159 20.0345C238.404 21.8251 238.01 23.747 238 25.69V70.31C238.01 72.253 238.404 74.1749 239.159 75.9655C239.913 77.7561 241.013 79.3802 242.397 80.7448C243.78 82.1095 245.419 83.1877 247.219 83.9179C249.02 84.6481 250.947 85.0158 252.89 85H298C299.94 85.0105 301.862 84.6389 303.658 83.9064C305.454 83.1738 307.089 82.0947 308.467 80.7306C309.846 79.3665 310.943 77.7441 311.695 75.9562C312.447 74.1682 312.84 72.2496 312.85 70.31V25.69C312.84 23.7504 312.447 21.8318 311.695 20.0438C310.943 18.2559 309.846 16.6335 308.467 15.2694C307.089 13.9053 305.454 12.8262 303.658 12.0936C301.862 11.3611 299.94 10.9895 298 11ZM297.89 70.2H253V25.8H297.87L297.89 70.2Z" fill="white"/>
+<path d="M456 11.0001H412C410.06 10.9896 408.138 11.3612 406.342 12.0937C404.546 12.8263 402.911 13.9054 401.533 15.2695C400.154 16.6336 399.057 18.256 398.305 20.0439C397.553 21.8319 397.16 23.7505 397.15 25.6901V85.0001H412.15V60.6901H455.95V85.0001H470.95V25.6901C470.94 23.742 470.544 21.8152 469.786 20.0206C469.027 18.2261 467.922 16.5993 466.532 15.2338C465.143 13.8684 463.497 12.7914 461.689 12.0648C459.881 11.3382 457.948 10.9764 456 11.0001ZM455.89 45.8901H412.09V25.8001H455.89V45.8901Z" fill="white"/>
+<path d="M631.15 11.0002H587.15C585.21 10.9897 583.288 11.3613 581.492 12.0938C579.696 12.8264 578.062 13.9055 576.683 15.2696C575.304 16.6337 574.207 18.2561 573.455 20.044C572.703 21.832 572.31 23.7506 572.3 25.6902V85.0002H587.3V60.6902H631V85.0002H646V25.6902C645.99 23.7506 645.597 21.832 644.845 20.044C644.093 18.2561 642.996 16.6337 641.617 15.2696C640.238 13.9055 638.604 12.8264 636.808 12.0938C635.012 11.3613 633.09 10.9897 631.15 11.0002ZM631 45.8902H587.2V25.8002H631V45.8902Z" fill="white"/>
+<path d="M544 70.2001H538L516.55 17.2001C515.815 15.3716 514.55 13.8045 512.918 12.6999C511.286 11.5952 509.361 11.0033 507.39 11.0001H494.08C492.786 10.9935 491.504 11.2418 490.307 11.7307C489.109 12.2197 488.02 12.9397 487.1 13.8497C486.181 14.7598 485.45 15.8419 484.949 17.0345C484.448 18.227 484.187 19.5066 484.18 20.8001V85.0001H499.18V25.8001H505.18L526.62 78.8001C527.367 80.6251 528.642 82.1858 530.281 83.283C531.919 84.3803 533.848 84.9641 535.82 84.9601H549.13C550.424 84.9667 551.706 84.7185 552.903 84.2295C554.101 83.7406 555.19 83.0205 556.11 82.1105C557.029 81.2005 557.76 80.1183 558.261 78.9258C558.762 77.7332 559.023 76.4537 559.03 75.1601V11.0001H544V70.2001Z" fill="white"/>
+<path d="M341.1 11H326.1V70.31C326.11 72.2539 326.505 74.1766 327.26 75.9678C328.015 77.7591 329.116 79.3836 330.5 80.7484C331.884 82.1132 333.525 83.1912 335.326 83.9208C337.128 84.6504 339.056 85.0171 341 85H386V70.2H341.1V11Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_1064_606" x1="10.81" y1="98.29" x2="98.89" y2="-1.01005" gradientUnits="userSpaceOnUse">
+<stop offset="0.08" stop-color="#9945FF"/>
+<stop offset="0.3" stop-color="#8752F3"/>
+<stop offset="0.5" stop-color="#5497D5"/>
+<stop offset="0.6" stop-color="#43B4CA"/>
+<stop offset="0.72" stop-color="#28E0B9"/>
+<stop offset="0.97" stop-color="#19FB9B"/>
+</linearGradient>
+<clipPath id="clip0_1064_606">
+<rect width="646" height="96" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icons/spedometer-icon.svg b/src/assets/icons/spedometer-icon.svg
new file mode 100644
index 000000000..19b13f44e
--- /dev/null
+++ b/src/assets/icons/spedometer-icon.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12M22 12C22 6.47715 17.5228 2 12 2M22 12H19.5M2 12C2 6.47715 6.47715 2 12 2M2 12H4.5M12 2V4.5M19.0784 5L13.4999 10.5M19.0784 19.0784L18.8745 18.8745C18.1827 18.1827 17.8368 17.8368 17.4331 17.5894C17.0753 17.3701 16.6851 17.2085 16.2769 17.1105C15.8166 17 15.3274 17 14.349 17L9.65096 17C8.6726 17 8.18342 17 7.72307 17.1106C7.31493 17.2086 6.92475 17.3702 6.56686 17.5895C6.1632 17.8369 5.8173 18.1828 5.12549 18.8746L4.92163 19.0784M4.92163 5L6.65808 6.73645M14 12C14 13.1046 13.1046 14 12 14C10.8954 14 10 13.1046 10 12C10 10.8954 10.8954 10 12 10C13.1046 10 14 10.8954 14 12Z" stroke="black" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/locales/gb.json b/src/locales/gb.json
index b2fb2a41a..0c760b340 100644
--- a/src/locales/gb.json
+++ b/src/locales/gb.json
@@ -60,5 +60,9 @@
   "monitorStatusDown": "Monitor {name} ({url}) is DOWN and not responding",
   "webhookSendSuccess": "Webhook notification sent successfully",
   "webhookSendError": "Error sending webhook notification to {platform}",
-  "webhookUnsupportedPlatform": "Unsupported platform: {platform}"
+  "webhookUnsupportedPlatform": "Unsupported platform: {platform}",
+  "distributedStatusHeaderText": "Real-time, real-device coverage",
+  "distributedStatusSubHeaderText": "Powered by millions devices worldwide, view a system performance by global region, country or city",
+  "distributedRightCatagoryTitle" : "Monitor",
+  "distributedRightCatagoryDescription" : "Mainnet Beta Cluster"
 }
\ No newline at end of file
diff --git a/src/locales/tr.json b/src/locales/tr.json
index 1b42f634b..830d2b4d6 100644
--- a/src/locales/tr.json
+++ b/src/locales/tr.json
@@ -55,5 +55,9 @@
   "authRegisterCreateAccount": "Hesap oluşturmak için devam et",
   "authRegisterCreateSuperAdminAccount": "Super admin hesabınızı oluşturmak için devam edin",
   "authRegisterSignUpWithEmail": "E-posta ile kayıt ol",
-  "authRegisterBySigningUp": "Kayıt olarak, aşağıdaki şartları kabul ediyorsunuz:"
+  "authRegisterBySigningUp": "Kayıt olarak, aşağıdaki şartları kabul ediyorsunuz:",
+  "distributedStatusHeaderText": "Gerçek zamanlı, Gerçek cihazlar kapsamı",
+  "distributedStatusSubHeaderText": "Dünya çapında milyonlarca cihaz tarafından desteklenen sistem performansını küresel bölgeye, ülkeye veya şehre göre görüntüleyin",
+  "distributedRightCatagoryTitle" : "Monitör",
+  "distributedRightCatagoryDescription" : "Mainnet Beta Kümesi"
 }
\ No newline at end of file