diff --git a/web/sidebar/community-drawer-item-handler.react.js b/web/sidebar/community-drawer-item-handler.react.js
--- a/web/sidebar/community-drawer-item-handler.react.js
+++ b/web/sidebar/community-drawer-item-handler.react.js
@@ -2,4 +2,5 @@
 
 export type CommunityDrawerItemHandler = {
   +onClick: (event: SyntheticEvent<HTMLElement>) => void,
+  +isActive: boolean,
 };
diff --git a/web/sidebar/community-drawer-item-handlers.react.js b/web/sidebar/community-drawer-item-handlers.react.js
--- a/web/sidebar/community-drawer-item-handlers.react.js
+++ b/web/sidebar/community-drawer-item-handlers.react.js
@@ -10,7 +10,10 @@
 import type { ThreadInfo } from 'lib/types/thread-types';
 
 import type { CommunityDrawerItemHandler } from './community-drawer-item-handler.react.js';
-import { useOnClickThread } from '../selectors/thread-selectors.js';
+import {
+  useOnClickThread,
+  useThreadIsActive,
+} from '../selectors/thread-selectors.js';
 import type { NavigationTab } from '../types/nav-types';
 
 type HandlerProps = {
@@ -21,8 +24,12 @@
 function ChatDrawerItemHandler(props: HandlerProps): React.Node {
   const { setHandler, threadInfo } = props;
   const onClick = useOnClickThread(threadInfo);
-  const handler = React.useMemo(() => ({ onClick }), [onClick]);
+  const isActive = useThreadIsActive(threadInfo.id);
 
+  const handler = React.useMemo(() => ({ onClick, isActive }), [
+    isActive,
+    onClick,
+  ]);
   React.useEffect(() => {
     setHandler(handler);
   }, [handler, setHandler]);
@@ -45,8 +52,12 @@
       }),
     [dispatch, threadInfo.id],
   );
-  const handler = React.useMemo(() => ({ onClick }), [onClick]);
+  const isActive = false;
 
+  const handler = React.useMemo(() => ({ onClick, isActive }), [
+    onClick,
+    isActive,
+  ]);
   React.useEffect(() => {
     setHandler(handler);
   }, [handler, setHandler]);
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
@@ -5,6 +5,12 @@
   padding-bottom: 8px;
 }
 
+.active {
+  background-color: var(--active-drawer-item);
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+
 .threadListContainer {
   display: flex;
   flex-direction: column;
@@ -51,6 +57,8 @@
   background-color: var(--drawer-open-community-bg);
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
+  padding-top: 4px;
+  padding-bottom: 4px;
 }
 
 .subchannelsButton {
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
@@ -109,11 +109,15 @@
   const titleLabel = classnames(css.title, css[labelStyle]);
 
   const style = React.useMemo(() => ({ paddingLeft }), [paddingLeft]);
+  const threadEntry = classnames({
+    [css.threadEntry]: true,
+    [css.active]: handler.isActive,
+  });
 
   return (
     <>
       <Handler setHandler={setHandler} threadInfo={threadInfo} />
-      <div className={css.threadEntry} style={style}>
+      <div className={threadEntry} style={style}>
         {itemExpandButton}
         <a onClick={handler.onClick} className={css.titleWrapper}>
           <div className={titleLabel}>{uiName}</div>
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -199,4 +199,5 @@
   --drawer-item-color: var(--shades-white-60);
   --drawer-open-community-bg: #191919;
   --drawer-bg: var(--shades-black-90);
+  --active-drawer-item: rgba(0, 0, 0, 0.5);
 }