diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx
index 1ab046f05..e0fd4f277 100644
--- a/src/components/Icon.tsx
+++ b/src/components/Icon.tsx
@@ -1,5 +1,9 @@
 import { FC } from "react"
-import { As, Icon as ChakraIcon, IconProps } from "@chakra-ui/react"
+import {
+  As,
+  Icon as ChakraIcon,
+  IconProps,
+} from "@threshold-network/components"
 import IconEnum from "../enums/icon"
 import iconMap from "../static/icons/iconMap"
 
@@ -10,7 +14,7 @@ const Icon: FC<IconProps & { as: As | IconEnum }> = ({ as, ...props }) => {
   }
 
   // @ts-ignore
-  return <ChakraIcon {...props} />
+  return <ChakraIcon as={as} {...props} />
 }
 
 export default Icon
diff --git a/src/components/tBTC/BridgeActivity.tsx b/src/components/tBTC/BridgeActivity.tsx
new file mode 100644
index 000000000..a999c19ef
--- /dev/null
+++ b/src/components/tBTC/BridgeActivity.tsx
@@ -0,0 +1,201 @@
+import { FC, createContext, useContext, ReactElement } from "react"
+import {
+  Badge,
+  BodyMd,
+  Image,
+  List,
+  useColorModeValue,
+  Box,
+  LinkBox,
+  LinkOverlay,
+  Stack,
+  Skeleton,
+  ListProps,
+  HStack,
+  StackProps,
+  LabelSm,
+} from "@threshold-network/components"
+import {
+  BridgeActivityStatus,
+  BridgeActivity as BridgeActivityType,
+} from "../../threshold-ts/tbtc"
+import emptyHistoryImageSrcDark from "../../static/images/tBTC-bridge-no-history-dark.svg"
+import emptyHistoryImageSrcLight from "../../static/images/tBTC-bridge-no-history-light.svg"
+import { InlineTokenBalance } from "../TokenBalance"
+import Link from "../Link"
+import { OutlineListItem } from "../OutlineListItem"
+
+export type BridgeActivityProps = {
+  data: BridgeActivityType[]
+  isFetching: boolean
+  emptyState?: ReactElement
+}
+
+type BridgeActivityContextValue = {
+  [Property in keyof BridgeActivityProps]-?: BridgeActivityProps[Property]
+} & { isBridgeHistoryEmpty: boolean }
+
+const BridgeActivityContext = createContext<
+  BridgeActivityContextValue | undefined
+>(undefined)
+
+const useBridgeActivityContext = () => {
+  const context = useContext(BridgeActivityContext)
+  if (!context) {
+    throw new Error(
+      "BridgeActivityContext used outside of the BridgeActivity component."
+    )
+  }
+
+  return context
+}
+
+export const BridgeActivity: FC<BridgeActivityProps> = ({
+  data,
+  isFetching,
+  emptyState,
+  children,
+}) => {
+  const isBridgeHistoryEmpty = data.length === 0
+
+  return (
+    <BridgeActivityContext.Provider
+      value={{
+        data,
+        isBridgeHistoryEmpty,
+        isFetching,
+        emptyState: emptyState ?? <EmptyActivity />,
+      }}
+    >
+      {children}
+    </BridgeActivityContext.Provider>
+  )
+}
+
+export const BridgeAcivityHeader: FC<StackProps> = (props) => {
+  return (
+    <HStack justifyContent="space-between" mt="10" {...props}>
+      <LabelSm color="gray.500">tBTC</LabelSm>
+      <LabelSm color="gray.500">state</LabelSm>
+    </HStack>
+  )
+}
+
+export const BridgeActivityData: FC<ListProps> = (props) => {
+  const { data, isBridgeHistoryEmpty, isFetching, emptyState } =
+    useBridgeActivityContext()
+
+  return isFetching ? (
+    <BridgeActivityLoadingState />
+  ) : (
+    <List spacing="1" mt="2" {...props}>
+      {isBridgeHistoryEmpty ? emptyState : data.map(renderActivityItem)}
+    </List>
+  )
+}
+
+const ActivityItem: FC<BridgeActivityType> = ({
+  amount,
+  status,
+  depositKey,
+}) => {
+  return (
+    <ActivityItemWrapper>
+      <LinkOverlay
+        as={Link}
+        textDecoration="none"
+        _hover={{ textDecoration: "none" }}
+        color="inherit"
+        to={`/tBTC/mint/deposit/${depositKey}`}
+      >
+        <InlineTokenBalance tokenAmount={amount} />
+      </LinkOverlay>
+      <TBTCStatusBadge status={status} />
+    </ActivityItemWrapper>
+  )
+}
+
+const renderActivityItem = (item: BridgeActivityType) => (
+  <ActivityItem key={item.depositKey} {...item} />
+)
+
+const bridgeActivityStatusToBadgeProps: Record<
+  BridgeActivityStatus,
+  { colorScheme: string }
+> = {
+  [BridgeActivityStatus.MINTED]: {
+    colorScheme: "green",
+  },
+  [BridgeActivityStatus.PENDING]: {
+    colorScheme: "yellow",
+  },
+  [BridgeActivityStatus.ERROR]: {
+    colorScheme: "red",
+  },
+}
+
+const TBTCStatusBadge: FC<{ status: BridgeActivityStatus }> = ({ status }) => {
+  return (
+    <Badge
+      variant="subtle"
+      {...bridgeActivityStatusToBadgeProps[status]}
+      size="sm"
+      display="flex"
+      alignItems="center"
+    >
+      {status}
+    </Badge>
+  )
+}
+
+export const ActivityItemWrapper: FC = ({ children }) => (
+  <LinkBox as={OutlineListItem} pl="6" pr="3">
+    {children}
+  </LinkBox>
+)
+
+export const BridgeActivityEmptyHistoryImg: FC = () => {
+  const { isBridgeHistoryEmpty, isFetching } = useBridgeActivityContext()
+  const epmtyHistoryImg = useColorModeValue(
+    emptyHistoryImageSrcLight,
+    emptyHistoryImageSrcDark
+  )
+
+  return isBridgeHistoryEmpty && !isFetching ? (
+    <>
+      <Image alt="no-history" src={epmtyHistoryImg} mx="auto" mt={16} mb={4} />
+      <BodyMd textAlign="center">You have no history yet.</BodyMd>
+    </>
+  ) : (
+    <></>
+  )
+}
+
+const EmptyActivityItem: FC = () => (
+  <ActivityItemWrapper>
+    <Box as="span" color="gray.700">
+      -.--
+    </Box>
+    <Box as="span" color="gray.700">
+      -.--
+    </Box>
+  </ActivityItemWrapper>
+)
+const EmptyActivity: FC = () => {
+  return (
+    <>
+      <EmptyActivityItem />
+      <EmptyActivityItem />
+    </>
+  )
+}
+
+const BridgeActivityLoadingState = () => {
+  return (
+    <Stack>
+      <Skeleton height="20px" />
+      <Skeleton height="20px" />
+      <Skeleton height="20px" />
+    </Stack>
+  )
+}
diff --git a/src/components/tBTC/index.ts b/src/components/tBTC/index.ts
index 564c7c00d..2787366df 100644
--- a/src/components/tBTC/index.ts
+++ b/src/components/tBTC/index.ts
@@ -1,3 +1,5 @@
 export * from "./TakeNoteList"
 export * from "./Links"
 export * from "./Stats"
+export * from "./tBTCText"
+export * from "./BridgeActivity"
diff --git a/src/components/tBTC/tBTCText.tsx b/src/components/tBTC/tBTCText.tsx
new file mode 100644
index 000000000..2ceaa1ccb
--- /dev/null
+++ b/src/components/tBTC/tBTCText.tsx
@@ -0,0 +1,13 @@
+import { FC } from "react"
+import { Box, BoxProps } from "@threshold-network/components"
+
+export const TBTCText: FC<BoxProps> = (props) => {
+  return (
+    <Box as="span" {...props}>
+      <Box as="span" textTransform="lowercase">
+        t
+      </Box>
+      BTC
+    </Box>
+  )
+}
diff --git a/src/pages/Overview/Network/CardTemplate.tsx b/src/pages/Overview/Network/CardTemplate.tsx
index c523a33ed..36cab6c7c 100644
--- a/src/pages/Overview/Network/CardTemplate.tsx
+++ b/src/pages/Overview/Network/CardTemplate.tsx
@@ -1,6 +1,5 @@
 import { FC } from "react"
-import { LabelSm, Card, LineDivider } from "@threshold-network/components"
-import { BoxProps } from "@chakra-ui/react"
+import { LabelSm, Card, BoxProps } from "@threshold-network/components"
 
 const CardTemplate: FC<{ title: string | JSX.Element } & BoxProps> = ({
   title,
@@ -10,7 +9,6 @@ const CardTemplate: FC<{ title: string | JSX.Element } & BoxProps> = ({
   return (
     <Card h="100%" w="100%" {...boxProps}>
       {typeof title === "string" ? <LabelSm>{title}</LabelSm> : title}
-      <LineDivider borderColor="gray.300" />
       {children}
     </Card>
   )
diff --git a/src/pages/Overview/Network/StakingOverview.tsx b/src/pages/Overview/Network/StakingOverview.tsx
index cf7605d3b..2720ddaa4 100644
--- a/src/pages/Overview/Network/StakingOverview.tsx
+++ b/src/pages/Overview/Network/StakingOverview.tsx
@@ -16,8 +16,10 @@ const StakingOverview: FC = () => {
 
   return (
     <CardTemplate title="STAKING" height="fit-content">
-      <BodyMd mb={2}>Staked Balance</BodyMd>
-      <InfoBox mt={4}>
+      <BodyMd mb={3} mt={4}>
+        My Staked Balance
+      </BodyMd>
+      <InfoBox>
         <TokenBalance
           icon={t.icon}
           tokenAmount={stakedBalance.toString()}
diff --git a/src/pages/Overview/Network/TotalValueLocked.tsx b/src/pages/Overview/Network/TotalValueLocked.tsx
index 4c1178fb0..37095c983 100644
--- a/src/pages/Overview/Network/TotalValueLocked.tsx
+++ b/src/pages/Overview/Network/TotalValueLocked.tsx
@@ -1,5 +1,4 @@
 import { FC } from "react"
-import { Flex } from "@chakra-ui/react"
 import CardTemplate from "./CardTemplate"
 import { H1 } from "@threshold-network/components"
 import { formatFiatCurrencyAmount } from "../../../utils/formatAmount"
@@ -10,12 +9,10 @@ const TotalValueLocked: FC<{ totalValueLocked: number | string }> = ({
   const tvl = formatFiatCurrencyAmount(totalValueLocked)
 
   return (
-    <CardTemplate title="TOTAL VALUE LOCKED" h="auto">
-      <Flex justifyContent="center">
-        <H1 fontSize={{ base: "4xl", lg: "6xl" }} fontWeight="700">
-          {tvl}
-        </H1>
-      </Flex>
+    <CardTemplate title="TOTAL VALUE LOCKED">
+      <H1 mt="10" mb="9" textAlign="center">
+        {tvl}
+      </H1>
     </CardTemplate>
   )
 }
diff --git a/src/pages/Overview/Network/index.tsx b/src/pages/Overview/Network/index.tsx
index 2e714ea29..33d4994ed 100644
--- a/src/pages/Overview/Network/index.tsx
+++ b/src/pages/Overview/Network/index.tsx
@@ -1,15 +1,46 @@
 import { useEffect } from "react"
-import { SimpleGrid, Stack } from "@threshold-network/components"
+import {
+  Box,
+  Card,
+  HStack,
+  SimpleGrid,
+  Image,
+  H5,
+  BodyMd,
+  VStack,
+} from "@threshold-network/components"
+import { useWeb3React } from "@web3-react/core"
 import TotalValueLocked from "./TotalValueLocked"
 import StakingOverview from "./StakingOverview"
 import { useFetchTvl } from "../../../hooks/useFetchTvl"
 import { PageComponent } from "../../../types"
 import { TBTCBrdigeStats } from "./tBTCBridgeStats"
 import { useFetchRecentDeposits } from "../../../hooks/tbtc"
+import { TBTCUserStats } from "./tBTCUserStats"
+import { useAppDispatch, useAppSelector } from "../../../hooks/store"
+import { selectBridgeActivity, tbtcSlice } from "../../../store/tbtc"
+import ButtonLink from "../../../components/ButtonLink"
+import upgradeToTIcon from "../../../static/images/upgrade-to-t.svg"
 
 const Network: PageComponent = () => {
   const [tvlInUSD, fetchtTvlData, tvlInTokenUnits] = useFetchTvl()
   const [deposits, isFetching, error] = useFetchRecentDeposits()
+  const { account } = useWeb3React()
+  const dispatch = useAppDispatch()
+  const bridgeActivity = useAppSelector(selectBridgeActivity)
+  const isBridgeActivityFetching = useAppSelector(
+    (state) => state.tbtc.bridgeActivity.isFetching
+  )
+
+  useEffect(() => {
+    if (!account) return
+
+    dispatch(
+      tbtcSlice.actions.requestBridgeActivity({
+        depositor: account,
+      })
+    )
+  }, [dispatch, account])
 
   useEffect(() => {
     fetchtTvlData()
@@ -22,10 +53,32 @@ const Network: PageComponent = () => {
         tvlInUSD={tvlInUSD.tBTC}
         deposits={deposits}
       />
-      <Stack spacing={4}>
-        <StakingOverview />
+      <TBTCUserStats
+        bridgeActivity={bridgeActivity}
+        isBridgeActivityFetching={isBridgeActivityFetching}
+      />
+      <VStack spacing="4">
         <TotalValueLocked totalValueLocked={tvlInUSD.total} />
-      </Stack>
+        <Card>
+          <HStack spacing="6">
+            <Image src={upgradeToTIcon} />
+            <Box>
+              <H5>Do you own KEEP or NU tokens?</H5>
+              <BodyMd>Upgrade your tokens to T.</BodyMd>
+            </Box>
+          </HStack>
+          <ButtonLink
+            to="/upgrade"
+            variant="outline"
+            size="lg"
+            isFullWidth
+            mt="9"
+          >
+            Upgrade
+          </ButtonLink>
+        </Card>
+      </VStack>
+      <StakingOverview />
     </SimpleGrid>
   )
 }
diff --git a/src/pages/Overview/Network/tBTCBridgeStats.tsx b/src/pages/Overview/Network/tBTCBridgeStats.tsx
index 0b5da69aa..de8be4e65 100644
--- a/src/pages/Overview/Network/tBTCBridgeStats.tsx
+++ b/src/pages/Overview/Network/tBTCBridgeStats.tsx
@@ -3,6 +3,7 @@ import { Card, Divider, LabelSm } from "@threshold-network/components"
 import {
   DefaultProtocolHistory,
   ProtocolHistoryProps,
+  TBTCText,
   TVL,
   TVLProps,
 } from "../../../components/tBTC"
@@ -16,7 +17,9 @@ export const TBTCBrdigeStats: FC<TBTCBrdigeStatsProps> = ({
 }) => {
   return (
     <Card>
-      <LabelSm mb="4">tBTC Bridge Stats</LabelSm>
+      <LabelSm mb="4">
+        <TBTCText /> Bridge Stats
+      </LabelSm>
       <TVL tvl={tvl} tvlInUSD={tvlInUSD} />
       <Divider my="6" />
       <DefaultProtocolHistory deposits={deposits} />
diff --git a/src/pages/Overview/Network/tBTCUserStats.tsx b/src/pages/Overview/Network/tBTCUserStats.tsx
new file mode 100644
index 000000000..9d53c349c
--- /dev/null
+++ b/src/pages/Overview/Network/tBTCUserStats.tsx
@@ -0,0 +1,94 @@
+import { FC } from "react"
+import {
+  Badge,
+  BodyMd,
+  Box,
+  Card,
+  Divider,
+  LabelSm,
+} from "@threshold-network/components"
+import InfoBox from "../../../components/InfoBox"
+import TokenBalance from "../../../components/TokenBalance"
+import ButtonLink from "../../../components/ButtonLink"
+import { useTokenState } from "../../../hooks/useTokenState"
+import {
+  ActivityItemWrapper,
+  BridgeActivity,
+  BridgeActivityData,
+  BridgeActivityProps,
+  TBTCText,
+} from "../../../components/tBTC"
+import { tBTCFillBlack } from "../../../static/icons/tBTCFillBlack"
+import Link from "../../../components/Link"
+
+type TBTCUserStatsProps = {
+  bridgeActivity: BridgeActivityProps["data"]
+  isBridgeActivityFetching: BridgeActivityProps["isFetching"]
+}
+
+export const TBTCUserStats: FC<TBTCUserStatsProps> = ({
+  bridgeActivity,
+  isBridgeActivityFetching,
+}) => {
+  const { tbtcv2 } = useTokenState()
+  const _bridgeActivity = bridgeActivity.slice(0, 2)
+
+  return (
+    <Card>
+      <LabelSm>
+        My <TBTCText /> Stats
+      </LabelSm>
+      <BodyMd mb={3} mt={4}>
+        My Balance
+      </BodyMd>
+      <InfoBox>
+        <TokenBalance
+          icon={tBTCFillBlack}
+          tokenAmount={tbtcv2.balance}
+          withSymbol
+          tokenSymbol="tBTC"
+          isLarge
+        />
+      </InfoBox>
+      <ButtonLink size="lg" isFullWidth mt={4} to="/tBTC">
+        New Mint
+      </ButtonLink>
+      <Divider my="6" />
+      <BodyMd mb="6">My Activity</BodyMd>
+      <BridgeActivity
+        data={_bridgeActivity}
+        isFetching={isBridgeActivityFetching}
+        emptyState={<BridgeActivityCustomEmptyState />}
+      >
+        <BridgeActivityData />
+      </BridgeActivity>
+      <Box as="p" mt="16" textAlign="center">
+        <Link mt="16" to={"/tBTC"}>
+          View All
+        </Link>
+      </Box>
+    </Card>
+  )
+}
+
+const BridgeActivityCustomEmptyStateItem = () => {
+  return (
+    <ActivityItemWrapper>
+      <Box as="span" color="gray.700">
+        -.-- tBTC
+      </Box>
+      <Badge variant="subtle" size="sm" colorScheme="gray">
+        connect your wallet
+      </Badge>
+    </ActivityItemWrapper>
+  )
+}
+
+const BridgeActivityCustomEmptyState = () => {
+  return (
+    <>
+      <BridgeActivityCustomEmptyStateItem />
+      <BridgeActivityCustomEmptyStateItem />
+    </>
+  )
+}
diff --git a/src/pages/tBTC/Bridge/BridgeActivity/index.tsx b/src/pages/tBTC/Bridge/BridgeActivity/index.tsx
deleted file mode 100644
index ac37bad42..000000000
--- a/src/pages/tBTC/Bridge/BridgeActivity/index.tsx
+++ /dev/null
@@ -1,145 +0,0 @@
-import { ComponentProps, FC } from "react"
-import {
-  Badge,
-  BodyMd,
-  Card,
-  HStack,
-  Image,
-  LabelSm,
-  List,
-  useColorModeValue,
-  Box,
-  LinkBox,
-  LinkOverlay,
-} from "@threshold-network/components"
-import {
-  BridgeActivityStatus,
-  BridgeActivity as BridgeActivityType,
-} from "../../../../threshold-ts/tbtc"
-import emptyHistoryImageSrcDark from "../../../../static/images/tBTC-bridge-no-history-dark.svg"
-import emptyHistoryImageSrcLight from "../../../../static/images/tBTC-bridge-no-history-light.svg"
-import { InlineTokenBalance } from "../../../../components/TokenBalance"
-import Link from "../../../../components/Link"
-import { OutlineListItem } from "../../../../components/OutlineListItem"
-
-const bridgeActivityStatusToBadgeProps: Record<
-  BridgeActivityStatus,
-  { colorScheme: string }
-> = {
-  [BridgeActivityStatus.MINTED]: {
-    colorScheme: "green",
-  },
-  [BridgeActivityStatus.PENDING]: {
-    colorScheme: "yellow",
-  },
-  [BridgeActivityStatus.ERROR]: {
-    colorScheme: "red",
-  },
-}
-
-const TBTCStatusBadge: FC<{ status: BridgeActivityStatus }> = ({ status }) => {
-  return (
-    <Badge
-      variant="subtle"
-      {...bridgeActivityStatusToBadgeProps[status]}
-      size="sm"
-      display="flex"
-      alignItems="center"
-    >
-      {status}
-    </Badge>
-  )
-}
-
-export const BridgeActivityCard: FC<ComponentProps<typeof Card>> = ({
-  children,
-  ...props
-}) => {
-  return (
-    <Card {...props} minH="530px">
-      <LabelSm mb="5">my activity</LabelSm>
-      {children}
-    </Card>
-  )
-}
-
-const ActivityItemWrapper: FC = ({ children }) => (
-  <LinkBox as={OutlineListItem} pl="6" pr="3" mx="-0.75rem">
-    {children}
-  </LinkBox>
-)
-
-const ActivityItem: FC<BridgeActivityType> = ({
-  amount,
-  status,
-  depositKey,
-}) => {
-  return (
-    <ActivityItemWrapper>
-      <LinkOverlay
-        as={Link}
-        textDecoration="none"
-        _hover={{ textDecoration: "none" }}
-        color="inherit"
-        to={`/tBTC/mint/deposit/${depositKey}`}
-      >
-        <InlineTokenBalance tokenAmount={amount} />
-      </LinkOverlay>
-      <TBTCStatusBadge status={status} />
-    </ActivityItemWrapper>
-  )
-}
-
-const renderActivityItem = (item: BridgeActivityType) => (
-  <ActivityItem key={item.depositKey} {...item} />
-)
-
-export const BridgeActivity: FC<{
-  data: BridgeActivityType[]
-}> = ({ data }) => {
-  const epmtyHistoryImg = useColorModeValue(
-    emptyHistoryImageSrcLight,
-    emptyHistoryImageSrcDark
-  )
-
-  const isHistoryEmpty = data.length === 0
-
-  return (
-    <>
-      <HStack justifyContent="space-between" mt="10">
-        <LabelSm color="gray.500">tBTC</LabelSm>
-        <LabelSm color="gray.500">state</LabelSm>
-      </HStack>
-      <List spacing="1" mt="2">
-        {isHistoryEmpty ? <EmptyActivity /> : data.map(renderActivityItem)}
-      </List>
-      {isHistoryEmpty && (
-        <>
-          <Image
-            alt="no-history"
-            src={epmtyHistoryImg}
-            mx="auto"
-            mt={16}
-            mb={4}
-          />
-          <BodyMd textAlign="center">You have no history yet.</BodyMd>
-        </>
-      )}
-    </>
-  )
-}
-
-const EmptyActivity: FC = () => {
-  return (
-    <>
-      <ActivityItemWrapper>
-        <Box as="span">-.--</Box>
-        <Box as="span">-.--</Box>
-      </ActivityItemWrapper>
-      <ActivityItemWrapper>
-        <Box as="span">-.--</Box>
-        <Box as="span">-.--</Box>
-      </ActivityItemWrapper>
-    </>
-  )
-}
diff --git a/src/pages/tBTC/Bridge/BridgeActivityCard/index.tsx b/src/pages/tBTC/Bridge/BridgeActivityCard/index.tsx
new file mode 100644
index 000000000..ab5c19ec5
--- /dev/null
+++ b/src/pages/tBTC/Bridge/BridgeActivityCard/index.tsx
@@ -0,0 +1,24 @@
+import { ComponentProps, FC } from "react"
+import { Card, LabelSm } from "@threshold-network/components"
+import {
+  BridgeAcivityHeader,
+  BridgeActivity,
+  BridgeActivityData,
+  BridgeActivityEmptyHistoryImg,
+  BridgeActivityProps,
+} from "../../../../components/tBTC"
+
+export const BridgeActivityCard: FC<
+  ComponentProps<typeof Card> & BridgeActivityProps
+> = ({ isFetching, data, children, ...props }) => {
+  return (
+    <Card {...props} minH="530px">
+      <LabelSm mb="5">my activity</LabelSm>
+      <BridgeActivity data={data} isFetching={isFetching}>
+        <BridgeAcivityHeader />
+        <BridgeActivityData mx="-0.75rem" />
+        <BridgeActivityEmptyHistoryImg />
+      </BridgeActivity>
+    </Card>
+  )
+}
diff --git a/src/pages/tBTC/Bridge/index.tsx b/src/pages/tBTC/Bridge/index.tsx
index 3cd643f3d..6b1614358 100644
--- a/src/pages/tBTC/Bridge/index.tsx
+++ b/src/pages/tBTC/Bridge/index.tsx
@@ -3,7 +3,7 @@ import { Grid, Box, Skeleton, Stack } from "@threshold-network/components"
 import { PageComponent } from "../../../types"
 import { TbtcBalanceCard } from "./TbtcBalanceCard"
 import { MintUnmintNav } from "./MintUnmintNav"
-import { BridgeActivityCard, BridgeActivity } from "./BridgeActivity"
+import { BridgeActivityCard } from "./BridgeActivityCard"
 import { useModal } from "../../../hooks/useModal"
 import { ModalType } from "../../../enums"
 import { useTBTCTerms } from "../../../hooks/useTBTCTerms"
@@ -58,17 +58,10 @@ const TBTCBridge: PageComponent = (props) => {
       </Box>
       <Box gridArea="aside">
         <TbtcBalanceCard gridArea="balance-card" mb="5" />
-        <BridgeActivityCard>
-          {isBridgeActivityFetching ? (
-            <Stack>
-              <Skeleton height="20px" />
-              <Skeleton height="20px" />
-              <Skeleton height="20px" />
-            </Stack>
-          ) : (
-            <BridgeActivity data={bridgeActivity} />
-          )}
-        </BridgeActivityCard>
+        <BridgeActivityCard
+          data={bridgeActivity}
+          isFetching={isBridgeActivityFetching}
+        />
       </Box>
     </Grid>
   )
diff --git a/src/static/images/upgrade-to-t.svg b/src/static/images/upgrade-to-t.svg
new file mode 100644
index 000000000..bb91b92c2
--- /dev/null
+++ b/src/static/images/upgrade-to-t.svg
@@ -0,0 +1,17 @@
+<svg width="88" height="88" viewBox="0 0 88 88" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.0983 47.0291C3.66346 48.6925 3.75063 50.4332 4.21624 52.0932L10.782 75.5005C11.921 79.5612 17.8874 80.1371 20.1707 76.6216C23.4336 71.5978 27.8055 66.3025 32.7057 64.1612C39.6739 61.1162 44.8361 62.0103 49.5602 62.8285C54.9044 63.7541 59.6879 64.5826 65.8912 59.5014C70.2253 55.9513 75.1379 55.2968 79.3404 55.7098C83.2369 56.0927 87.5699 52.353 86.5072 48.5468C83.9949 39.5485 80.6538 27.7451 78.8633 21.4307C78.0548 18.5798 76.169 16.1267 73.374 15.21C68.6317 13.6547 60.7456 12.3939 54.185 17.7677C47.9817 22.8489 43.1982 22.0204 37.854 21.0948C33.1299 20.2766 27.9677 19.3826 20.9995 22.4275C10.3183 27.0949 5.61759 41.2173 4.0983 47.0291Z" fill="#F2EDFF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M56.4541 16.1886C57.7086 16.1248 57.8891 16.1882 59.1231 16.1882C70.5683 16.1882 79.8464 25.7471 79.8464 37.5386C79.8464 49.3301 70.5683 58.889 59.1231 58.889C57.8891 58.889 57.5531 58.889 57.3961 58.889C57.1882 58.8874 55.0906 58.7353 54.8842 58.7273C43.9762 58.3023 35.2598 48.8807 35.2598 37.5386C35.2598 25.982 43.7375 16.8349 56.4541 16.1886ZM79.2184 37.5386C79.2184 48.9728 70.2214 58.2421 59.1231 58.2421C57.9453 58.2421 56.7913 58.1377 55.6692 57.9374C55.6692 57.9374 55.5941 57.9184 55.5636 57.9183C46.1631 56.1872 39.0277 47.7214 39.0277 37.5386C39.0277 27.3559 46.1631 18.8901 55.5636 17.159L55.6692 17.1399C56.7913 16.9396 57.9453 16.8352 59.1231 16.8352C70.2214 16.8352 79.2184 26.1045 79.2184 37.5386ZM51.8603 17.5362C42.7578 19.3653 35.8877 27.6254 35.8877 37.5386C35.8877 47.4519 42.7578 55.712 51.8603 57.5411C43.9974 54.5094 38.3997 46.6975 38.3997 37.5386C38.3997 28.3798 43.9974 20.5679 51.8603 17.5362Z" fill="#9974FF"/>
+<path d="M57.3945 59.089H57.3961H57.397H57.398H57.3989H57.3998H57.4008H57.4017H57.4026H57.4036H57.4046H57.4055H57.4065H57.4074H57.4084H57.4094H57.4104H57.4114H57.4124H57.4134H57.4144H57.4154H57.4164H57.4174H57.4184H57.4194H57.4205H57.4215H57.4225H57.4236H57.4246H57.4257H57.4267H57.4278H57.4289H57.43H57.431H57.4321H57.4332H57.4343H57.4354H57.4365H57.4376H57.4387H57.4399H57.441H57.4421H57.4433H57.4444H57.4456H57.4467H57.4479H57.4491H57.4502H57.4514H57.4526H57.4538H57.455H57.4562H57.4574H57.4586H57.4598H57.4611H57.4623H57.4635H57.4648H57.466H57.4673H57.4685H57.4698H57.4711H57.4724H57.4737H57.475H57.4763H57.4776H57.4789H57.4802H57.4815H57.4829H57.4842H57.4855H57.4869H57.4883H57.4896H57.491H57.4924H57.4938H57.4952H57.4966H57.498H57.4994H57.5008H57.5022H57.5037H57.5051H57.5066H57.508H57.5095H57.511H57.5124H57.5139H57.5154H57.5169H57.5184H57.52H57.5215H57.523H57.5245H57.5261H57.5276H57.5292H57.5308H57.5324H57.5339H57.5355H57.5371H57.5387H57.5404H57.542H57.5436H57.5452H57.5469H57.5485H57.5502H57.5519H57.5536H57.5552H57.5569H57.5586H57.5604H57.5621H57.5638H57.5655H57.5673H57.569H57.5708H57.5726H57.5744H57.5761H57.5779H57.5797H57.5816H57.5834H57.5852H57.587H57.5889H57.5907H57.5926H57.5945H57.5964H57.5983H57.6002H57.6021H57.604H57.6059H57.6079H57.6098H57.6118H57.6137H57.6157H57.6177H57.6197H57.6217H57.6237H57.6257H57.6277H57.6298H57.6318H57.6339H57.6359H57.638H57.6401H57.6422H57.6443H57.6464H57.6485H57.6507H57.6528H57.655H57.6571H57.6593H57.6615H57.6637H57.6659H57.6681H57.6703H57.6725H57.6748H57.677H57.6793H57.6816H57.6839H57.6862H57.6885H57.6908H57.6931H57.6954H57.6978H57.7001H57.7025H57.7049H57.7073H57.7097H57.7121H57.7145H57.7169H57.7194H57.7218H57.7243H57.7267H57.7292H57.7317H57.7342H57.7367H57.7393H57.7418H57.7444H57.7469H57.7495H57.7521H57.7547H57.7573H57.7599H57.7625H57.7652H57.7678H57.7705H57.7731H57.7758H57.7785H57.7812H57.7839H57.7867H57.7894H57.7922H57.7949H57.7977H57.8005H57.8033H57.8061H57.8089H57.8118H57.8146H57.8175H57.8203H57.8232H57.8261H57.829H57.8319H57.8349H57.8378H57.8408H57.8437H57.8467H57.8497H57.8527H57.8557H57.8587H57.8618H57.8648H57.8679H57.871H57.8741H57.8772H57.8803H57.8834H57.8866H57.8897H57.8929H57.8961H57.8992H57.9025H57.9057H57.9089H57.9121H57.9154H57.9187H57.9219H57.9252H57.9285H57.9319H57.9352H57.9385H57.9419H57.9453H57.9487H57.9521H57.9555H57.9589H57.9623H57.9658H57.9693H57.9727H57.9762H57.9797H57.9833H57.9868H57.9903H57.9939H57.9975H58.0011H58.0047H58.0083H58.0119H58.0156H58.0192H58.0229H58.0266H58.0303H58.034H58.0377H58.0415H58.0452H58.049H58.0528H58.0566H58.0604H58.0642H58.068H58.0719H58.0758H58.0796H58.0835H58.0875H58.0914H58.0953H58.0993H58.1033H58.1072H58.1112H58.1153H58.1193H58.1233H58.1274H58.1315H58.1355H58.1397H58.1438H58.1479H58.1521H58.1562H58.1604H58.1646H58.1688H58.173H58.1773H58.1815H58.1858H58.1901H58.1944H58.1987H58.203H58.2074H58.2117H58.2161H58.2205H58.2249H58.2293H58.2337H58.2382H58.2427H58.2472H58.2517H58.2562H58.2607H58.2653H58.2698H58.2744H58.279H58.2836H58.2882H58.2929H58.2975H58.3022H58.3069H58.3116H58.3163H58.3211H58.3258H58.3306H58.3354H58.3402H58.345H58.3499H58.3547H58.3596H58.3645H58.3694H58.3743H58.3792H58.3842H58.3892H58.3941H58.3992H58.4042H58.4092H58.4143H58.4193H58.4244H58.4295H58.4347H58.4398H58.4449H58.4501H58.4553H58.4605H58.4657H58.471H58.4762H58.4815H58.4868H58.4921H58.4974H58.5028H58.5081H58.5135H58.5189H58.5243H58.5298H58.5352H58.5407H58.5462H58.5517H58.5572H58.5627H58.5683H58.5739H58.5794H58.585H58.5907H58.5963H58.602H58.6077H58.6134H58.6191H58.6248H58.6306H58.6363H58.6421H58.6479H58.6537H58.6596H58.6655H58.6713H58.6772H58.6831H58.6891H58.695H58.701H58.707H58.713H58.719H58.7251H58.7311H58.7372H58.7433H58.7494H58.7556H58.7617H58.7679H58.7741H58.7803H58.7866H58.7928H58.7991H58.8054H58.8117H58.818H58.8244H58.8307H58.8371H58.8435H58.8499H58.8564H58.8628H58.8693H58.8758H58.8824H58.8889H58.8955H58.902H58.9086H58.9152H58.9219H58.9285H58.9352H58.9419H58.9486H58.9554H58.9621H58.9689H58.9757H58.9825H58.9893H58.9962H59.0031H59.01H59.0169H59.0238H59.0308H59.0378H59.0448H59.0518H59.0588H59.0659H59.0729H59.08H59.0872H59.0943H59.1015H59.1086H59.1158H59.1231C70.6843 59.089 80.0464 49.4349 80.0464 37.5386C80.0464 25.6423 70.6843 15.9882 59.1231 15.9882C58.6764 15.9882 58.366 15.9796 58.0893 15.972C57.6147 15.9588 57.2391 15.9484 56.444 15.9888C43.6253 16.6404 35.0598 25.8712 35.0598 37.5386C35.0598 48.981 43.8541 58.4977 54.8764 58.9271C54.9579 58.9303 55.3564 58.9575 55.8169 58.989C55.9178 58.9959 56.0218 59.003 56.126 59.0101C56.6964 59.0489 57.2826 59.0881 57.3945 59.089ZM79.0184 37.5386C79.0184 48.868 70.1054 58.0421 59.1231 58.0421C57.9594 58.0421 56.8192 57.9391 55.7106 57.7416L55.7031 57.7398C55.6995 57.739 55.6954 57.738 55.6909 57.737C55.6843 57.7355 55.6769 57.7339 55.6691 57.7322C55.6537 57.729 55.6205 57.722 55.5877 57.7193C46.2904 56.0011 39.2277 47.623 39.2277 37.5386C39.2277 27.4499 46.2966 19.0689 55.5998 17.3557L55.7043 17.3368C55.7044 17.3367 55.7045 17.3367 55.7047 17.3367C56.8151 17.1385 57.9573 17.0352 59.1231 17.0352C70.1054 17.0352 79.0184 26.2093 79.0184 37.5386ZM36.0877 37.5386C36.0877 28.5777 41.754 20.9856 49.589 18.3504C42.8252 21.9226 38.1997 29.1758 38.1997 37.5386C38.1997 45.9015 42.8253 53.1547 49.589 56.7269C41.754 54.0917 36.0877 46.4996 36.0877 37.5386Z" stroke="#9974FF" stroke-width="0.4"/>
+<g clip-path="url(#clip0_8224_245466)">
+<path d="M73.3924 29.6543H64.007V32.7826H73.3924V29.6543ZM57.7482 32.7826H54.6197V35.9127H57.7482V32.7826ZM54.6197 48.4276H57.7482V39.041H54.6197V48.4276ZM60.8767 32.7826V35.9127H64.007V32.7826H60.8767ZM60.8767 48.4276H64.007V39.041H60.8767V48.4276ZM60.8767 29.6543H57.7482V32.7826H60.8767V29.6543ZM45.2324 29.6543V32.7826H54.6197V29.6543H45.2324ZM73.3924 39.041V35.9127H64.007V39.041H73.3924ZM57.7482 35.9127V39.041H60.8767V35.9127H57.7482ZM45.2324 35.9127V39.041H54.6197V35.9127H45.2324Z" fill="#7D00FF"/>
+</g>
+<path d="M18.2479 42.2809V40.8008H14.8471V42.2616H15.3777L14.3275 43.4675H13.8926V42.2616H14.4905V40.8008H13.6839V41.3491H13.2468V40.8008H12.4488V41.3491H12.0118V40.8008H11.2051V42.2809H11.9183V45.965H11.2051V47.4451H14.4905V45.9843H13.8926V44.7784H14.3275L15.3777 45.9843H14.8471V47.4451H18.2479V45.965H17.7195L16.117 44.123L17.7195 42.2809H18.2479Z" fill="#4A5568"/>
+<path d="M26.2835 44.5257L26.4853 44.5129L26.4702 44.3113C26.0085 38.1152 20.8697 33.3303 14.7757 33.5515C14.5332 33.5603 14.3677 33.5617 14.2198 33.5629C13.9659 33.565 13.765 33.5668 13.3363 33.6042C6.43692 34.2064 1.98992 39.3566 2.21857 45.6563C2.42283 51.2838 6.537 55.9076 11.7793 56.6962L12.0391 56.7353L12.0076 56.4745C11.979 56.2377 11.9601 55.9982 11.9513 55.7562C11.9513 55.756 11.9513 55.7559 11.9513 55.7557L11.949 55.6842L11.9446 55.5472L11.8153 55.5018C7.78033 54.0872 4.80503 50.2219 4.63613 45.5686C4.44161 40.2093 8.03497 35.624 12.939 34.5357L12.9941 34.5236C12.9942 34.5236 12.9943 34.5236 12.9944 34.5236C13.5799 34.397 14.1841 34.3202 14.8028 34.2977C20.494 34.0912 25.3109 38.5659 25.7369 44.3813L25.7531 44.6029L25.9718 44.5635C26.0738 44.5452 26.1778 44.5325 26.2835 44.5257ZM8.67598 35.6606C5.66158 37.8499 3.75201 41.5155 3.90009 45.5953C4.04817 49.6751 6.21846 53.1926 9.38364 55.1576C5.73979 53.5982 3.11183 49.9613 2.95461 45.6296C2.79739 41.2979 5.15477 37.48 8.67598 35.6606Z" fill="#B1BCCC" stroke="#B1BCCC" stroke-width="0.4"/>
+<path d="M24.4 67.631H24.4016H24.4021H24.4026H24.4031H24.4036H24.4041H24.4046H24.4051H24.4056H24.4061H24.4066H24.4072H24.4077H24.4082H24.4087H24.4092H24.4098H24.4103H24.4108H24.4114H24.4119H24.4125H24.413H24.4136H24.4141H24.4147H24.4152H24.4158H24.4163H24.4169H24.4175H24.418H24.4186H24.4192H24.4197H24.4203H24.4209H24.4215H24.4221H24.4227H24.4233H24.4239H24.4245H24.4251H24.4257H24.4263H24.4269H24.4275H24.4281H24.4287H24.4293H24.43H24.4306H24.4312H24.4319H24.4325H24.4332H24.4338H24.4344H24.4351H24.4357H24.4364H24.4371H24.4377H24.4384H24.4391H24.4397H24.4404H24.4411H24.4418H24.4425H24.4432H24.4439H24.4446H24.4453H24.446H24.4467H24.4474H24.4481H24.4488H24.4495H24.4503H24.451H24.4517H24.4525H24.4532H24.4539H24.4547H24.4554H24.4562H24.4569H24.4577H24.4585H24.4592H24.46H24.4608H24.4616H24.4624H24.4632H24.4639H24.4647H24.4655H24.4663H24.4672H24.468H24.4688H24.4696H24.4704H24.4713H24.4721H24.4729H24.4738H24.4746H24.4755H24.4763H24.4772H24.478H24.4789H24.4798H24.4806H24.4815H24.4824H24.4833H24.4842H24.4851H24.486H24.4869H24.4878H24.4887H24.4896H24.4905H24.4915H24.4924H24.4933H24.4943H24.4952H24.4962H24.4971H24.4981H24.499H24.5H24.501H24.502H24.5029H24.5039H24.5049H24.5059H24.5069H24.5079H24.5089H24.5099H24.5109H24.512H24.513H24.514H24.5151H24.5161H24.5172H24.5182H24.5193H24.5203H24.5214H24.5225H24.5235H24.5246H24.5257H24.5268H24.5279H24.529H24.5301H24.5312H24.5323H24.5335H24.5346H24.5357H24.5369H24.538H24.5392H24.5403H24.5415H24.5426H24.5438H24.545H24.5462H24.5474H24.5485H24.5497H24.5509H24.5521H24.5534H24.5546H24.5558H24.557H24.5583H24.5595H24.5608H24.562H24.5633H24.5645H24.5658H24.5671H24.5683H24.5696H24.5709H24.5722H24.5735H24.5748H24.5761H24.5775H24.5788H24.5801H24.5815H24.5828H24.5841H24.5855H24.5869H24.5882H24.5896H24.591H24.5924H24.5937H24.5951H24.5965H24.598H24.5994H24.6008H24.6022H24.6036H24.6051H24.6065H24.608H24.6094H24.6109H24.6124H24.6138H24.6153H24.6168H24.6183H24.6198H24.6213H24.6228H24.6243H24.6259H24.6274H24.6289H24.6305H24.632H24.6336H24.6352H24.6367H24.6383H24.6399H24.6415H24.6431H24.6447H24.6463H24.6479H24.6495H24.6512H24.6528H24.6544H24.6561H24.6577H24.6594H24.6611H24.6627H24.6644H24.6661H24.6678H24.6695H24.6712H24.6729H24.6747H24.6764H24.6781H24.6799H24.6816H24.6834H24.6852H24.6869H24.6887H24.6905H24.6923H24.6941H24.6959H24.6977H24.6995H24.7014H24.7032H24.705H24.7069H24.7087H24.7106H24.7125H24.7144H24.7162H24.7181H24.72H24.722H24.7239H24.7258H24.7277H24.7297H24.7316H24.7336H24.7355H24.7375H24.7395H24.7414H24.7434H24.7454H24.7474H24.7494H24.7515H24.7535H24.7555H24.7576H24.7596H24.7617H24.7637H24.7658H24.7679H24.77H24.7721H24.7742H24.7763H24.7784H24.7806H24.7827H24.7848H24.787H24.7891H24.7913H24.7935H24.7957H24.7979H24.8001H24.8023H24.8045H24.8067H24.8089H24.8112H24.8134H24.8157H24.8179H24.8202H24.8225H24.8248H24.8271H24.8294H24.8317H24.834H24.8363H24.8387H24.841H24.8434H24.8457H24.8481H24.8505H24.8529H24.8553H24.8577H24.8601H24.8625H24.8649H24.8674H24.8698H24.8723H24.8747H24.8772H24.8797H24.8822H24.8847H24.8872H24.8897H24.8922H24.8947H24.8973H24.8998H24.9024H24.905H24.9075H24.9101H24.9127H24.9153H24.9179H24.9205H24.9232H24.9258H24.9284H24.9311H24.9338H24.9364H24.9391H24.9418H24.9445H24.9472H24.9499H24.9527H24.9554H24.9581H24.9609H24.9637H24.9664H24.9692H24.972H24.9748H24.9776H24.9804H24.9833H24.9861H24.9889H24.9918H24.9947H24.9975H25.0004H25.0033H25.0062H25.0091H25.012H25.015H25.0179H25.0208H25.0238H25.0268H25.0297H25.0327H25.0357H25.0387H25.0418H25.0448H25.0478H25.0509H25.0539H25.057H25.06H25.0631H25.0662H25.0693H25.0724H25.0756H25.0787H25.0818H25.085H25.0881H25.0913H25.0945H25.0977H25.1009H25.1041H25.1073H25.1105H25.1138H25.117H25.1203H25.1236H25.1268H25.1301H25.1334H25.1367H25.1401H25.1434H25.1467H25.1501H25.1534H25.1568H25.1602H25.1636H25.167H25.1704H25.1738H25.1772H25.1807H25.1841H25.1876H25.1911H25.1946H25.1981H25.2016H25.2051H25.2086H25.2121H25.2157H25.2192H25.2228H25.2264H25.23H25.2336H25.2372H25.2408H25.2444H25.2481H25.2517H25.2554H25.2591H25.2628H25.2664H25.2702H25.2739H25.2776H25.2813H25.2851H25.2888H25.2926H25.2964H25.3002H25.304H25.3078H25.3116H25.3155H25.3193H25.3232H25.327C31.5764 67.631 36.6324 62.4133 36.6324 55.9896C36.6324 49.5659 31.5764 44.3483 25.327 44.3483C25.093 44.3483 24.928 44.3437 24.7797 44.3396C24.5225 44.3326 24.3158 44.3269 23.8867 44.3487C16.97 44.7002 12.3391 49.6858 12.3391 55.9896C12.3391 62.168 17.088 67.312 23.0477 67.5442C23.0899 67.5458 23.3013 67.5602 23.5481 67.5771C23.6024 67.5808 23.6584 67.5846 23.7147 67.5885C24.0176 67.6091 24.3364 67.6305 24.4 67.631ZM19.1548 46.2347C16.063 48.3132 14.0217 51.9072 14.0217 55.9896C14.0217 60.0721 16.063 63.666 19.1548 65.7445C15.5699 64.0541 13.0756 60.3242 13.0756 55.9896C13.0756 51.6551 15.5699 47.9252 19.1548 46.2347ZM35.8959 55.9896C35.8959 62.0122 31.1585 66.8843 25.327 66.8843C24.7099 66.8843 24.1052 66.8298 23.5173 66.7252L23.5157 66.7248C23.5106 66.7236 23.5034 66.7219 23.4953 66.7202L23.4943 66.72C23.487 66.7185 23.4674 66.7143 23.4453 66.7121C18.5102 65.798 14.7582 61.3486 14.7582 55.9896C14.7582 50.6268 18.5155 46.1749 23.4558 45.2652L23.5113 45.2551C23.5114 45.2551 23.5114 45.2551 23.5115 45.2551C24.1012 45.1498 24.7078 45.095 25.327 45.095C31.1585 45.095 35.8959 49.967 35.8959 55.9896Z" fill="#B1BCCC" stroke="#B1BCCC" stroke-width="0.4"/>
+<path d="M27.3077 52.7779L26.5562 53.1426C26.539 53.1513 26.5326 53.1709 26.5412 53.1861L27.6845 55.6569C28.1106 56.5753 27.9949 57.2722 27.3484 57.5871C26.8259 57.8411 26.3742 57.6631 26.0231 57.0443L24.6699 54.1197C24.1218 52.9342 23.3725 52.6194 22.4861 53.0514C21.908 53.3315 21.574 53.8331 21.5804 54.4692C21.5804 54.4757 21.5783 54.4844 21.574 54.4888C21.5654 54.4996 21.5483 54.504 21.5355 54.4975C21.529 54.4953 21.5226 54.4888 21.5205 54.4823L21.225 53.8439C21.2207 53.8352 21.2143 53.8309 21.2057 53.8266C21.1972 53.8244 21.1886 53.8244 21.1822 53.8287L20.4285 54.1957C20.4136 54.2043 20.405 54.2239 20.4136 54.2391L22.4904 58.7226C22.4946 58.7313 22.5011 58.7356 22.5096 58.74C22.5182 58.7421 22.5268 58.7421 22.5353 58.7378L23.2868 58.373C23.3039 58.3644 23.3104 58.3448 23.3018 58.3296L22.1906 55.9283C21.7367 54.9512 21.8245 54.2434 22.5182 53.9069C23.0513 53.6485 23.4645 53.8222 23.8371 54.4844C23.8371 54.4844 23.8371 54.4866 23.8392 54.4866L25.1795 57.3808C25.6955 58.4968 26.5005 58.8811 27.3484 58.4686C28.0035 58.1494 28.2754 57.6696 28.2604 57.0399C28.2604 57.0247 28.2711 57.0117 28.284 57.0074C28.299 57.003 28.314 57.0117 28.3204 57.0247L28.6201 57.6717C28.6265 57.6848 28.6372 57.6913 28.6501 57.6913C28.6544 57.6913 28.6587 57.6891 28.6629 57.6891L29.4144 57.3222C29.4273 57.3178 29.4337 57.3048 29.4337 57.2918C29.4337 57.2874 29.4316 57.2831 29.4294 57.2788L27.3526 52.7952C27.3419 52.7779 27.3227 52.7714 27.3077 52.7779Z" fill="#4A5568"/>
+<defs>
+<clipPath id="clip0_8224_245466">
+<rect width="28.16" height="18.7733" fill="white" transform="translate(45.2324 29.6543)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/theme/Badge.ts b/src/theme/Badge.ts
index 6f9e725eb..93b7b7586 100644
--- a/src/theme/Badge.ts
+++ b/src/theme/Badge.ts
@@ -23,7 +23,12 @@ const variants = {
     const { colorScheme: c, theme } = props
     const whiteAlpha200 = "rgba(255, 255, 255, 0.08);"
 
-    const bgVariant = c === "brand" ? "75" : "50"
+    let bgVariant = "50"
+    if (c === "brand") {
+      bgVariant = "75"
+    } else if (c === "gray") {
+      bgVariant = "100"
+    }
     // The `brand.75` color is already defined in the default theme but for some
     // reason chakra can't find the `brand.75` color.
     const brand75 = "#F2EDFF"