--- a/devtools/client/framework/components/toolbox-tab.js
+++ b/devtools/client/framework/components/toolbox-tab.js
@@ -50,15 +50,25 @@ module.exports = createClass({
         id: `toolbox-tab-${id}`,
         "data-id": id,
         title: tooltip,
         type: "button",
         tabIndex: focusedButton === id ? "0" : "-1",
         onFocus: () => focusButton(id),
         onClick: () => selectTool(id),
       },
+      span(
+        {
+          className: "devtools-tab-line"
+        }
+      ),
       ...this.renderIcon(panelDefinition, isHighlighted),
-      iconOnly ? null : span({
-        className: "devtools-tab-label"
-      }, label)
+      iconOnly ?
+        null :
+        span(
+          {
+            className: "devtools-tab-label"
+          },
+          label
+        )
     );
   }
 });

--- a/devtools/client/themes/toolbox.css
+++ b/devtools/client/themes/toolbox.css
@@ -14,16 +14,19 @@
   --command-responsive-image: url(images/command-responsivemode.svg);
   --command-scratchpad-image: url(images/tool-scratchpad.svg);
   --command-pick-image: url(images/command-pick.svg);
   --command-frames-image: url(images/command-frames.svg);
   --command-splitconsole-image: url(images/command-console.svg);
   --command-noautohide-image: url(images/command-noautohide.svg);
   --command-rulers-image: url(images/command-rulers.svg);
   --command-measure-image: url(images/command-measure.svg);
+
+  --toolbox-tab-hover-color: var(--grey-30);
+  --toolbox-tab-selected-color: var(--blue-50);
 }
 
 .theme-firebug {
   --close-button-image: url(chrome://devtools/skin/images/firebug/close.svg);
   --dock-bottom-image: url(chrome://devtools/skin/images/firebug/dock-bottom.svg);
   --dock-side-image: url(chrome://devtools/skin/images/firebug/dock-side.svg);
   --dock-undock-image: url(chrome://devtools/skin/images/firebug/dock-undock.svg);
 
@@ -85,31 +88,54 @@
 }
 
 #toolbox-buttons-start {
   border: solid 0 var(--theme-splitter-color);
   border-inline-end-width: 1px;
 }
 
 /* Toolbox tabs */
+
 .devtools-tab {
   position: relative;
   display: flex;
   align-items: center;
   min-width: 32px;
   min-height: 24px;
   margin: 0;
   padding: 0;
   border: none;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   background-color: transparent;
 }
 
+.devtools-tab-line {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  background: transparent;
+}
+
+.devtools-tab:hover .devtools-tab-line {
+  background: var(--toolbox-tab-hover-color);
+}
+
+.devtools-tab.selected .devtools-tab-line {
+  background: var(--toolbox-tab-selected-color);
+}
+
+/* Hide the devtools tab line in the firebug theme */
+.theme-firebug .devtools-tab:hover .devtools-tab-line,
+.theme-firebug .devtools-tab.selected .devtools-tab-line {
+  background: transparent;
+}
 
 .devtools-tab-label {
   mask-image: linear-gradient(to left, transparent 0, black 6px);
   /* Set the end padding on the label to make sure the label gets faded out properly */
   padding-inline-end: 10px;
   min-width: 1px;
 }