diff --git a/resources/assets/img/bars.gif b/resources/assets/img/bars.gif
new file mode 100644
index 00000000..c5535f50
Binary files /dev/null and b/resources/assets/img/bars.gif differ
diff --git a/resources/assets/js/components/shared/sound-bar.vue b/resources/assets/js/components/shared/sound-bar.vue
index be8ce557..253cc896 100644
--- a/resources/assets/js/components/shared/sound-bar.vue
+++ b/resources/assets/js/components/shared/sound-bar.vue
@@ -1,6 +1,6 @@
 <template>
   <div id="bars">
-    <div class="bar" v-for="n in 5"/>
+    <img src="/public/img/bars.gif" alt="Sound bars" height="13" width="auto">
   </div>
 </template>
 
@@ -46,40 +46,11 @@ export default {
 </script>
 
 <style lang="sass">
-// Some fancy bars for an eye-candy effect.
-// Credits: http://codepen.io/johnheiner/pen/JdRybK and http://codepen.io/jackrugile/pres/CkAbG
-@keyframes sound {
-  0% {
-    opacity: .15;
-    height: 1px;
-  }
-  100% {
-    opacity: 1;
-    height: 13px;
-  }
-}
-
 #bars {
   width: 28px;
   height: 13px;
   position: relative;
   display: inline-block;
   backface-visibility: hidden;
-
-  .bar {
-    background: #666;
-    bottom: 1px;
-    position: absolute;
-    width: 3px;
-    animation: sound 0ms -800ms linear infinite alternate;
-    backface-visibility: hidden;
-    will-change: opacity, height;
-  }
-
-  .bar:nth-child(1)  { left: 1px; background: #754fa0; animation-duration: 474ms; }
-  .bar:nth-child(2)  { left: 5px; background: #09b7bf; animation-duration: 433ms; }
-  .bar:nth-child(3)  { left: 9px; background: #90d36b; animation-duration: 407ms; }
-  .bar:nth-child(4)  { left: 13px; background: #ed1b72; animation-duration: 458ms; }
-  .bar:nth-child(5)  { left: 17px; background: #f2d40d; animation-duration: 400ms; }
 }
 </style>