diff --git a/native/chat/chat.react.js b/native/chat/chat.react.js
--- a/native/chat/chat.react.js
+++ b/native/chat/chat.react.js
@@ -223,18 +223,19 @@
         {...props}
       />
     ),
-    headerRight:
-      Platform.OS === 'android' && areSettingsEnabled
-        ? // This is a render prop, not a component
-          // eslint-disable-next-line react/display-name
-          () => (
-            <ThreadSettingsButton
-              threadInfo={route.params.threadInfo}
-              navigate={navigation.navigate}
-            />
-          )
-        : undefined,
+    headerRight: areSettingsEnabled
+      ? // This is a render prop, not a component
+        // eslint-disable-next-line react/display-name
+        () => (
+          <ThreadSettingsButton
+            threadInfo={route.params.threadInfo}
+            navigate={navigation.navigate}
+          />
+        )
+      : undefined,
     headerBackTitleVisible: false,
+    headerTitleAlign: areSettingsEnabled ? 'left' : 'center',
+    headerLeftContainerStyle: { width: Platform.OS === 'ios' ? 32 : 40 },
   };
 };
 const composeThreadOptions = {
diff --git a/native/chat/message-list-header-title.react.js b/native/chat/message-list-header-title.react.js
--- a/native/chat/message-list-header-title.react.js
+++ b/native/chat/message-list-header-title.react.js
@@ -1,21 +1,24 @@
 // @flow
 
-import Icon from '@expo/vector-icons/Ionicons.js';
 import {
   HeaderTitle,
   type HeaderTitleInputProps,
 } from '@react-navigation/elements';
 import * as React from 'react';
-import { View, Platform } from 'react-native';
+import { View } from 'react-native';
 
+import { useGetAvatarForThread } from 'lib/shared/avatar-utils.js';
+import type { ClientAvatar } from 'lib/types/avatar-types.js';
 import type { ThreadInfo } from 'lib/types/thread-types.js';
 import { useResolvedThreadInfo } from 'lib/utils/entity-helpers.js';
 import { firstLine } from 'lib/utils/string-utils.js';
 
 import type { ChatNavigationProp } from './chat.react.js';
+import Avatar from '../components/avatar.react.js';
 import Button from '../components/button.react.js';
 import { ThreadSettingsRouteName } from '../navigation/route-names.js';
 import { useStyles } from '../themes/colors.js';
+import { useShouldRenderAvatars } from '../utils/avatar-utils.js';
 
 type BaseProps = {
   +threadInfo: ThreadInfo,
@@ -28,6 +31,8 @@
   ...BaseProps,
   +styles: typeof unboundStyles,
   +title: string,
+  +avatarInfo: ClientAvatar,
+  +shouldRenderAvatars: boolean,
 };
 class MessageListHeaderTitle extends React.PureComponent<Props> {
   render() {
@@ -38,16 +43,17 @@
       areSettingsEnabled,
       styles,
       title,
+      avatarInfo,
+      shouldRenderAvatars,
       ...rest
     } = this.props;
 
-    let icon, fakeIcon;
-    if (Platform.OS === 'ios' && areSettingsEnabled) {
-      icon = (
-        <Icon name="chevron-forward" size={20} style={styles.forwardIcon} />
-      );
-      fakeIcon = (
-        <Icon name="chevron-forward" size={20} style={styles.fakeIcon} />
+    let avatar;
+    if (!isSearchEmpty && shouldRenderAvatars) {
+      avatar = (
+        <View style={styles.avatarContainer}>
+          <Avatar avatarInfo={avatarInfo} size="small" />
+        </View>
       );
     }
 
@@ -59,9 +65,8 @@
         disabled={!areSettingsEnabled}
       >
         <View style={styles.container}>
-          {fakeIcon}
+          {avatar}
           <HeaderTitle {...rest}>{firstLine(title)}</HeaderTitle>
-          {icon}
         </View>
       </Button>
     );
@@ -78,6 +83,9 @@
 }
 
 const unboundStyles = {
+  avatarContainer: {
+    marginRight: 8,
+  },
   button: {
     flex: 1,
   },
@@ -85,21 +93,6 @@
     flex: 1,
     flexDirection: 'row',
     alignItems: 'center',
-    justifyContent: Platform.OS === 'android' ? 'flex-start' : 'center',
-  },
-  fakeIcon: {
-    paddingRight: 3,
-    paddingTop: 3,
-    flex: 1,
-    minWidth: 25,
-    opacity: 0,
-  },
-  forwardIcon: {
-    paddingLeft: 3,
-    paddingTop: 3,
-    color: 'headerChevron',
-    flex: 1,
-    minWidth: 25,
   },
 };
 
@@ -109,11 +102,24 @@
   ) {
     const styles = useStyles(unboundStyles);
 
+    const shouldRenderAvatars = useShouldRenderAvatars();
+
     const { uiName } = useResolvedThreadInfo(props.threadInfo);
+    const avatarInfo = useGetAvatarForThread(props.threadInfo);
+
     const { isSearchEmpty } = props;
+
     const title = isSearchEmpty ? 'New Message' : uiName;
 
-    return <MessageListHeaderTitle {...props} styles={styles} title={title} />;
+    return (
+      <MessageListHeaderTitle
+        {...props}
+        styles={styles}
+        title={title}
+        avatarInfo={avatarInfo}
+        shouldRenderAvatars={shouldRenderAvatars}
+      />
+    );
   });
 
 export default ConnectedMessageListHeaderTitle;