diff --git a/ui/components/component-library/picker-network/__snapshots__/picker-network.test.js.snap b/ui/components/component-library/picker-network/__snapshots__/picker-network.test.js.snap
index b4008bfce..b064e413c 100644
--- a/ui/components/component-library/picker-network/__snapshots__/picker-network.test.js.snap
+++ b/ui/components/component-library/picker-network/__snapshots__/picker-network.test.js.snap
@@ -3,7 +3,7 @@
 exports[`PickerNetwork should render the label inside the PickerNetwork 1`] = `
 <div>
   <button
-    class="box mm-picker-network box--padding-right-4 box--padding-left-2 box--display-inline-flex box--gap-2 box--flex-direction-row box--align-items-center box--background-color-background-default box--rounded-pill box--border-color-border-default box--border-width-1 box--border-style-solid"
+    class="box mm-picker-network box--padding-right-4 box--padding-left-2 box--display-flex box--gap-2 box--flex-direction-row box--align-items-center box--background-color-background-alternative box--rounded-pill"
     data-testid="picker-network"
   >
     <div
@@ -12,7 +12,7 @@ exports[`PickerNetwork should render the label inside the PickerNetwork 1`] = `
       I
     </div>
     <p
-      class="box text text--body-sm text--color-text-default box--flex-direction-row"
+      class="box text text--body-sm text--ellipsis text--color-text-default box--flex-direction-row"
     >
       Imported
     </p>
diff --git a/ui/components/component-library/picker-network/picker-network.js b/ui/components/component-library/picker-network/picker-network.js
index 1719630c7..1c4858681 100644
--- a/ui/components/component-library/picker-network/picker-network.js
+++ b/ui/components/component-library/picker-network/picker-network.js
@@ -26,15 +26,13 @@ export const PickerNetwork = ({
     <Box
       className={classnames('mm-picker-network', className)}
       as="button"
-      backgroundColor={COLORS.BACKGROUND_DEFAULT}
-      borderColor={COLORS.BORDER_DEFAULT}
-      borderWidth={1}
+      backgroundColor={COLORS.BACKGROUND_ALTERNATIVE}
       alignItems={ALIGN_ITEMS.CENTER}
       paddingLeft={2}
       paddingRight={4}
       gap={2}
       borderRadius={BORDER_RADIUS.PILL}
-      display={DISPLAY.INLINE_FLEX}
+      display={DISPLAY.FLEX}
       {...props}
     >
       <AvatarNetwork
@@ -44,7 +42,9 @@ export const PickerNetwork = ({
         size={SIZES.XS}
         {...avatarNetworkProps}
       />
-      <Text variant={TEXT.BODY_SM}>{label}</Text>
+      <Text ellipsis variant={TEXT.BODY_SM}>
+        {label}
+      </Text>
       <Icon
         className="mm-picker-network__arrow-down-icon"
         name={ICON_NAMES.ARROW_DOWN}
diff --git a/ui/components/component-library/picker-network/picker-network.scss b/ui/components/component-library/picker-network/picker-network.scss
index f96edf782..1e2e58cf0 100644
--- a/ui/components/component-library/picker-network/picker-network.scss
+++ b/ui/components/component-library/picker-network/picker-network.scss
@@ -3,4 +3,8 @@
 
   max-width: fit-content;
   height: var(--picker-network-height);
+
+  &:active {
+    background-color: var(--color-background-default-hover);
+  }
 }