--- a/browser/themes/shared/notification-icons.svg
+++ b/browser/themes/shared/notification-icons.svg
@@ -33,16 +33,23 @@
     }
 
     #camera-sharing,
     #microphone-sharing,
     #screen-sharing {
       fill: rgb(224, 41, 29);
       fill-opacity: 1;
     }
+
+    #camera-indicator,
+    #microphone-indicator,
+    #screen-indicator {
+      fill: white;
+      fill-opacity: 1;
+    }
   </style>
 
   <defs>
     <path id="camera-icon" d="m 2,23 a 3,3 0 0 0 3,3 l 14,0 a 3,3 0 0 0 3,-3 l 0,-4 6,5.5 c 0.5,0.5 1,0.7 2,0.5 l 0,-18 c -1,-0.2 -1.5,0 -2,0.5 l -6,5.5 0,-4 a 3,3 0 0 0 -3,-3 l -14,0 a 3,3 0 0 0 -3,3 z" />
     <path id="desktop-notification-icon" d="m 2,20 a 4,4 0 0 0 4,4 l 13,0 7,7 0,-7 a 4,4 0 0 0 4,-4 l 0,-12 a 4,4 0 0 0 -4,-4 l -20,0 a 4,4 0 0 0 -4,4 z m 5,-2 a 1,1 0 1 1 0,-2 l 10,0 a 1,1 0 1 1 0,2 z m 0,-4 a 1,1 0 1 1 0,-2 l 14,0 a 1,1 0 1 1 0,2 z m 0,-4 a 1,1 0 1 1 0,-2 l 18,0 a 1,1 0 1 1 0,2 z" />
     <path id="geo-linux-icon" d="m 2,15.9 a 14,14 0 1 1 0,0.2 z m 4,2.1 a 10,10 0 0 0 8,8 l 0,-4 4,0 0,4 a 10,10 0 0 0 8,-8 l -4,0 0,-4 4,0 a 10,10 0 0 0 -8,-8 l 0,4 -4,0 0,-4 a 10,10 0 0 0 -8,8 l 4,0 0,4 z" />
     <path id="geo-linux-detailed-icon" d="m 2,15.9 a 14,14 0 1 1 0,0.2 z m 3,2.1 a 11,11 0 0 0 9,9 l 1,-5 2,0 1,5 a 11,11 0 0 0 9,-9 l -5,-1 0,-2 5,-1 a 11,11 0 0 0 -9,-9 l -1,5 -2,0 -1,-5 a 11,11 0 0 0 -9,9 l 5,1 0,2 z" />
     <path id="geo-osx-icon" d="m 0,16 16,0 0,16 12,-28 z" />
@@ -59,16 +66,17 @@
 
     <clipPath id="clip">
       <path d="m 0,0 0,31 31,-31 z m 6,32 26,0 0,-26 z"/>
     </clipPath>
   </defs>
 
   <use id="camera" xlink:href="#camera-icon" />
   <use id="camera-sharing" xlink:href="#camera-icon"/>
+  <use id="camera-indicator" xlink:href="#camera-icon" />
   <use id="camera-blocked" class="blocked" xlink:href="#camera-icon" />
   <use id="desktop-notification" xlink:href="#desktop-notification-icon" />
   <use id="desktop-notification-blocked" class="blocked" xlink:href="#desktop-notification-icon" />
   <use id="geo-osx" xlink:href="#geo-osx-icon" />
   <use id="geo-osx-blocked" class="blocked" xlink:href="#geo-osx-icon" />
   <use id="geo-linux" xlink:href="#geo-linux-icon" />
   <use id="geo-linux-blocked" class="blocked" xlink:href="#geo-linux-icon" />
   <use id="geo-linux-detailed" xlink:href="#geo-linux-detailed-icon" />
@@ -77,19 +85,21 @@
   <use id="geo-windows-detailed" xlink:href="#geo-windows-detailed-icon" />
   <use id="indexedDB" xlink:href="#indexedDB-icon" />
   <use id="indexedDB-blocked" class="blocked" xlink:href="#indexedDB-icon" />
   <use id="login" xlink:href="#login-icon" />
   <use id="login-highlighted" class="highlighted" xlink:href="#login-icon" />
   <use id="login-detailed" xlink:href="#login-detailed-icon" />
   <use id="microphone" xlink:href="#microphone-icon" />
   <use id="microphone-sharing" xlink:href="#microphone-icon"/>
+  <use id="microphone-indicator" xlink:href="#microphone-icon"/>
   <use id="microphone-blocked" class="blocked" xlink:href="#microphone-icon" />
   <use id="microphone-detailed" xlink:href="#microphone-detailed-icon" />
   <use id="plugin" xlink:href="#plugin-icon" />
   <use id="plugin-blocked" class="blocked" xlink:href="#plugin-icon" />
   <use id="popup" xlink:href="#popup-icon" />
   <use id="screen" xlink:href="#screen-icon" />
   <use id="screen-sharing" xlink:href="#screen-icon"/>
+  <use id="screen-indicator" xlink:href="#screen-icon"/>
   <use id="screen-blocked" class="blocked" xlink:href="#screen-icon" />
 
   <path id="strikeout" d="m 2,28 2,2 26,-26 -2,-2 z"/>
 </svg>

--- a/browser/themes/shared/webRTC-indicator.css
+++ b/browser/themes/shared/webRTC-indicator.css
@@ -24,17 +24,17 @@ window {
   background-color: white;
 }
 
 #firefoxButton:hover {
   background-color: #f2f2f2;
 }
 
 #screenShareButton {
-  background-image: url("chrome://browser/skin/notification-icons.svg#screen-sharing");
+  background-image: url("chrome://browser/skin/notification-icons.svg#screen-indicator");
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 16px;
   min-width: 27px;
   display: none;
 }
 
 window[sharingscreen] > #screenShareButton {
@@ -56,27 +56,27 @@ window[sharingvideo] > #audioVideoButton
 window[sharingaudio] > #audioVideoButton {
   display: -moz-box;
   background-position: center center;
   background-size: 16px;
   min-width: 26px;
 }
 
 window[sharingvideo] > #audioVideoButton {
-  background-image: url("chrome://browser/skin/notification-icons.svg#camera-sharing");
+  background-image: url("chrome://browser/skin/notification-icons.svg#camera-indicator");
 }
 
 window[sharingaudio] > #audioVideoButton {
-  background-image: url("chrome://browser/skin/notification-icons.svg#microphone-sharing");
+  background-image: url("chrome://browser/skin/notification-icons.svg#microphone-indicator");
 }
 
 /* Multi-icon button: */
 window[sharingaudio][sharingvideo] > #audioVideoButton {
-  background-image: url("chrome://browser/skin/notification-icons.svg#camera-sharing"),
-                    url("chrome://browser/skin/notification-icons.svg#microphone-sharing");
+  background-image: url("chrome://browser/skin/notification-icons.svg#camera-indicator"),
+                    url("chrome://browser/skin/notification-icons.svg#microphone-indicator");
   background-position: 6px center, 26px center;
   background-size: 16px, 16px;
   min-width: 46px;
 }
 
 /* Hover styles */
 #audioVideoButton,
 #screenShareButton {