diff --git a/web/sidebar/community-drawer-item.css b/web/sidebar/community-drawer-item.css
--- a/web/sidebar/community-drawer-item.css
+++ b/web/sidebar/community-drawer-item.css
@@ -19,6 +19,8 @@
 .titleWrapper {
   overflow: hidden;
   width: 100%;
+  display: flex;
+  align-items: center;
 }
 
 .title {
@@ -29,6 +31,7 @@
   font-size: var(--s-font-14);
   font-weight: var(--semi-bold);
   line-height: 22px;
+  margin-left: 8px;
 }
 
 .activeTitle {
diff --git a/web/sidebar/community-drawer-item.react.js b/web/sidebar/community-drawer-item.react.js
--- a/web/sidebar/community-drawer-item.react.js
+++ b/web/sidebar/community-drawer-item.react.js
@@ -10,6 +10,7 @@
 import css from './community-drawer-item.css';
 import { ExpandButton } from './expand-buttons.react.js';
 import SubchannelsButton from './subchannels-button.react.js';
+import ThreadAvatar from '../components/thread-avatar.react.js';
 
 export type DrawerItemProps = {
   +itemData: CommunityDrawerItemData<string>,
@@ -105,6 +106,7 @@
   });
 
   const { uiName } = useResolvedThreadInfo(threadInfo);
+
   const titleLabel = classnames({
     [css[labelStyle]]: true,
     [css.activeTitle]: handler.isActive,
@@ -122,6 +124,7 @@
       <div className={threadEntry} style={style}>
         {itemExpandButton}
         <a onClick={handler.onClick} className={css.titleWrapper}>
+          <ThreadAvatar size="micro" threadInfo={threadInfo} />
           <div className={titleLabel}>{uiName}</div>
         </a>
       </div>