diff --git a/packages/extension-onboarding/src/assets/images/polygon-circle.png b/packages/extension-onboarding/src/assets/images/polygon-circle.png
new file mode 100644
index 0000000000..e04a1b948a
Binary files /dev/null and b/packages/extension-onboarding/src/assets/images/polygon-circle.png differ
diff --git a/packages/extension-onboarding/src/components/NFTItem/NFTItem.style.ts b/packages/extension-onboarding/src/components/NFTItem/NFTItem.style.ts
index d33f7ec871..9e99bd7bc2 100644
--- a/packages/extension-onboarding/src/components/NFTItem/NFTItem.style.ts
+++ b/packages/extension-onboarding/src/components/NFTItem/NFTItem.style.ts
@@ -1,6 +1,21 @@
 import { makeStyles } from "@material-ui/core/styles";
 
 export const useStyles = makeStyles((theme) => ({
-
- 
+  card: {
+    borderRadius: 8,
+    border: "1px solid #ECECEC",
+    padding: 0,
+  },
+  nftName: {
+    fontFamily: "Space Grotesk",
+    fontWeight: 600,
+    fontSize: 14,
+    color: "rgba(35, 32, 57, 0.87)",
+  },
+  nftTokenId: {
+    fontFamily: "Space Grotesk",
+    fontWeight: 600,
+    fontSize: 14,
+    color: "rgba(93, 90, 116, 0.8)",
+  },
 }));
diff --git a/packages/extension-onboarding/src/components/NFTItem/NFTItem.tsx b/packages/extension-onboarding/src/components/NFTItem/NFTItem.tsx
index 41fa436cc6..bd6850d884 100644
--- a/packages/extension-onboarding/src/components/NFTItem/NFTItem.tsx
+++ b/packages/extension-onboarding/src/components/NFTItem/NFTItem.tsx
@@ -1,6 +1,6 @@
 import { IEVMNFT } from "@snickerdoodlelabs/objects";
-import { useStyles } from "@extension-onboarding/components/BalanceItem/BalanceItem.style";
-import { Box } from "@material-ui/core";
+import { useStyles } from "@extension-onboarding/components/NFTItem/NFTItem.style";
+import { Box, Grid, Typography } from "@material-ui/core";
 import React, { FC, useMemo } from "react";
 
 export interface INFTItemProps {
@@ -29,15 +29,26 @@ const NFTItem: FC<INFTItemProps> = ({ item }: INFTItemProps) => {
   return (
     <>
       {nftImages?.length ? (
-        <Box display="flex" justifyContent="space-between" mt={2}>
+        <Grid item className={classes.card}>
           <Box>
             <img
-              width={175}
-              height={175}
+              width={165}
+              height={165}
+              style={{ borderRadius: "8px 8px 0px 0px" }}
               src={nftImages[0].replace("ipfs://", "https://ipfs.io/ipfs/")}
             />
+            <Box height={68} mt={-0.5} bgcolor="rgba(253, 243, 225, 0.6)">
+              <Box p={2}>
+                <Typography className={classes.nftName}>
+                  {item?.name}
+                </Typography>
+                <Typography className={classes.nftTokenId}>
+                  Token ID: {item?.tokenId}
+                </Typography>
+              </Box>
+            </Box>
           </Box>
-        </Box>
+        </Grid>
       ) : null}
     </>
   );
diff --git a/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.style.ts b/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.style.ts
index ef253b5d8d..34b1ae4553 100644
--- a/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.style.ts
+++ b/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.style.ts
@@ -36,7 +36,7 @@ export const useStyles = makeStyles((theme) => ({
     border: "1px solid  #ECECEC",
   },
   cardBackground2: {
-    background: "rgba(253, 243, 225, 0.5)",
+    background: "rgba(185, 182, 211, 0.2)",
     border: "1px solid  #ECECEC",
   },
   cardTokenText: {
@@ -58,7 +58,7 @@ export const useStyles = makeStyles((theme) => ({
     background: "none",
   },
   selectChain: {
-    width: 220,
+    width: 240,
     height: 55,
     border: "1px solid #D9D9D9",
     borderRadius: 8,
@@ -70,7 +70,7 @@ export const useStyles = makeStyles((theme) => ({
 
   accountAddressText: {
     paddingLeft: "4px",
-    paddingTop: "10px",
+    paddingTop: "7px",
     fontFamily: "'Space Grotesk', sans-serif",
     fontWeight: 500,
     fontSize: "16px",
@@ -87,5 +87,9 @@ export const useStyles = makeStyles((theme) => ({
     fontSize: 22,
     fontWeight: 700,
   },
-  
+  nftContainer: {
+    display: "flex",
+    marginTop: "16px",
+    gap: 10,
+  },
 }));
diff --git a/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.tsx b/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.tsx
index 58cb28f91c..4758314628 100644
--- a/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.tsx
+++ b/packages/extension-onboarding/src/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.tsx
@@ -1,6 +1,7 @@
 import {
   Box,
   CircularProgress,
+  Grid,
   MenuItem,
   Select,
   Typography,
@@ -11,6 +12,8 @@ import { useAppContext } from "@extension-onboarding/context/App";
 import { useStyles } from "@extension-onboarding/pages/Onboarding/ViewAccountDetails/ViewAccountDetails.style";
 import coinbaseSmall from "@extension-onboarding/assets/icons/coinbaseSmall.svg";
 import ethereumCircle from "@extension-onboarding/assets/icons/ethereum-circle.svg";
+import avaxCircle from "@extension-onboarding/assets/images/avax-circle.png";
+import polygonCircle from "@extension-onboarding/assets/images/polygon-circle.png";
 import metamaskLogo from "@extension-onboarding/assets/icons/metamaskSmall.svg";
 import {
   EVMAccountAddress,
@@ -51,7 +54,7 @@ const ViewAccountDetails: FC = () => {
   const [accountSelect, setAccountSelect] = useState<EVMAccountAddress>(
     viewDetailsAccountAddress ?? linkedAccounts[0].accountAddress,
   );
-  const [chainSelect, setChainSelect] = useState("ETH");
+  const [chainSelect, setChainSelect] = useState("1");
 
   useEffect(() => {
     initiliaze();
@@ -154,13 +157,63 @@ const ViewAccountDetails: FC = () => {
               value={chainSelect}
               onChange={handleChainChange}
             >
-              <MenuItem value="ETH">
+              <MenuItem value="1">
                 <Box display="flex">
                   <Box>
-                    <img width={40} height={40} src={ethereumCircle} />
+                    <img width={35} height={35} src={ethereumCircle} />
                   </Box>
                   <Typography className={classes.accountAddressText}>
-                    Ethereum
+                    Ethereum Mainnet
+                  </Typography>
+                </Box>
+              </MenuItem>
+              <MenuItem value="42">
+                <Box display="flex">
+                  <Box>
+                    <img width={35} height={35} src={ethereumCircle} />
+                  </Box>
+                  <Typography className={classes.accountAddressText}>
+                    Ethereum Kovan
+                  </Typography>
+                </Box>
+              </MenuItem>
+              <MenuItem value="43113">
+                <Box display="flex">
+                  <Box>
+                    <img width={35} height={35} src={avaxCircle} />
+                  </Box>
+                  <Typography className={classes.accountAddressText}>
+                    Avalanche Fuji
+                  </Typography>
+                </Box>
+              </MenuItem>
+              <MenuItem value="43114">
+                <Box display="flex">
+                  <Box>
+                    <img width={35} height={35} src={avaxCircle} />
+                  </Box>
+                  <Typography className={classes.accountAddressText}>
+                    Avalanche Mainnet
+                  </Typography>
+                </Box>
+              </MenuItem>
+              <MenuItem value="137">
+                <Box display="flex">
+                  <Box>
+                    <img width={35} height={35} src={polygonCircle} />
+                  </Box>
+                  <Typography className={classes.accountAddressText}>
+                    Polygon Mainnet
+                  </Typography>
+                </Box>
+              </MenuItem>
+              <MenuItem value="80001">
+                <Box display="flex">
+                  <Box>
+                    <img width={35} height={35} src={polygonCircle} />
+                  </Box>
+                  <Typography className={classes.accountAddressText}>
+                    Polygon Mumbai
                   </Typography>
                 </Box>
               </MenuItem>
@@ -245,7 +298,7 @@ const ViewAccountDetails: FC = () => {
           width={580}
           height={536}
           borderRadius={8}
-          style={{ border: "1px solid #ECECEC" }}
+          border="1px solid #ECECEC"
         >
           <Box m={3}>
             <Typography className={classes.tokenText}>Your Tokens</Typography>
@@ -260,13 +313,17 @@ const ViewAccountDetails: FC = () => {
               </Box>
             ) : (
               accountBalances?.[accountSelect].map((balanceItem, index) => {
-                return (
-                  <BalanceItem
-                    key={index}
-                    item={balanceItem}
-                    currency={currencies[balanceItem.ticker] ?? 1}
-                  />
-                );
+                if (balanceItem.chainId.toString() === chainSelect) {
+                  return (
+                    <BalanceItem
+                      key={index}
+                      item={balanceItem}
+                      currency={currencies[balanceItem.ticker] ?? 1}
+                    />
+                  );
+                } else {
+                  return null;
+                }
               })
             )}
           </Box>
@@ -278,20 +335,19 @@ const ViewAccountDetails: FC = () => {
           height="100%"
           borderRadius={8}
           ml={5}
-          style={{ border: "1px solid #ECECEC" }}
+          border="1px solid #ECECEC"
         >
           <Box m={3}>
             <Typography className={classes.tokenText}>Your NFTs</Typography>
-            <Box
-              display="flex"
-              justifyContent="space-between"
-              flexWrap="wrap"
-              mt={2}
-            >
+            <Grid container className={classes.nftContainer}>
               {accountNFTs?.[accountSelect]?.map((nftItem, index) => {
-                return <NFTItem key={index} item={nftItem} />;
+                if (nftItem.chain.toString() === chainSelect) {
+                  return <NFTItem key={index} item={nftItem} />;
+                } else {
+                  return null;
+                }
               })}
-            </Box>
+            </Grid>
           </Box>
         </Box>
       </Box>