going hardcore SVG

https://github.com/jxnblk/loading

images/loading-spin.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="64" height="64" fill="silver">
+  <path opacity=".25" d="M16 0 A16 16 0 0 0 16 32 A16 16 0 0 0 16 0 M16 4 A12 12 0 0 1 16 28 A12 12 0 0 1 16 4"/>
+  <path d="M16 0 A16 16 0 0 1 32 16 L28 16 A12 12 0 0 0 16 4z">
+    <animateTransform attributeName="transform" type="rotate" from="0 16 16" to="360 16 16" dur="0.8s" repeatCount="indefinite" />
+  </path>
+</svg>

tabs/loading.css

@@ -2,7 +2,7 @@
     width: 100%;
     height: 100%;
 
-    background-image: url('../images/loading.gif');
+    background-image: url('../images/loading-spin.svg');
     background-repeat: no-repeat;
     background-position: center;
 }