diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index efe6a71ad6cf..e2ad0fbea46e 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -6364,6 +6364,9 @@
   "unknown": {
     "message": "Unknown"
   },
+  "unknownChainWarning": {
+    "message": "We can’t verify custom networks. To avoid malicious providers from recording your network activity, only add networks you trust."
+  },
   "unknownCollection": {
     "message": "Unnamed collection"
   },
diff --git a/ui/pages/confirmations/confirmation/templates/__snapshots__/add-ethereum-chain.test.js.snap b/ui/pages/confirmations/confirmation/templates/__snapshots__/add-ethereum-chain.test.js.snap
index 38bdc74279f8..9fa77789403d 100644
--- a/ui/pages/confirmations/confirmation/templates/__snapshots__/add-ethereum-chain.test.js.snap
+++ b/ui/pages/confirmations/confirmation/templates/__snapshots__/add-ethereum-chain.test.js.snap
@@ -6,30 +6,31 @@ exports[`add-ethereum-chain confirmation should match snapshot 1`] = `
     class="confirmation-page"
   >
     <div
-      class="mm-box confirmation-page__content mm-box--padding-0"
+      class="mm-box confirmation-page__content mm-box--padding-4"
       style="margin-top: 0px; overflow-y: auto;"
     >
       <div
-        class="mm-box mm-box--margin-top-2 mm-box--display-flex mm-box--justify-content-center"
+        boxprops="[object Object]"
+        class="mm-box mm-banner-base mm-banner-alert mm-banner-alert--severity-warning mm-box--padding-3 mm-box--padding-left-2 mm-box--display-flex mm-box--gap-2 mm-box--background-color-warning-muted mm-box--rounded-sm"
       >
+        <span
+          class="mm-box mm-icon mm-icon--size-lg mm-box--display-inline-block mm-box--color-warning-default"
+          style="mask-image: url('./images/icons/danger.svg');"
+        />
         <div
-          class="mm-box mm-picker-network network-display mm-box--padding-right-4 mm-box--padding-left-2 mm-box--display-flex mm-box--gap-2 mm-box--align-items-center mm-box--background-color-transparent mm-box--rounded-pill mm-box--border-color-border-muted mm-box--border-width-0 box--border-style-solid box--border-width-1"
+          class="mm-box mm-box--min-width-0"
         >
-          <div
-            class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-picker-network__avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1"
+          <p
+            class="box box--margin-top-1 box--margin-bottom-1 box--flex-direction-row typography typography--p typography--weight-normal typography--style-normal typography--color-text-default"
           >
-            T
-          </div>
-          <span
-            class="mm-box mm-text mm-text--body-sm mm-text--ellipsis mm-box--color-text-default"
-            data-testid="network-display"
+            We can’t verify custom networks. To avoid malicious providers from recording your network activity, only add networks you trust. 
+          </p>
+          <a
+            href="https://support.metamask.io/networks-and-sidechains/managing-networks/user-guide-custom-networks-and-sidechains/"
+            target="__blank"
           >
-            Test initial state
-          </span>
-          <span
-            class="mm-box mm-picker-network__arrow-down-icon mm-icon mm-icon--size-xs mm-box--margin-left-auto mm-box--display-none mm-box--color-icon-default"
-            style="mask-image: url('./images/icons/arrow-down.svg');"
-          />
+            Learn more
+          </a>
         </div>
       </div>
       <h3
@@ -42,25 +43,6 @@ exports[`add-ethereum-chain confirmation should match snapshot 1`] = `
       >
         This site is requesting to update your default network URL. You can edit defaults and network information any time.
       </h6>
-      <h6
-        class="box box--margin-top-1 box--margin-bottom-1 box--display-flex box--flex-direction-column box--align-items-center typography typography--h7 typography--weight-normal typography--style-normal typography--color-text-default"
-      >
-        <b>
-          MetaMask does not verify custom networks. 
-        </b>
-        <span>
-           
-          Learn about 
-          <a
-            href="https://support.metamask.io/networks-and-sidechains/managing-networks/user-guide-custom-networks-and-sidechains/"
-            target="__blank"
-          >
-            scams and network security risks
-          </a>
-          .
-           
-        </span>
-      </h6>
       <div
         class="box box--margin-6 box--padding-4 box--padding-bottom-3 box--flex-direction-row box--rounded-lg box--border-color-border-muted box--border-style-solid box--border-width-1"
       >
@@ -70,12 +52,12 @@ exports[`add-ethereum-chain confirmation should match snapshot 1`] = `
           <dt
             class="mm-box mm-text definition-list__term mm-text--body-sm-bold mm-box--margin-top-0 mm-box--margin-bottom-1 mm-box--color-text-default"
           >
-            Network name
+            Currency symbol
             <div>
               <div
                 aria-describedby="tippy-tooltip-1"
                 class="definition-list__tooltip-wrapper"
-                data-original-title="The name associated with this network."
+                data-original-title="The ticker symbol displayed for this network’s currency."
                 data-tooltipped=""
                 style="display: inline;"
                 tabindex="0"
@@ -90,7 +72,7 @@ exports[`add-ethereum-chain confirmation should match snapshot 1`] = `
           <dd
             class="mm-box mm-text definition-list__definition mm-text--body-sm mm-text--overflow-wrap-break-word mm-box--margin-top-0 mm-box--margin-bottom-2 mm-box--color-text-alternative"
           >
-            Test chain
+            TST
           </dd>
           <dt
             class="mm-box mm-text definition-list__term mm-text--body-sm-bold mm-box--margin-top-0 mm-box--margin-bottom-1 mm-box--color-text-default"
@@ -117,63 +99,13 @@ exports[`add-ethereum-chain confirmation should match snapshot 1`] = `
           >
             https://rpcurl.test.chain
           </dd>
-          <dt
-            class="mm-box mm-text definition-list__term mm-text--body-sm-bold mm-box--margin-top-0 mm-box--margin-bottom-1 mm-box--color-text-default"
-          >
-            Chain ID
-            <div>
-              <div
-                aria-describedby="tippy-tooltip-3"
-                class="definition-list__tooltip-wrapper"
-                data-original-title="The chain ID used to sign transactions for this network."
-                data-tooltipped=""
-                style="display: inline;"
-                tabindex="0"
-              >
-                <span
-                  class="mm-box mm-icon mm-icon--size-sm mm-box--margin-left-1 mm-box--display-inline-block mm-box--color-icon-default"
-                  style="mask-image: url('./images/icons/info.svg');"
-                />
-              </div>
-            </div>
-          </dt>
-          <dd
-            class="mm-box mm-text definition-list__definition mm-text--body-sm mm-text--overflow-wrap-break-word mm-box--margin-top-0 mm-box--margin-bottom-2 mm-box--color-text-alternative"
-          >
-            39321
-          </dd>
-          <dt
-            class="mm-box mm-text definition-list__term mm-text--body-sm-bold mm-box--margin-top-0 mm-box--margin-bottom-1 mm-box--color-text-default"
-          >
-            Currency symbol
-            <div>
-              <div
-                aria-describedby="tippy-tooltip-4"
-                class="definition-list__tooltip-wrapper"
-                data-original-title="The ticker symbol displayed for this network’s currency."
-                data-tooltipped=""
-                style="display: inline;"
-                tabindex="0"
-              >
-                <span
-                  class="mm-box mm-icon mm-icon--size-sm mm-box--margin-left-1 mm-box--display-inline-block mm-box--color-icon-default"
-                  style="mask-image: url('./images/icons/info.svg');"
-                />
-              </div>
-            </div>
-          </dt>
-          <dd
-            class="mm-box mm-text definition-list__definition mm-text--body-sm mm-text--overflow-wrap-break-word mm-box--margin-top-0 mm-box--margin-bottom-2 mm-box--color-text-alternative"
-          >
-            TST
-          </dd>
         </dl>
         <a
           class="button btn-link truncated-definition-list__view-more"
           role="button"
           tabindex="0"
         >
-          View all details
+          See details
         </a>
       </div>
     </div>
@@ -200,3 +132,5 @@ exports[`add-ethereum-chain confirmation should match snapshot 1`] = `
   </div>
 </div>
 `;
+
+exports[`add-ethereum-chain confirmation should match snapshot 2`] = `<div />`;
diff --git a/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.js b/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.js
index 730b12f23496..83514ad93148 100644
--- a/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.js
+++ b/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.js
@@ -19,6 +19,7 @@ import {
 import { DEFAULT_ROUTE } from '../../../../helpers/constants/routes';
 import ZENDESK_URLS from '../../../../helpers/constants/zendesk-url';
 import { jsonRpcRequest } from '../../../../../shared/modules/rpc.utils';
+import { BannerAlertSeverity } from '../../../../components/component-library';
 import { isValidASCIIURL, toPunycodeURL } from '../../utils/confirm';
 
 const UNRECOGNIZED_CHAIN = {
@@ -269,17 +270,17 @@ function getValues(pendingApproval, t, actions, history, data) {
         ],
       },
       {
-        element: 'Typography',
+        element: 'BannerAlert',
         key: 'only-add-networks-you-trust',
         children: [
           {
-            element: 'b',
-            key: 'bolded-text',
+            element: 'Typography',
+            key: 'description',
             props: {
               style: { display: originIsMetaMask && '-webkit-box' },
             },
             children: [
-              `${t('addEthereumChainConfirmationRisks')} `,
+              `${t('unknownChainWarning')} `,
               {
                 hide: !originIsMetaMask,
                 element: 'Tooltip',
@@ -296,7 +297,6 @@ function getValues(pendingApproval, t, actions, history, data) {
                         textAlign: 'left',
                       }}
                     >
-                      {t('someNetworksMayPoseSecurity')}{' '}
                       <a
                         key="zendesk_page_link"
                         href={ZENDESK_URLS.UNKNOWN_NETWORK}
@@ -326,28 +326,19 @@ function getValues(pendingApproval, t, actions, history, data) {
             ],
           },
           {
-            element: 'MetaMaskTranslation',
-            key: 'learn-about-risks',
+            element: 'a',
+            children: t('learnMoreUpperCase'),
+            key: 'learnMoreUpperCase',
             props: {
-              translationKey: 'addEthereumChainConfirmationRisksLearnMore',
-              variables: [
-                {
-                  element: 'a',
-                  children: t('addEthereumChainConfirmationRisksLearnMoreLink'),
-                  key: 'addEthereumChainConfirmationRisksLearnMoreLink',
-                  props: {
-                    href: ZENDESK_URLS.USER_GUIDE_CUSTOM_NETWORKS,
-                    target: '__blank',
-                  },
-                },
-              ],
+              href: ZENDESK_URLS.USER_GUIDE_CUSTOM_NETWORKS,
+              target: '__blank',
             },
           },
         ],
         props: {
-          variant: TypographyVariant.H7,
+          severity: BannerAlertSeverity.Warning,
           boxProps: {
-            margin: originIsMetaMask ? [0, 8] : 0,
+            margin: [0, 4],
             display: Display.Flex,
             flexDirection: FlexDirection.Column,
             alignItems: AlignItems.center,
diff --git a/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.test.js b/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.test.js
index ff7fa449f29e..7bc0cfb5b20c 100644
--- a/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.test.js
+++ b/ui/pages/confirmations/confirmation/templates/add-ethereum-chain.test.js
@@ -61,15 +61,9 @@ describe('add-ethereum-chain confirmation', () => {
       },
     };
     const store = configureMockStore(middleware)(testStore);
-    const { container, getByText } = renderWithProvider(
-      <Confirmation />,
-      store,
-    );
+    const { container } = renderWithProvider(<Confirmation />, store);
     await waitFor(() => {
-      expect(
-        getByText('MetaMask does not verify custom networks.'),
-      ).toBeInTheDocument();
-      expect(container.querySelector('.callout')).toBeDefined();
+      expect(container.querySelector('.mm-banner-base')).toBeDefined();
       expect(container).toMatchSnapshot();
     });
   });