diff --git a/native/components/protocol-icon.react.js b/native/components/protocol-icon.react.js
--- a/native/components/protocol-icon.react.js
+++ b/native/components/protocol-icon.react.js
@@ -3,6 +3,7 @@
 import Icon from '@expo/vector-icons/FontAwesome.js';
 import * as React from 'react';
 import { View } from 'react-native';
+import type { ViewStyleProp } from 'react-native/Libraries/StyleSheet/StyleSheet';
 
 import { getProtocolByName } from 'lib/shared/threads/protocols/thread-protocols.js';
 import type { ProtocolName } from 'lib/shared/threads/thread-spec.js';
@@ -14,6 +15,7 @@
   +icon?: React.Node,
   +protocol?: ProtocolName,
   +size: number,
+  +containerStyle?: ?ViewStyleProp,
 };
 
 function ProtocolIcon(props: Props): React.Node {
@@ -23,7 +25,7 @@
   const protocolIcon = getProtocolByName(props.protocol)?.presentationDetails
     ?.protocolIcon;
   const iconSize = props.size * 0.65;
-  let containerStyle = styles.container;
+  let containerStyle = props.containerStyle ?? styles.container;
   if (props.icon) {
     containerStyle = styles.container;
     iconComponent = props.icon;
@@ -33,18 +35,19 @@
     iconComponent = <Icon name="server" size={iconSize} style={styles.icon} />;
   } else if (protocolIcon === 'farcaster') {
     iconComponent = <FarcasterLogo size={iconSize} />;
-    containerStyle = styles.farcasterContainer;
+    containerStyle = [styles.farcasterContainer, props.containerStyle];
   }
 
   const viewStyle = React.useMemo(
-    () => [
-      containerStyle,
-      {
-        width: props.size,
-        height: props.size,
-        borderRadius: props.size,
-      },
-    ],
+    () =>
+      [
+        containerStyle,
+        {
+          width: props.size,
+          height: props.size,
+          borderRadius: props.size,
+        },
+      ].flat(),
     [containerStyle, props.size],
   );
 
diff --git a/native/user-profile/user-profile.react.js b/native/user-profile/user-profile.react.js
--- a/native/user-profile/user-profile.react.js
+++ b/native/user-profile/user-profile.react.js
@@ -26,6 +26,7 @@
 import UserProfileMessageButton from './user-profile-message-button.react.js';
 import UserProfileRelationshipButton from './user-profile-relationship-button.react.js';
 import { BottomSheetContext } from '../bottom-sheet/bottom-sheet-provider.react.js';
+import ProtocolIcon from '../components/protocol-icon.react.js';
 import SingleLine from '../components/single-line.react.js';
 import SWMansionIcon from '../components/swmansion-icon.react.js';
 import { useStyles } from '../themes/colors.js';
@@ -56,12 +57,18 @@
     }
     return (
       <View style={styles.farcasterUsernameContainer}>
-        <Text style={styles.farcasterUsernameText}>Farcaster: {ensFCName}</Text>
+        <ProtocolIcon
+          protocol="Farcaster DC"
+          size={20}
+          containerStyle={styles.farcasterIcon}
+        />
+        <Text style={styles.farcasterUsernameText}>{ensFCName}</Text>
       </View>
     );
   }, [
     farcasterUsername,
     resolvedUsernameText,
+    styles.farcasterIcon,
     styles.farcasterUsernameText,
     styles.farcasterUsernameContainer,
   ]);
@@ -233,12 +240,18 @@
   },
   farcasterUsernameContainer: {
     paddingVertical: 8,
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
   },
   farcasterUsernameText: {
     color: 'modalForegroundLabel',
     fontSize: 14,
     fontWeight: '500',
   },
+  farcasterIcon: {
+    marginLeft: 0,
+  },
   copyUsernameContainer: {
     flexDirection: 'row',
     justifyContent: 'center',
diff --git a/web/components/protocol-icon.react.js b/web/components/protocol-icon.react.js
--- a/web/components/protocol-icon.react.js
+++ b/web/components/protocol-icon.react.js
@@ -16,6 +16,7 @@
   +icon?: React.Node,
   +protocol?: ProtocolName,
   +size: number,
+  +marginHorizontal?: number,
 };
 
 function ProtocolIcon(props: Props): React.Node {
@@ -55,8 +56,7 @@
         display: 'flex',
         justifyContent: 'center',
         alignItems: 'center',
-        marginLeft: 3,
-        marginRight: 3,
+        marginHorizontal: props.marginHorizontal ?? 3,
       }}
     >
       {iconComponent}
diff --git a/web/modals/user-profile/user-profile.css b/web/modals/user-profile/user-profile.css
--- a/web/modals/user-profile/user-profile.css
+++ b/web/modals/user-profile/user-profile.css
@@ -26,6 +26,10 @@
 }
 
 .farcasterUsernameContainer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 8px;
   padding: 8px 0;
 }
 
diff --git a/web/modals/user-profile/user-profile.react.js b/web/modals/user-profile/user-profile.react.js
--- a/web/modals/user-profile/user-profile.react.js
+++ b/web/modals/user-profile/user-profile.react.js
@@ -18,6 +18,7 @@
 import UserProfileAvatarModal from './user-profile-avatar-modal.react.js';
 import css from './user-profile.css';
 import UserAvatar from '../../avatars/user-avatar.react.js';
+import ProtocolIcon from '../../components/protocol-icon.react.js';
 import SingleLine from '../../components/single-line.react.js';
 
 type Props = {
@@ -75,7 +76,8 @@
     }
     return (
       <div className={css.farcasterUsernameContainer}>
-        <p className={css.farcasterUsernameText}>Farcaster: {ensFCName}</p>
+        <ProtocolIcon protocol="Farcaster DC" size={20} marginHorizontal={0} />
+        <p className={css.farcasterUsernameText}>{ensFCName}</p>
       </div>
     );
   }, [farcasterUsername, resolvedUsernameText]);