--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -7321,20 +7321,19 @@
                   class="tab-background">
           <xul:hbox xbl:inherits="selected=visuallyselected"
                     class="tab-line"/>
           <xul:spacer flex="1"/>
           <xul:hbox class="tab-bottom-line"/>
         </xul:vbox>
         <xul:hbox xbl:inherits="pinned,selected=visuallyselected,titlechanged,attention"
                   class="tab-content" align="center">
-          <xul:image xbl:inherits="fadein,pinned,busy,progress,selected=visuallyselected"
-                     class="tab-throbber"
-                     role="presentation"
-                     layer="true" />
+          <xul:hbox xbl:inherits="fadein,pinned,busy,progress,selected=visuallyselected"
+                    class="tab-throbber"
+                    layer="true"/>
           <xul:image xbl:inherits="src=image,loadingprincipal=iconLoadingPrincipal,fadein,pinned,selected=visuallyselected,busy,crashed,sharing"
                      anonid="tab-icon-image"
                      class="tab-icon-image"
                      validate="never"
                      role="presentation"/>
           <xul:image xbl:inherits="sharing,selected=visuallyselected,pinned"
                      anonid="sharing-icon"
                      class="tab-sharing-icon-overlay"

--- a/browser/themes/shared/jar.inc.mn
+++ b/browser/themes/shared/jar.inc.mn
@@ -169,18 +169,17 @@
   skin/classic/browser/searchReset.css                         (../shared/searchReset.css)
   skin/classic/browser/badge-add-engine.png                    (../shared/search/badge-add-engine.png)
   skin/classic/browser/badge-add-engine@2x.png                 (../shared/search/badge-add-engine@2x.png)
   skin/classic/browser/search-indicator-badge-add.png          (../shared/search/search-indicator-badge-add.png)
   skin/classic/browser/search-indicator-badge-add@2x.png       (../shared/search/search-indicator-badge-add@2x.png)
   skin/classic/browser/search-indicator-magnifying-glass.svg   (../shared/search/search-indicator-magnifying-glass.svg)
   skin/classic/browser/search-arrow-go.svg                     (../shared/search/search-arrow-go.svg)
   skin/classic/browser/gear.svg                                (../shared/search/gear.svg)
-  skin/classic/browser/tabbrowser/connecting.png               (../shared/tabbrowser/connecting.png)
-  skin/classic/browser/tabbrowser/connecting@2x.png            (../shared/tabbrowser/connecting@2x.png)
+  skin/classic/browser/tabbrowser/loading.svg                  (../shared/tabbrowser/loading.svg)
   skin/classic/browser/tabbrowser/crashed.svg                  (../shared/tabbrowser/crashed.svg)
   skin/classic/browser/tabbrowser/newtab.svg                   (../shared/tabbrowser/newtab.svg)
   skin/classic/browser/tabbrowser/indicator-tab-attention.svg  (../shared/tabbrowser/indicator-tab-attention.svg)
   skin/classic/browser/tabbrowser/pendingpaint.png             (../shared/tabbrowser/pendingpaint.png)
   skin/classic/browser/tabbrowser/tab-audio-playing.svg        (../shared/tabbrowser/tab-audio-playing.svg)
   skin/classic/browser/tabbrowser/tab-audio-muted.svg          (../shared/tabbrowser/tab-audio-muted.svg)
   skin/classic/browser/tabbrowser/tab-audio-blocked.svg        (../shared/tabbrowser/tab-audio-blocked.svg)
   skin/classic/browser/tabbrowser/tab-audio-small.svg          (../shared/tabbrowser/tab-audio-small.svg)

new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/tabbrowser/loading.svg
@@ -0,0 +1,6 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<svg xmlns="http://www.w3.org/2000/svg" width="960" height="16" fill="context-fill">
+  <path d="M2 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM18.392 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM35.565 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM53.024 6.049c1.198 0 2.17.874 2.17 1.951s-.972 1.951-2.17 1.951-2.17-.874-2.17-1.951.972-1.951 2.17-1.951zM70.33 6.099c1.295 0 2.346.852 2.346 1.901 0 1.05-1.05 1.901-2.345 1.901-1.295 0-2.346-.852-2.346-1.901 0-1.05 1.051-1.901 2.346-1.901zM87.423 6.149c1.391 0 2.52.83 2.52 1.851 0 1.022-1.129 1.851-2.52 1.851s-2.52-.83-2.52-1.851c0-1.022 1.129-1.851 2.52-1.851zM104.337 6.199c1.488 0 2.696.807 2.696 1.801 0 .994-1.208 1.801-2.696 1.801-1.488 0-2.696-.807-2.696-1.801 0-.994 1.208-1.801 2.696-1.801zM121.112 6.249c1.584 0 2.87.784 2.87 1.751 0 .967-1.286 1.751-2.87 1.751-1.585 0-2.872-.784-2.872-1.751 0-.967 1.286-1.751 2.87-1.751zM137.776 6.299c1.68 0 3.045.762 3.045 1.701 0 .939-1.364 1.701-3.045 1.701-1.681 0-3.046-.761-3.046-1.701 0-.939 1.365-1.701 3.046-1.701zM154.351 6.349c1.778 0 3.221.74 3.221 1.651s-1.443 1.651-3.22 1.651c-1.779 0-3.222-.74-3.222-1.651s1.443-1.651 3.22-1.651zM170.854 6.399c1.874 0 3.395.717 3.395 1.601s-1.521 1.601-3.395 1.601-3.396-.717-3.396-1.601 1.522-1.601 3.396-1.601zM187.294 6.344c1.769 0 3.205.742 3.205 1.656 0 .914-1.436 1.656-3.205 1.656-1.768 0-3.204-.742-3.204-1.656 0-.914 1.436-1.656 3.204-1.656zM203.683 6.287c1.657 0 3.003.767 3.003 1.713 0 .946-1.346 1.713-3.003 1.713-1.658 0-3.004-.767-3.004-1.713 0-.946 1.346-1.713 3.004-1.713zM220.025 6.23c1.547 0 2.803.793 2.803 1.77s-1.256 1.77-2.803 1.77-2.803-.792-2.803-1.77 1.256-1.77 2.803-1.77zM236.328 6.172c1.436 0 2.602.82 2.602 1.828 0 1.009-1.166 1.828-2.602 1.828s-2.602-.82-2.602-1.828c0-1.009 1.166-1.828 2.602-1.828zM252.596 6.115c1.325 0 2.401.845 2.401 1.885s-1.076 1.885-2.401 1.885c-1.326 0-2.402-.845-2.402-1.885s1.076-1.885 2.402-1.885zM268.832 6.057c1.214 0 2.2.87 2.2 1.943 0 1.072-.986 1.943-2.2 1.943-1.215 0-2.2-.87-2.2-1.943 0-1.072.985-1.943 2.2-1.943zM285.04 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM301.222 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM317.38 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM333.517 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM349.635 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM365.734 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM381.816 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM397.883 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM413.934 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM429.972 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM445.997 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM462.01 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM478.01 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM494 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM509.84 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM525.344 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM540.294 6.049c1.171 0 2.122.874 2.122 1.951s-.95 1.951-2.122 1.951c-1.171 0-2.122-.874-2.122-1.951s.95-1.951 2.122-1.951zM554.717 6.1c1.24 0 2.248.85 2.248 1.9 0 1.05-1.008 1.9-2.248 1.9-1.24 0-2.248-.85-2.248-1.9 0-1.05 1.008-1.9 2.248-1.9zM569.174 6.15c1.31 0 2.373.829 2.373 1.85 0 1.021-1.063 1.85-2.373 1.85-1.31 0-2.374-.828-2.374-1.85 0-1.021 1.063-1.85 2.373-1.85zM583.938 6.2c1.378 0 2.498.806 2.498 1.8s-1.12 1.8-2.498 1.8c-1.38 0-2.499-.806-2.499-1.8s1.12-1.8 2.499-1.8zM598.964 6.25c1.448 0 2.624.784 2.624 1.75s-1.176 1.75-2.624 1.75c-1.448 0-2.624-.784-2.624-1.75s1.176-1.75 2.624-1.75zM614.18 6.3c1.517 0 2.75.762 2.75 1.7s-1.234 1.7-2.75 1.7-2.75-.762-2.75-1.7 1.233-1.7 2.75-1.7zM629.534 6.35c1.587 0 2.875.74 2.875 1.65 0 .91-1.288 1.65-2.875 1.65-1.586 0-2.874-.74-2.874-1.65 0-.91 1.289-1.65 2.875-1.65zM644.992 6.4c1.656 0 3 .717 3 1.6 0 .883-1.344 1.6-3 1.6-1.655 0-3-.717-3-1.6 0-.883 1.345-1.6 3-1.6zM660.532 6.343c1.578 0 2.858.742 2.858 1.657s-1.28 1.657-2.858 1.657c-1.577 0-2.857-.742-2.857-1.657s1.28-1.657 2.857-1.657zM676.138 6.286c1.498 0 2.714.768 2.714 1.714s-1.216 1.714-2.714 1.714-2.714-.768-2.714-1.714 1.216-1.714 2.714-1.714zM691.798 6.229c1.419 0 2.571.793 2.571 1.771 0 .978-1.152 1.771-2.571 1.771-1.42 0-2.572-.793-2.572-1.771 0-.978 1.152-1.771 2.572-1.771zM707.503 6.171c1.34 0 2.428.82 2.428 1.829 0 1.01-1.088 1.829-2.428 1.829-1.34 0-2.429-.82-2.429-1.829 0-1.01 1.088-1.829 2.429-1.829zM723.247 6.114c1.261 0 2.285.845 2.285 1.886 0 1.04-1.024 1.886-2.285 1.886-1.262 0-2.287-.846-2.287-1.886s1.024-1.886 2.286-1.886zM739.024 6.057c1.183 0 2.143.87 2.143 1.943 0 1.072-.96 1.943-2.143 1.943-1.182 0-2.143-.87-2.143-1.943 0-1.072.96-1.943 2.143-1.943zM754.831 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM770.665 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM786.521 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM802.399 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM818.295 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM834.21 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM850.139 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM866.083 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM882.04 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM898.01 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM913.993 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM929.985 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM945.988 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4zM962 6a2.001 2.001 0 0 1 0 4 2.001 2.001 0 0 1 0-4z"/>
+</svg>

--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -2,16 +2,17 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 %endif
 
 :root {
   --tab-toolbar-navbar-overlap: 1px;
   --tab-min-height: 33px;
+  --tab-loading-fill: #0A84FF;
 }
 
 :root[uidensity=compact] {
   --tab-min-height: 29px;
 }
 
 :root[uidensity=touch] {
   --tab-min-height: 41px;
@@ -57,43 +58,99 @@
 .tab-throbber,
 .tab-icon-image,
 .tab-sharing-icon-overlay,
 .tab-icon-sound,
 .tab-close-button {
   margin-top: 1px;
 }
 
-.tab-throbber,
+.tab-throbber[busy] {
+  position: relative;
+  overflow: hidden;
+  width: 16px;
+  height: 16px;
+}
+
+.tab-throbber[busy]::before {
+  content: "";
+  position: absolute;
+  background-image: url("chrome://browser/skin/tabbrowser/loading.svg");
+  background-position: left center;
+  background-repeat: no-repeat;
+  width: 960px;
+  height: 100%;
+  animation: tab-throbber-animation 1.05s steps(60) infinite;
+  -moz-context-properties: fill;
+
+  /* XXX: It would be nice to transition between the "connecting" color and the
+     "loading" color (see the `.tab-throbber[progress]::before` rule below);
+     however, that currently forces main thread painting. When this is fixed
+     (after WebRender lands), we can do something like
+     `transition: fill 0.333s, opacity 0.333s;` */
+
+  fill: currentColor;
+  opacity: 0.7;
+}
+
+@keyframes tab-throbber-animation {
+  100% { transform: translateX(-100%); }
+}
+
+.tab-throbber[progress]::before {
+  fill: var(--tab-loading-fill);
+  opacity: 1;
+}
+
 .tab-sharing-icon-overlay,
 .tab-icon-image {
   height: 16px;
   width: 16px;
 }
 
 .tab-throbber:not([pinned]),
 .tab-sharing-icon-overlay:not([pinned]),
 .tab-icon-image:not([pinned]) {
-  margin-inline-end: 6px;
+  margin-inline-end: -16px;
 }
 
 .tab-icon-image {
   list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");
 }
 
 .tab-icon-image[src^="chrome://"] {
   -moz-context-properties: fill;
   fill: currentColor;
 }
 
+.tab-icon-image:not([busy]) {
+  /* This is an animation rather than a transition because the icon has
+     `display: none;` prior to this, making it impossible to fade it in via a
+     transition. */
+  animation: tab-icon-image-fade-in 0.333s;
+}
+
+@keyframes tab-icon-image-fade-in {
+  0% { opacity: 0; }
+  100% { opacity: 1; }
+}
+
 .tab-icon-image[sharing]:not([selected]),
 .tab-sharing-icon-overlay {
   animation: 3s linear tab-sharing-icon-pulse infinite;
 }
 
+.tab-label-container {
+  padding-inline-start: 22px;
+}
+
+.tab-icon-image:not([src]):not([busy]):not([pinned]) ~ .tab-label-container {
+  padding-inline-start: 0;
+}
+
 /* This should remain identical to identity-box-sharing-icon-pulse in identity-block.inc.css */
 @keyframes tab-sharing-icon-pulse {
   0%, 16.66%, 83.33%, 100% {
     opacity: 0;
   }
   33.33%, 66.66% {
     opacity: 1;
   }
@@ -174,24 +231,16 @@
   list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted");
 }
 
 #TabsToolbar[brighttext] .tab-icon-overlay[activemedia-blocked]:not([crashed]):not([selected]):not(:hover),
 .tab-icon-overlay[activemedia-blocked][selected]:-moz-lwtheme-brighttext:not(:hover) {
   list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-blocked");
 }
 
-.tab-throbber[busy] {
-  list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png");
-}
-
-.tab-throbber[progress] {
-  list-style-image: url("chrome://global/skin/icons/loading.png");
-}
-
 .tab-label {
   margin-inline-end: 0;
   margin-inline-start: 0;
 }
 
 .tab-close-button {
   margin-inline-start: 1px;
   margin-inline-end: -2px;
@@ -442,26 +491,16 @@
 #TabsToolbar > toolbarpaletteitem > #new-tab-button {
   list-style-image: url(chrome://browser/skin/tabbrowser/newtab.svg);
 }
 
 .tabs-newtab-button {
   width: 36px;
 }
 
-@media (min-resolution: 1.1dppx) {
-  .tab-throbber[busy] {
-    list-style-image: url("chrome://browser/skin/tabbrowser/connecting@2x.png");
-  }
-
-  .tab-throbber[progress] {
-    list-style-image: url("chrome://global/skin/icons/loading@2x.png");
-  }
-}
-
 /* All tabs button and menupopup */
 
 #alltabs-button {
   list-style-image: url(chrome://browser/skin/arrow-dropdown-16.svg);
 }
 
 .alltabs-item > .menu-iconic-left > .menu-iconic-icon {
   list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg");