diff --git a/app/javascript/packages/components/icon.tsx b/app/javascript/packages/components/icon.tsx
index a6867ac5194..887bafcf70b 100644
--- a/app/javascript/packages/components/icon.tsx
+++ b/app/javascript/packages/components/icon.tsx
@@ -1,4 +1,3 @@
-import type { ComponentType } from 'react';
 import { getAssetPath } from '@18f/identity-assets';
 
 const SPRITE_URL = getAssetPath('identity-style-guide/dist/assets/img/sprite.svg');
@@ -246,39 +245,18 @@ export type DesignSystemIcon =
   | 'zoom_out'
   | 'zoom_out_map';
 
-interface BaseIconProps {
+interface IconProps {
   /**
    * Optional class name to apply to SVG element.
    */
   className?: string;
-}
 
-interface IconProps extends BaseIconProps {
+  /**
+   * Name of design system icon to show.
+   */
   icon: DesignSystemIcon;
 }
 
-interface CustomIconProps extends BaseIconProps {}
-
-/**
- * Creates a new icon component, accepting common props, and applying common wrapping elements.
- *
- * @param path SVG icon path definition.
- */
-function createIconComponent(path: string): ComponentType<CustomIconProps> {
-  return ({ className }) => (
-    <svg
-      aria-hidden
-      focusable={false}
-      role="img"
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 512 512"
-      className={className}
-    >
-      <path fill="currentColor" d={path} />
-    </svg>
-  );
-}
-
 function Icon({ icon, className }: IconProps) {
   const classes = ['usa-icon', className].filter(Boolean).join(' ');
 
@@ -289,8 +267,4 @@ function Icon({ icon, className }: IconProps) {
   );
 }
 
-Icon.Camera = createIconComponent(
-  'M512 144v288c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V144c0-26.5 21.5-48 48-48h88l12.3-32.9c7-18.7 24.9-31.1 44.9-31.1h125.5c20 0 37.9 12.4 44.9 31.1L376 96h88c26.5 0 48 21.5 48 48zM376 288c0-66.2-53.8-120-120-120s-120 53.8-120 120 53.8 120 120 120 120-53.8 120-120zm-32 0c0 48.5-39.5 88-88 88s-88-39.5-88-88 39.5-88 88-88 88 39.5 88 88z',
-);
-
 export default Icon;
diff --git a/app/javascript/packages/document-capture/components/selfie-capture.jsx b/app/javascript/packages/document-capture/components/selfie-capture.jsx
index 31332663f48..d1e9ca0d157 100644
--- a/app/javascript/packages/document-capture/components/selfie-capture.jsx
+++ b/app/javascript/packages/document-capture/components/selfie-capture.jsx
@@ -225,7 +225,7 @@ function SelfieCapture({ value, onChange, errorMessage, className }, ref) {
                   aria-label={t('doc_auth.buttons.take_picture')}
                   onClick={onCapture}
                 >
-                  <Icon.Camera className="selfie-capture__capture-icon" />
+                  <Icon icon="photo_camera" className="selfie-capture__capture-icon" />
                 </button>
               </>
             ) : (
diff --git a/app/javascript/packages/document-capture/components/selfie-capture.scss b/app/javascript/packages/document-capture/components/selfie-capture.scss
index 15397efa9ed..f5d79aa4050 100644
--- a/app/javascript/packages/document-capture/components/selfie-capture.scss
+++ b/app/javascript/packages/document-capture/components/selfie-capture.scss
@@ -157,6 +157,12 @@ div.selfie-capture__label[tabindex='-1']:focus {
 .selfie-capture__capture-icon {
   height: 2rem;
   width: 2rem;
+
+  .usa-button:not(.usa-button--unstyled) > &.usa-icon:first-child {
+    // Unset icon placement where assumed to be adjacent to text, since the selfie capture button
+    // uses a standalone icon.
+    margin: 0;
+  }
 }
 
 .selfie-capture__preview-heading.usa-file-input__preview-heading {