diff --git a/web/settings/relationship/block-list-row.react.js b/web/settings/relationship/block-list-row.react.js
--- a/web/settings/relationship/block-list-row.react.js
+++ b/web/settings/relationship/block-list-row.react.js
@@ -9,6 +9,7 @@
 import type { UserRowProps } from './user-list.react.js';
 import MenuItem from '../../components/menu-item.react.js';
 import Menu from '../../components/menu.react.js';
+import UserAvatar from '../../components/user-avatar.react.js';
 
 function BlockListRow(props: UserRowProps): React.Node {
   const { userInfo, onMenuVisibilityChange } = props;
@@ -17,7 +18,10 @@
 
   return (
     <div className={css.container}>
-      <div className={css.usernameContainer}>{userInfo.username}</div>
+      <div className={css.userInfoContainer}>
+        <UserAvatar size="small" userID={userInfo.id} />
+        <div className={css.usernameContainer}>{userInfo.username}</div>
+      </div>
       <div className={css.buttons}>
         <div className={css.edit_menu}>
           <Menu
diff --git a/web/settings/relationship/friend-list-row.react.js b/web/settings/relationship/friend-list-row.react.js
--- a/web/settings/relationship/friend-list-row.react.js
+++ b/web/settings/relationship/friend-list-row.react.js
@@ -11,6 +11,7 @@
 import Button from '../../components/button.react.js';
 import MenuItem from '../../components/menu-item.react.js';
 import Menu from '../../components/menu.react.js';
+import UserAvatar from '../../components/user-avatar.react.js';
 
 const dangerButtonColor = {
   color: 'var(--btn-bg-danger)',
@@ -80,7 +81,10 @@
 
   return (
     <div className={css.container}>
-      <div className={css.usernameContainer}>{userInfo.username}</div>
+      <div className={css.userInfoContainer}>
+        <UserAvatar size="small" userID={userInfo.id} />
+        <div className={css.usernameContainer}>{userInfo.username}</div>
+      </div>
       <div className={css.buttons}>{buttons}</div>
     </div>
   );
diff --git a/web/settings/relationship/user-list-row.css b/web/settings/relationship/user-list-row.css
--- a/web/settings/relationship/user-list-row.css
+++ b/web/settings/relationship/user-list-row.css
@@ -11,6 +11,7 @@
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
+  margin-left: 8px;
 }
 
 .buttons {
@@ -29,3 +30,9 @@
 .edit_menu {
   position: relative;
 }
+
+div.userInfoContainer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}