diff --git a/package-lock.json b/package-lock.json
index 23aa82ad55..9983e6587b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -865,7 +865,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -882,7 +881,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -899,7 +897,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -916,7 +913,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -933,7 +929,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "optional": true,
       "os": [
         "darwin"
@@ -949,7 +944,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -966,7 +960,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -983,7 +976,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1000,7 +992,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1017,7 +1008,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1034,7 +1024,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1051,7 +1040,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1068,7 +1056,6 @@
       "cpu": [
         "mips64el"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1085,7 +1072,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1102,7 +1088,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1119,7 +1104,6 @@
       "cpu": [
         "s390x"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1136,7 +1120,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1153,7 +1136,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1170,7 +1152,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1187,7 +1168,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1204,7 +1184,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1221,7 +1200,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1238,7 +1216,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1255,7 +1232,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1272,7 +1248,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -1289,7 +1264,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3349,7 +3323,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3363,7 +3336,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3377,7 +3349,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3391,7 +3362,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3405,7 +3375,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3419,7 +3388,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3433,7 +3401,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3447,7 +3414,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3461,7 +3427,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3475,7 +3440,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3489,7 +3453,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3503,7 +3466,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3517,7 +3479,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3531,7 +3492,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3545,7 +3505,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3559,7 +3518,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3573,7 +3531,6 @@
       "cpu": [
         "s390x"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3587,7 +3544,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3601,7 +3557,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3615,7 +3570,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3629,7 +3583,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3643,7 +3596,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3657,7 +3609,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3671,7 +3622,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3685,7 +3635,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -8391,7 +8340,6 @@
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
       "hasInstallScript": true,
       "optional": true,
       "os": [
@@ -9965,7 +9913,6 @@
       "version": "2.6.1",
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.6.1.tgz",
       "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==",
-      "dev": true,
       "optional": true,
       "bin": {
         "jiti": "lib/jiti-cli.mjs"
@@ -17829,7 +17776,7 @@
       "version": "2.8.3",
       "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.3.tgz",
       "integrity": "sha512-AvbaCLOO2Otw/lW5bmh9d/WEdcDFdQp2Z2ZUH3pX9U2ihyUY0nvLv7J6TrWowklRGPYbB/IuIMfYgxaCPg5Bpg==",
-      "dev": true,
+      "devOptional": true,
       "license": "ISC",
       "bin": {
         "yaml": "bin.mjs"
diff --git a/src/ConnectedTokenProvider.tsx b/src/ConnectedTokenProvider.tsx
index ee8bfc8404..fa0fca15c5 100644
--- a/src/ConnectedTokenProvider.tsx
+++ b/src/ConnectedTokenProvider.tsx
@@ -21,6 +21,8 @@ declare module '@mui/material/styles' {
   }
 }
 
+const listItemButtonPadding = 12
+
 const connectThemeOverrides = (palette: Theme['palette']) => ({
   components: {
     MuiTypography: {
@@ -78,6 +80,13 @@ const connectThemeOverrides = (palette: Theme['palette']) => ({
         },
       },
     },
+    MuiDivider: {
+      styleOverrides: {
+        root: {
+          height: 'unset',
+        },
+      },
+    },
     MuiFormLabel: {
       styleOverrides: {
         asterisk: {
@@ -144,6 +153,38 @@ const connectThemeOverrides = (palette: Theme['palette']) => ({
         },
       },
     },
+    MuiList: {
+      styleOverrides: {
+        root: {
+          marginLeft: -1 * listItemButtonPadding,
+          marginRight: -1 * listItemButtonPadding,
+        },
+      },
+    },
+    MuiListItemAvatar: {
+      styleOverrides: {
+        root: {
+          height: undefined,
+          marginRight: 12,
+          minWidth: 'unset',
+          width: undefined,
+          '& .MuiAvatar-root': {
+            height: undefined,
+            width: undefined,
+          },
+        },
+      },
+    },
+
+    MuiListItemButton: {
+      styleOverrides: {
+        root: {
+          borderRadius: 8,
+          paddingLeft: listItemButtonPadding,
+          paddingRight: listItemButtonPadding,
+        },
+      },
+    },
   },
   // TODO: Remove this custom spacing scale once we are on MXUI v2.
   spacing: (factor: number) => `${factor * 8}px`,
diff --git a/src/views/manualAccount/ManualAccountMenu.js b/src/views/manualAccount/ManualAccountMenu.js
deleted file mode 100644
index 7849c7ba6c..0000000000
--- a/src/views/manualAccount/ManualAccountMenu.js
+++ /dev/null
@@ -1,114 +0,0 @@
-import React, { useEffect } from 'react'
-import PropTypes from 'prop-types'
-import { __ } from 'src/utilities/Intl'
-
-import { Icon, Text } from '@mxenabled/mxui'
-import { UtilityRow } from '@kyper/utilityrow'
-
-import { fadeOut } from 'src/utilities/Animation'
-
-import { SlideDown } from 'src/components/SlideDown'
-
-import { getDelay } from 'src/utilities/getDelay'
-import { focusElement } from 'src/utilities/Accessibility'
-import { AccountTypeNames, AccountTypes } from 'src/views/manualAccount/constants'
-import { StyledAccountTypeIcon } from 'src/components/StyledAccountTypeIcon'
-import { Stack } from '@mui/material'
-
-export const ManualAccountMenu = React.forwardRef((props, ref) => {
-  const getNextDelay = getDelay()
-
-  const typeList =
-    props.availableAccountTypes?.length !== 0
-      ? props.availableAccountTypes
-      : [
-          AccountTypes.CHECKING,
-          AccountTypes.SAVINGS,
-          AccountTypes.LOAN,
-          AccountTypes.CREDIT_CARD,
-          AccountTypes.INVESTMENT,
-          AccountTypes.LINE_OF_CREDIT,
-          AccountTypes.MORTGAGE,
-          AccountTypes.PROPERTY,
-          AccountTypes.CASH,
-          AccountTypes.INSURANCE,
-          AccountTypes.PREPAID,
-          AccountTypes.UNKNOWN,
-        ]
-
-  const getIcon = {
-    [AccountTypes.CHECKING]: <Icon color="secondary" name="checkbook" size={20} />,
-    [AccountTypes.SAVINGS]: <Icon color="secondary" name="savings" size={20} />,
-    [AccountTypes.LOAN]: <Icon color="secondary" name="contract" size={20} />,
-    [AccountTypes.CREDIT_CARD]: <Icon color="secondary" name="credit_card" size={20} />,
-    [AccountTypes.INVESTMENT]: <Icon color="secondary" name="bid_landscape" size={20} />,
-    [AccountTypes.LINE_OF_CREDIT]: <Icon color="secondary" name="description" size={20} />,
-    [AccountTypes.MORTGAGE]: <Icon color="secondary" name="home" size={20} />,
-    [AccountTypes.PROPERTY]: <Icon color="secondary" name="holiday_village" size={20} />,
-    [AccountTypes.CASH]: <Icon color="secondary" name="local_atm" size={20} />,
-    [AccountTypes.INSURANCE]: <Icon color="secondary" name="diagnosis" size={20} />,
-    [AccountTypes.PREPAID]: <Icon color="secondary" name="credit_card" size={20} />,
-    [AccountTypes.UNKNOWN]: <Icon color="secondary" name="grid_view" size={20} />,
-  }
-
-  useEffect(() => {
-    const timer = setTimeout(() => {
-      focusElement(document.querySelector('[data-test="back-button"]:first-of-type'))
-    }, 300)
-
-    return () => clearTimeout(timer)
-  }, [])
-
-  return (
-    <div data-test="manual-account-menu-container" ref={ref}>
-      <SlideDown delay={getNextDelay()}>
-        <Stack spacing={3}>
-          <StyledAccountTypeIcon icon="accounts" iconSize={40} size={64} />
-          <Stack spacing={1}>
-            <Text
-              component="h2"
-              data-test="add-account-manually-header"
-              truncate={false}
-              variant="H2"
-            >
-              {__('Add account manually')}
-            </Text>
-            <Text
-              component="p"
-              data-test="add-manual-account-paragraph"
-              truncate={false}
-              variant="Paragraph"
-            >
-              {__("Track accounts, assets, and other things that don't have a live connection.")}
-            </Text>
-          </Stack>
-        </Stack>
-      </SlideDown>
-      <SlideDown delay={getNextDelay()}>
-        <Stack>
-          {typeList.map((account_type, i) => (
-            <UtilityRow
-              aria-label={AccountTypeNames[account_type]()}
-              borderType="inset-left"
-              data-test={`${AccountTypeNames[account_type]().replace(/\s+/g, '-')}-button`}
-              key={i}
-              leftChildren={getIcon[account_type]}
-              onClick={() =>
-                fadeOut(ref.current, 'up', 300).then(props.handleAccountTypeSelect(account_type))
-              }
-              rightChildren={<Icon name="chevron_right" size={24} />}
-              title={AccountTypeNames[account_type]()}
-            />
-          ))}
-        </Stack>
-      </SlideDown>
-    </div>
-  )
-})
-
-ManualAccountMenu.propTypes = {
-  availableAccountTypes: PropTypes.array,
-  handleAccountTypeSelect: PropTypes.func.isRequired,
-}
-
-ManualAccountMenu.displayName = 'ManualAccountMenu'
diff --git a/src/views/manualAccount/ManualAccountMenu.test.tsx b/src/views/manualAccount/ManualAccountMenu.test.tsx
new file mode 100644
index 0000000000..a999e8e436
--- /dev/null
+++ b/src/views/manualAccount/ManualAccountMenu.test.tsx
@@ -0,0 +1,28 @@
+import React from 'react'
+
+import { screen, render } from 'src/utilities/testingLibrary'
+
+import { ManualAccountConnect } from 'src/views/manualAccount/ManualAccountConnect'
+
+describe('manualAccountMenu', () => {
+  it.each([
+    'Checking',
+    'Savings',
+    'Loan',
+    'Credit Card',
+    'Investment',
+    'Line of Credit',
+    'Mortgage',
+    'Property',
+    'Cash',
+    'Insurance',
+    'Prepaid',
+    'Other',
+  ])('shows the %s form when the %s menu button is clicked', async (formType) => {
+    const { user } = render(<ManualAccountConnect />)
+
+    await user.click(await screen.findByRole('button', { name: formType }))
+
+    expect(await screen.findByTestId('manual-account-form-header')).toHaveTextContent(formType)
+  })
+})
diff --git a/src/views/manualAccount/ManualAccountMenu.tsx b/src/views/manualAccount/ManualAccountMenu.tsx
new file mode 100644
index 0000000000..098b54a972
--- /dev/null
+++ b/src/views/manualAccount/ManualAccountMenu.tsx
@@ -0,0 +1,124 @@
+import React, { Fragment, useEffect } from 'react'
+import { __ } from 'src/utilities/Intl'
+import { Icon, Text } from '@mxenabled/mxui'
+import {
+  List,
+  ListItem,
+  ListItemAvatar,
+  ListItemButton,
+  ListItemIcon,
+  ListItemText,
+} from '@mui/material'
+
+import { SlideDown } from 'src/components/SlideDown'
+
+import { getDelay } from 'src/utilities/getDelay'
+import { focusElement } from 'src/utilities/Accessibility'
+import { AccountTypeNames, AccountTypes } from 'src/views/manualAccount/constants'
+import { StyledAccountTypeIcon } from 'src/components/StyledAccountTypeIcon'
+import { Stack } from '@mui/material'
+
+interface ManualAccountMenuProps {
+  availableAccountTypes?: number[]
+  handleAccountTypeSelect: (accountType: number) => void
+}
+
+export const ManualAccountMenu = React.forwardRef<HTMLDivElement, ManualAccountMenuProps>(
+  (props, ref) => {
+    const getNextDelay = getDelay()
+
+    const typeList =
+      props.availableAccountTypes?.length !== 0
+        ? props.availableAccountTypes
+        : [
+            AccountTypes.CHECKING,
+            AccountTypes.SAVINGS,
+            AccountTypes.LOAN,
+            AccountTypes.CREDIT_CARD,
+            AccountTypes.INVESTMENT,
+            AccountTypes.LINE_OF_CREDIT,
+            AccountTypes.MORTGAGE,
+            AccountTypes.PROPERTY,
+            AccountTypes.CASH,
+            AccountTypes.INSURANCE,
+            AccountTypes.PREPAID,
+            AccountTypes.UNKNOWN,
+          ]
+
+    const iconSize = 24
+
+    const getIcon: { [key: number]: React.ReactElement } = {
+      [AccountTypes.CHECKING]: <Icon color="secondary" name="checkbook" size={iconSize} />,
+      [AccountTypes.SAVINGS]: <Icon color="secondary" name="savings" size={iconSize} />,
+      [AccountTypes.LOAN]: <Icon color="secondary" name="contract" size={iconSize} />,
+      [AccountTypes.CREDIT_CARD]: <Icon color="secondary" name="credit_card" size={iconSize} />,
+      [AccountTypes.INVESTMENT]: <Icon color="secondary" name="bid_landscape" size={iconSize} />,
+      [AccountTypes.LINE_OF_CREDIT]: <Icon color="secondary" name="description" size={iconSize} />,
+      [AccountTypes.MORTGAGE]: <Icon color="secondary" name="home" size={iconSize} />,
+      [AccountTypes.PROPERTY]: <Icon color="secondary" name="holiday_village" size={iconSize} />,
+      [AccountTypes.CASH]: <Icon color="secondary" name="local_atm" size={iconSize} />,
+      [AccountTypes.INSURANCE]: <Icon color="secondary" name="diagnosis" size={iconSize} />,
+      [AccountTypes.PREPAID]: <Icon color="secondary" name="credit_card" size={iconSize} />,
+      [AccountTypes.UNKNOWN]: <Icon color="secondary" name="grid_view" size={iconSize} />,
+    }
+
+    useEffect(() => {
+      const timer = setTimeout(() => {
+        focusElement(document.querySelector('[data-test="back-button"]:first-of-type'))
+      }, 300)
+
+      return () => clearTimeout(timer)
+    }, [])
+
+    return (
+      <div data-test="manual-account-menu-container" ref={ref}>
+        <SlideDown delay={getNextDelay()}>
+          <Stack spacing={3}>
+            <StyledAccountTypeIcon icon="accounts" iconSize={40} size={64} />
+            <Stack spacing={1} useFlexGap={true}>
+              <Text
+                component="h2"
+                data-test="add-account-manually-header"
+                truncate={false}
+                variant="H2"
+              >
+                {__('Add account manually')}
+              </Text>
+              <Text
+                component="p"
+                data-test="add-manual-account-paragraph"
+                truncate={false}
+                variant="Paragraph"
+              >
+                {__("Track accounts, assets, and other things that don't have a live connection.")}
+              </Text>
+              <List dense={true}>
+                {typeList?.map((account_type) => (
+                  <Fragment key={account_type}>
+                    <ListItem disableGutters={true}>
+                      <ListItemButton
+                        aria-label={AccountTypeNames[account_type]()}
+                        data-test={`${AccountTypeNames[account_type]().replace(/\s+/g, '-')}-button`}
+                        onClick={() => props.handleAccountTypeSelect(account_type)}
+                      >
+                        <ListItemAvatar>{getIcon[account_type]}</ListItemAvatar>
+                        <ListItemText disableTypography={true}>
+                          <Text variant="body1">{AccountTypeNames[account_type]()}</Text>
+                        </ListItemText>
+                        <ListItemIcon>
+                          <Icon name="chevron_right" size={iconSize} />
+                        </ListItemIcon>
+                      </ListItemButton>
+                    </ListItem>
+                  </Fragment>
+                ))}
+              </List>
+            </Stack>
+          </Stack>
+        </SlideDown>
+      </div>
+    )
+  },
+)
+
+ManualAccountMenu.displayName = 'ManualAccountMenu'
diff --git a/src/views/manualAccount/__tests__/manualAccountMenu-test.tsx b/src/views/manualAccount/__tests__/manualAccountMenu-test.tsx
deleted file mode 100644
index f7e1ce38fb..0000000000
--- a/src/views/manualAccount/__tests__/manualAccountMenu-test.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react'
-
-import { screen, render } from 'src/utilities/testingLibrary'
-
-import { ManualAccountMenu } from 'src/views/manualAccount/ManualAccountMenu'
-
-const handleAccountTypeSelect = vi.fn()
-
-const accountMenuProps = {
-  handleAccountTypeSelect,
-  availableAccountTypes: [],
-}
-
-describe('manualAccountMenu', () => {
-  it('renders manual account menu and clicks on a checking account', async () => {
-    const ref = React.createRef()
-
-    const { user } = render(<ManualAccountMenu {...accountMenuProps} ref={ref} />)
-
-    await user.click(await screen.findByRole('button', { name: 'Checking' }))
-    expect(handleAccountTypeSelect).toHaveBeenCalled()
-  })
-})