diff --git a/web/chat/chat-tabs.css b/web/chat/chat-tabs.css
--- a/web/chat/chat-tabs.css
+++ b/web/chat/chat-tabs.css
@@ -24,6 +24,10 @@
   padding: 16px 0;
   text-align: center;
   cursor: pointer;
+  background-color: var(--bg);
+  color: var(--color-disabled);
+  border: 2px solid var(--border-color);
+  border-width: 0 0 3px 0;
 }
 div.tabItem svg {
   padding-right: 8px;
@@ -35,8 +39,7 @@
 div.tabItemInactive {
   background-color: var(--bg);
   color: var(--color-disabled);
-  border: 2px solid var(--border-color);
-  border-width: 0 0 3px 0;
+  color: var(--fg);
 }
 
 div.threadList {
diff --git a/web/chat/chat-thread-tab.react.js b/web/chat/chat-thread-tab.react.js
--- a/web/chat/chat-thread-tab.react.js
+++ b/web/chat/chat-thread-tab.react.js
@@ -14,10 +14,8 @@
 };
 function ChatThreadTab(props: Props): React.Node {
   const { title, onClick, tabIsActive, icon } = props;
-  const className = classNames({
-    [css.tabItem]: true,
+  const className = classNames(css.tabItem, {
     [css.tabItemActive]: tabIsActive,
-    [css.tabItemInactive]: !tabIsActive,
   });
 
   return (