diff --git a/ui/src/settings/components/Tabs.tsx b/ui/src/settings/components/Tabs.tsx
index 0b1666f3d..079c02466 100644
--- a/ui/src/settings/components/Tabs.tsx
+++ b/ui/src/settings/components/Tabs.tsx
@@ -1,4 +1,5 @@
 import React from 'react'
+import { RouteComponentProps, withRouter } from 'react-router'
 
 import LinkIcon from '../../components/LinkIcon'
 import styles from './Tabs.module.css'
@@ -13,16 +14,21 @@ interface Props {
   items: TabItem[]
 }
 
-export default ({ items }: Props) => (
+export default withRouter(({ location: { pathname }, items }: Props & RouteComponentProps) => (
   <nav className={styles.tabs}>
     <ul>
       {items.map(item => (
         <li key={item.key}>
-          <LinkIcon to={`/settings/${item.key}`} title={item.label} icon={item.icon}>
+          <LinkIcon
+            to={`/settings/${item.key}`}
+            title={item.label}
+            icon={item.icon}
+            active={pathname.startsWith(`/settings/${item.key}`)}
+          >
             <span>{item.label}</span>
           </LinkIcon>
         </li>
       ))}
     </ul>
   </nav>
-)
+))