diff --git a/web/sidebar/community-picker.css b/web/sidebar/community-picker.css
index caa3dc5b3..03a352cdc 100644
--- a/web/sidebar/community-picker.css
+++ b/web/sidebar/community-picker.css
@@ -1,32 +1,32 @@
 .container {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 84px;
   background: var(--community-bg);
   padding: 24px 0 32px 0;
   border-right: 1px solid var(--border-color);
   flex-grow: 1;
 }
 
 .spacer {
   flex-grow: 1;
 }
 
 .container button {
   color: var(--fg);
 }
 
 .container svg {
   color: var(--fg);
   padding: 0;
 }
 
-.settingsSelectedContainer {
+.activeContainer {
   display: flex;
   justify-content: center;
   width: 100%;
   box-sizing: border-box;
   border-left: 8px solid var(--community-settings-selected);
   border-right: 8px solid transparent;
 }
diff --git a/web/sidebar/community-picker.react.js b/web/sidebar/community-picker.react.js
index c2ac412b1..33695c28a 100644
--- a/web/sidebar/community-picker.react.js
+++ b/web/sidebar/community-picker.react.js
@@ -1,57 +1,66 @@
 // @flow
 
 import classNames from 'classnames';
 import * as React from 'react';
 import { useDispatch } from 'react-redux';
 
 import Button from '../components/button.react';
 import { useSelector } from '../redux/redux-utils.js';
 import SWMansionIcon from '../SWMansionIcon.react';
 import { updateNavInfoActionType } from '../types/nav-types.js';
 import css from './community-picker.css';
 
 function CommunityPicker(): React.Node {
   const dispatch = useDispatch();
 
   const openAccountSettings = React.useCallback(
     (event: SyntheticEvent<HTMLButtonElement>) => {
       event.preventDefault();
       dispatch({
         type: updateNavInfoActionType,
         payload: { tab: 'settings', settingsSection: 'account' },
       });
     },
     [dispatch],
   );
   const isSettingsOpen = useSelector(state => state.navInfo.tab === 'settings');
   const settingsButtonContainerClass = classNames({
-    [css.settingsSelectedContainer]: isSettingsOpen,
+    [css.activeContainer]: isSettingsOpen,
   });
 
   const openChat = React.useCallback(
     (event: SyntheticEvent<HTMLAnchorElement>) => {
       event.preventDefault();
       dispatch({
         type: updateNavInfoActionType,
         payload: { tab: 'chat' },
       });
     },
     [dispatch],
   );
+  const isInboxOpen = useSelector(
+    state =>
+      state.navInfo.tab === 'chat' ||
+      state.navInfo.tab === 'apps' ||
+      state.navInfo.tab === 'calendar',
+  );
+  const inboxButtonContainerClass = classNames({
+    [css.activeContainer]: isInboxOpen,
+  });
 
   return (
     <div className={css.container}>
-      <a onClick={openChat}>
+      <a className={inboxButtonContainerClass} onClick={openChat}>
         <SWMansionIcon icon="inbox" size={36} />
       </a>
       <div className={css.spacer} />
       <div className={settingsButtonContainerClass}>
         <Button variant="round" onClick={openAccountSettings}>
           <SWMansionIcon icon="settings" size={22} />
         </Button>
       </div>
     </div>
   );
 }
 
 export default CommunityPicker;