diff --git a/packages/design-system-react-native/src/components/BannerBase/BannerBase.tsx b/packages/design-system-react-native/src/components/BannerBase/BannerBase.tsx
index 77a765576..32e230834 100644
--- a/packages/design-system-react-native/src/components/BannerBase/BannerBase.tsx
+++ b/packages/design-system-react-native/src/components/BannerBase/BannerBase.tsx
@@ -2,13 +2,14 @@ import {
   BoxAlignItems,
   BoxBackgroundColor,
   BoxFlexDirection,
+  ButtonIconSize,
   FontWeight,
   TextVariant,
 } from '@metamask/design-system-shared';
 import React from 'react';
 import { GestureResponderEvent } from 'react-native';
 
-import { ButtonIconSize, ButtonSize, IconName } from '../../types';
+import { ButtonSize, IconName } from '../../types';
 import { Box } from '../Box';
 import { Button } from '../Button';
 import { ButtonIcon } from '../ButtonIcon';
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.constants.ts b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.constants.ts
index 09d7cd471..908434f0f 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.constants.ts
+++ b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.constants.ts
@@ -1,5 +1,4 @@
-import { ButtonIconSize } from '../../types';
-import { IconSize } from '../Icon';
+import { ButtonIconSize, IconSize } from '@metamask/design-system-shared';
 
 // Mappings
 export const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = {
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.figma.tsx b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.figma.tsx
index 575b0ba0a..bcaad0b83 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.figma.tsx
+++ b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.figma.tsx
@@ -1,10 +1,9 @@
 // import figma needs to remain as figma otherwise it breaks code connect
 // eslint-disable-next-line import-x/no-named-as-default
 import figma from '@figma/code-connect';
+import { IconName } from '@metamask/design-system-shared';
 import React from 'react';
 
-import { IconName } from '../Icon';
-
 import { ButtonIcon } from './ButtonIcon';
 
 import { ButtonIconSize, ButtonIconVariant } from '.';
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.stories.tsx b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.stories.tsx
index d1d8aa137..2f94175bd 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.stories.tsx
+++ b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.stories.tsx
@@ -1,9 +1,11 @@
+import {
+  ButtonIconSize,
+  IconName,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 import type { Meta, StoryObj } from '@storybook/react-native';
 import { View } from 'react-native';
 
-import { ButtonIconSize, ButtonIconVariant } from '../../types';
-import { IconName } from '../Icon';
-
 import { ButtonIcon } from './ButtonIcon';
 import type { ButtonIconProps } from './ButtonIcon.types';
 
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.test.tsx b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.test.tsx
index 5ebf85e02..d743b0d14 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.test.tsx
+++ b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.test.tsx
@@ -1,11 +1,13 @@
+import {
+  ButtonIconSize,
+  IconName,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import { renderHook } from '@testing-library/react-hooks';
 import { render, fireEvent } from '@testing-library/react-native';
 import React from 'react';
 
-import { ButtonIconSize, ButtonIconVariant } from '../../types';
-import { IconName } from '../Icon';
-
 import { ButtonIcon } from './ButtonIcon';
 import { TWCLASSMAP_BUTTONICON_SIZE_DIMENSION } from './ButtonIcon.constants';
 
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.tsx b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.tsx
index cf1b1cf52..2ae353bfd 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.tsx
+++ b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.tsx
@@ -1,9 +1,12 @@
+import {
+  IconColor,
+  ButtonIconSize,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import React, { useState } from 'react';
 import type { GestureResponderEvent } from 'react-native';
 
-import { ButtonIconSize, ButtonIconVariant } from '../../types';
-import type { IconColor } from '../Icon';
 import { Icon } from '../Icon';
 import { ButtonAnimated } from '../temp-components/ButtonAnimated';
 
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.types.ts b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.types.ts
index 46ab1001a..81100107e 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.types.ts
+++ b/packages/design-system-react-native/src/components/ButtonIcon/ButtonIcon.types.ts
@@ -1,40 +1,17 @@
+import type { ButtonIconPropsShared } from '@metamask/design-system-shared';
 import type { StyleProp, ViewStyle } from 'react-native';
 
-import type { ButtonIconSize, ButtonIconVariant } from '../../types';
-import type { IconProps, IconName } from '../Icon';
+import type { IconProps } from '../Icon';
 import type { ButtonAnimatedProps } from '../temp-components/ButtonAnimated';
 
 /**
  * ButtonIcon component props.
  */
-export type ButtonIconProps = {
-  /**
-   * Optional prop to control the size of the icon
-   * Different sizes map to specific pixel dimensions
-   *
-   * @default IconSize.Md
-   */
-  size?: ButtonIconSize;
-  /**
-   * Optional prop to specify an icon to show
-   */
-  iconName: IconName;
+export type ButtonIconProps = ButtonIconPropsShared & {
   /**
    * Optional prop to pass additional properties to the icon
    */
   iconProps?: Partial<IconProps>;
-  /**
-   * Optional prop that when true, disables the button
-   *
-   * @default false
-   */
-  isDisabled?: boolean;
-  /**
-   * Optional prop to control the visual variant of the button.
-   *
-   * @default ButtonIconVariant.Default
-   */
-  variant?: ButtonIconVariant;
   /**
    * Optional prop to add twrnc overriding classNames.
    */
diff --git a/packages/design-system-react-native/src/components/ButtonIcon/index.ts b/packages/design-system-react-native/src/components/ButtonIcon/index.ts
index 17ff3a7b2..ddfc279cf 100644
--- a/packages/design-system-react-native/src/components/ButtonIcon/index.ts
+++ b/packages/design-system-react-native/src/components/ButtonIcon/index.ts
@@ -1,3 +1,6 @@
-export { ButtonIconSize, ButtonIconVariant } from '../../types';
+export {
+  ButtonIconSize,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 export { ButtonIcon } from './ButtonIcon';
 export type { ButtonIconProps } from './ButtonIcon.types';
diff --git a/packages/design-system-react-native/src/components/KeyValueColumn/KeyValueColumn.tsx b/packages/design-system-react-native/src/components/KeyValueColumn/KeyValueColumn.tsx
index 9bf42dc46..8707eb5c4 100644
--- a/packages/design-system-react-native/src/components/KeyValueColumn/KeyValueColumn.tsx
+++ b/packages/design-system-react-native/src/components/KeyValueColumn/KeyValueColumn.tsx
@@ -1,11 +1,12 @@
 import {
+  ButtonIconSize,
   FontWeight,
   TextColor,
   TextVariant,
 } from '@metamask/design-system-shared';
 import React from 'react';
 
-import { ButtonIconSize, IconColor } from '../../types';
+import { IconColor } from '../../types';
 import { BoxColumn } from '../BoxColumn';
 import { BoxRow } from '../BoxRow';
 import { ButtonIcon } from '../ButtonIcon';
diff --git a/packages/design-system-react-native/src/components/KeyValueRow/KeyValueRow.tsx b/packages/design-system-react-native/src/components/KeyValueRow/KeyValueRow.tsx
index 6e0f6b10b..411d131f1 100644
--- a/packages/design-system-react-native/src/components/KeyValueRow/KeyValueRow.tsx
+++ b/packages/design-system-react-native/src/components/KeyValueRow/KeyValueRow.tsx
@@ -1,4 +1,5 @@
 import {
+  ButtonIconSize,
   FontWeight,
   KeyValueRowVariant,
   TextColor,
@@ -7,7 +8,7 @@ import {
 import { useTailwind } from '@metamask/design-system-twrnc-preset';
 import React from 'react';
 
-import { ButtonIconSize, IconColor } from '../../types';
+import { IconColor } from '../../types';
 import { Box } from '../Box';
 import { BoxRow } from '../BoxRow';
 import { ButtonIcon } from '../ButtonIcon';
diff --git a/packages/design-system-react-native/src/types/index.ts b/packages/design-system-react-native/src/types/index.ts
index 4b97d3292..484f16b74 100644
--- a/packages/design-system-react-native/src/types/index.ts
+++ b/packages/design-system-react-native/src/types/index.ts
@@ -51,30 +51,3 @@ export enum ButtonVariant {
   Secondary = 'secondary',
   Tertiary = 'tertiary',
 }
-
-/**
- * ButtonIcon - size
- */
-export enum ButtonIconSize {
-  /**
-   * Represents a small button size (24px).
-   */
-  Sm = 'sm',
-  /**
-   * Represents a medium button size (32px).
-   */
-  Md = 'md',
-  /**
-   * Represents a large button size (40px).
-   */
-  Lg = 'lg',
-}
-
-/**
- * ButtonIcon - variant
- */
-export enum ButtonIconVariant {
-  Default = 'default',
-  Filled = 'filled',
-  Floating = 'floating',
-}
diff --git a/packages/design-system-react/src/components/BannerBase/BannerBase.tsx b/packages/design-system-react/src/components/BannerBase/BannerBase.tsx
index e9c554820..d13795eed 100644
--- a/packages/design-system-react/src/components/BannerBase/BannerBase.tsx
+++ b/packages/design-system-react/src/components/BannerBase/BannerBase.tsx
@@ -2,12 +2,13 @@ import {
   BoxAlignItems,
   BoxBackgroundColor,
   BoxFlexDirection,
+  ButtonIconSize,
   FontWeight,
   TextVariant,
 } from '@metamask/design-system-shared';
 import React, { forwardRef } from 'react';
 
-import { ButtonIconSize, ButtonSize, IconName } from '../../types';
+import { ButtonSize, IconName } from '../../types';
 import { twMerge } from '../../utils/tw-merge';
 import { Box } from '../Box';
 import { Button } from '../Button';
diff --git a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.constants.ts b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.constants.ts
index 72b6f1dd4..c4112f776 100644
--- a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.constants.ts
+++ b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.constants.ts
@@ -1,5 +1,4 @@
-import { ButtonIconSize } from '../../types';
-import { IconSize } from '../Icon';
+import { ButtonIconSize, IconSize } from '@metamask/design-system-shared';
 
 export const TWCLASSMAP_BUTTONICON_SIZE_DIMENSION = {
   [ButtonIconSize.Sm]: 'h-6 w-6',
diff --git a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.figma.tsx b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.figma.tsx
index 87e684a13..a6519f2df 100644
--- a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.figma.tsx
+++ b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.figma.tsx
@@ -1,10 +1,9 @@
 // import figma needs to remain as figma otherwise it breaks code connect
 // eslint-disable-next-line import-x/no-named-as-default
 import figma from '@figma/code-connect';
+import { IconName } from '@metamask/design-system-shared';
 import React from 'react';
 
-import { IconName } from '../Icon';
-
 import { ButtonIcon } from './ButtonIcon';
 
 import { ButtonIconSize, ButtonIconVariant } from '.';
diff --git a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.stories.tsx b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.stories.tsx
index 75f63fde5..4640650c5 100644
--- a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.stories.tsx
+++ b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.stories.tsx
@@ -1,9 +1,11 @@
+import {
+  ButtonIconSize,
+  IconName,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import React from 'react';
 
-import { ButtonIconSize, ButtonIconVariant } from '../../types';
-import { IconName } from '../Icon';
-
 import { ButtonIcon } from './ButtonIcon';
 import README from './README.mdx';
 
diff --git a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.test.tsx b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.test.tsx
index 55b2b41ce..dfeebeaa5 100644
--- a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.test.tsx
+++ b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.test.tsx
@@ -1,9 +1,12 @@
 import '@testing-library/jest-dom';
+import {
+  ButtonIconSize,
+  IconName,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 import { render, screen, fireEvent } from '@testing-library/react';
 import React from 'react';
 
-import { ButtonIconSize, ButtonIconVariant, IconName } from '../../types';
-
 import { ButtonIcon } from './ButtonIcon';
 
 describe('ButtonIcon', () => {
diff --git a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.tsx b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.tsx
index 22b08da92..3d7460f53 100644
--- a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.tsx
+++ b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.tsx
@@ -1,6 +1,9 @@
+import {
+  ButtonIconSize,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 import React, { forwardRef } from 'react';
 
-import { ButtonIconSize, ButtonIconVariant } from '../../types';
 import { twMerge } from '../../utils/tw-merge';
 import { Icon } from '../Icon';
 
diff --git a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.types.ts b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.types.ts
index 645811881..ef2a7e5d2 100644
--- a/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.types.ts
+++ b/packages/design-system-react/src/components/ButtonIcon/ButtonIcon.types.ts
@@ -1,46 +1,25 @@
+import type { ButtonIconPropsShared } from '@metamask/design-system-shared';
 import type { ComponentProps } from 'react';
 
-import type { ButtonIconSize, ButtonIconVariant } from '../../types';
-import type { IconName, IconProps } from '../Icon';
+import type { IconProps } from '../Icon';
 
-export type ButtonIconProps = ComponentProps<'button'> & {
-  /**
-   * Required prop to specify the icon to show
-   */
-  iconName: IconName;
-  /**
-   * Required prop to provide an accessible label for the button
-   */
-  ariaLabel: string;
-  /**
-   * Optional prop to pass additional properties to the icon
-   */
-  iconProps?: Partial<IconProps>;
-  /**
-   * Optional prop that when true, disables the button
-   *
-   * @default false
-   */
-  isDisabled?: boolean;
-  /**
-   * Optional prop to control the visual variant of the button.
-   *
-   * @default ButtonIconVariant.Default
-   */
-  variant?: ButtonIconVariant;
-  /**
-   * Optional prop to control the size of the button
-   *
-   * @default ButtonIconSize.Md
-   */
-  size?: ButtonIconSize;
-  /**
-   * Optional prop for additional CSS classes to be applied to the ButtonIcon component
-   */
-  className?: string;
-  /**
-   * Optional CSS styles to be applied to the component.
-   * Should be used sparingly and only for dynamic styles that can't be achieved with className.
-   */
-  style?: React.CSSProperties;
-};
+export type ButtonIconProps = ComponentProps<'button'> &
+  ButtonIconPropsShared & {
+    /**
+     * Optional prop to pass additional properties to the icon
+     */
+    iconProps?: Partial<IconProps>;
+    /**
+     * Required prop to provide an accessible label for the button
+     */
+    ariaLabel: string;
+    /**
+     * Optional prop for additional CSS classes to be applied to the ButtonIcon component
+     */
+    className?: string;
+    /**
+     * Optional CSS styles to be applied to the component.
+     * Should be used sparingly and only for dynamic styles that can't be achieved with className.
+     */
+    style?: React.CSSProperties;
+  };
diff --git a/packages/design-system-react/src/components/ButtonIcon/index.ts b/packages/design-system-react/src/components/ButtonIcon/index.ts
index 17ff3a7b2..ddfc279cf 100644
--- a/packages/design-system-react/src/components/ButtonIcon/index.ts
+++ b/packages/design-system-react/src/components/ButtonIcon/index.ts
@@ -1,3 +1,6 @@
-export { ButtonIconSize, ButtonIconVariant } from '../../types';
+export {
+  ButtonIconSize,
+  ButtonIconVariant,
+} from '@metamask/design-system-shared';
 export { ButtonIcon } from './ButtonIcon';
 export type { ButtonIconProps } from './ButtonIcon.types';
diff --git a/packages/design-system-react/src/types/index.ts b/packages/design-system-react/src/types/index.ts
index 8dfdf7920..b780329ff 100644
--- a/packages/design-system-react/src/types/index.ts
+++ b/packages/design-system-react/src/types/index.ts
@@ -61,33 +61,6 @@ export enum ButtonVariant {
   Tertiary = 'tertiary',
 }
 
-/**
- * ButtonIcon - size
- */
-export enum ButtonIconSize {
-  /**
-   * Represents a small button size (24px).
-   */
-  Sm = 'sm',
-  /**
-   * Represents a medium button size (32px).
-   */
-  Md = 'md',
-  /**
-   * Represents a large button size (40px).
-   */
-  Lg = 'lg',
-}
-
-/**
- * ButtonIcon - variant
- */
-export enum ButtonIconVariant {
-  Default = 'default',
-  Filled = 'filled',
-  Floating = 'floating',
-}
-
 /**
  * Text - textAlign
  */
diff --git a/packages/design-system-shared/src/index.ts b/packages/design-system-shared/src/index.ts
index 6a6c02947..c231c6de1 100644
--- a/packages/design-system-shared/src/index.ts
+++ b/packages/design-system-shared/src/index.ts
@@ -105,6 +105,12 @@ export {
   type BadgeWrapperCustomPosition,
   type BadgeWrapperPropsShared,
 } from './types/BadgeWrapper';
+// ButtonIcon types (ADR-0003 + ADR-0004)
+export {
+  ButtonIconSize,
+  ButtonIconVariant,
+  type ButtonIconPropsShared,
+} from './types/ButtonIcon';
 
 export {
   AvatarAccountSize,
diff --git a/packages/design-system-shared/src/types/ButtonIcon/ButtonIcon.types.ts b/packages/design-system-shared/src/types/ButtonIcon/ButtonIcon.types.ts
new file mode 100644
index 000000000..0bf9038d7
--- /dev/null
+++ b/packages/design-system-shared/src/types/ButtonIcon/ButtonIcon.types.ts
@@ -0,0 +1,72 @@
+import type { IconName } from '../Icon';
+
+/**
+ * ButtonIcon - size
+ * Convert from enum to const object (ADR-0003)
+ */
+export const ButtonIconSize = {
+  /**
+   * Represents a small button size (24px).
+   */
+  Sm: 'sm',
+  /**
+   * Represents a medium button size (32px).
+   */
+  Md: 'md',
+  /**
+   * Represents a large button size (40px).
+   */
+  Lg: 'lg',
+} as const;
+export type ButtonIconSize =
+  (typeof ButtonIconSize)[keyof typeof ButtonIconSize];
+
+/**
+ * ButtonIcon - variant
+ * Convert from enum to const object (ADR-0003)
+ */
+export const ButtonIconVariant = {
+  /**
+   * Represents the default button icon variant (transparent background).
+   */
+  Default: 'default',
+  /**
+   * Represents a filled button icon variant (muted background).
+   */
+  Filled: 'filled',
+  /**
+   * Represents a floating button icon variant (icon-default background, full circle).
+   */
+  Floating: 'floating',
+} as const;
+export type ButtonIconVariant =
+  (typeof ButtonIconVariant)[keyof typeof ButtonIconVariant];
+
+/**
+ * ButtonIcon component shared props (ADR-0004)
+ * Platform-independent properties shared across React and React Native
+ */
+export type ButtonIconPropsShared = {
+  /**
+   * Required prop to specify the icon to show
+   */
+  iconName: IconName;
+  /**
+   * Optional prop to control the size of the button
+   *
+   * @default ButtonIconSize.Md
+   */
+  size?: ButtonIconSize;
+  /**
+   * Optional prop that when true, disables the button
+   *
+   * @default false
+   */
+  isDisabled?: boolean;
+  /**
+   * Optional prop to control the visual variant of the button.
+   *
+   * @default ButtonIconVariant.Default
+   */
+  variant?: ButtonIconVariant;
+};
diff --git a/packages/design-system-shared/src/types/ButtonIcon/index.ts b/packages/design-system-shared/src/types/ButtonIcon/index.ts
new file mode 100644
index 000000000..2ab69e3c2
--- /dev/null
+++ b/packages/design-system-shared/src/types/ButtonIcon/index.ts
@@ -0,0 +1,5 @@
+export {
+  ButtonIconSize,
+  ButtonIconVariant,
+  type ButtonIconPropsShared,
+} from './ButtonIcon.types';