diff --git a/css/environment_indicator.css b/css/environment_indicator.css
index d3a3c7d3facae9d73d8efce021aaae4637528b35..c43fc68867da334515af274eb62a5f181067c3aa 100644
--- a/css/environment_indicator.css
+++ b/css/environment_indicator.css
@@ -55,6 +55,14 @@
   background-color: #EDEDE0;
 }
 
+.toolbar .toolbar-bar .toolbar-tab > a.toolbar-icon.is-active::before {
+  filter: invert(0%);
+}
+
+.toolbar .toolbar-bar .toolbar-tab > a.toolbar-icon.is-active {
+  background-image: linear-gradient(rgba(255,255,255,0.25) 20%,transparent 200%);
+}
+
 .toolbar-bar .toolbar-icon-environment:before {
   background-image: url("../images/env-bebebe.svg");
 }
diff --git a/js/environment_indicator.js b/js/environment_indicator.js
index cfd7c585db47fd1eb9a78f7445fc5bb484564128..e7fc661024a794e1952c668f6030748eb11e5cd1 100644
--- a/js/environment_indicator.js
+++ b/js/environment_indicator.js
@@ -18,8 +18,11 @@
 
         // Only apply text and background color if not using gin_toolbar
         if (!$body.hasClass('gin--vertical-toolbar') && !$body.hasClass('gin--horizontal-toolbar')) {
+          $('.toolbar .toolbar-bar .toolbar-tab > .toolbar-item').css('background-color', settings.environmentIndicator.bgColor);
+          $('#toolbar-bar .toolbar-tab a.toolbar-item', context).css('border-bottom', '0px');
+          $('#toolbar-bar .toolbar-tab a.toolbar-item', context).css('color', settings.environmentIndicator.fgColor);
           $('#toolbar-bar', context).css('background-color', settings.environmentIndicator.bgColor);
-          $('#toolbar-bar .toolbar-item a', context).not('.is-active').css('color', settings.environmentIndicator.fgColor);
+          $('#toolbar-bar .toolbar-tab a.toolbar-item', context).not('.is-active').css('color', settings.environmentIndicator.fgColor);
         }
 
         // Set environment color for gin_toolbar vertical toolbar.