diff --git a/views/src/components/sub-components/AppChatButton.vue b/views/src/components/sub-components/AppChatButton.vue
index 4367e96..dcead92 100644
--- a/views/src/components/sub-components/AppChatButton.vue
+++ b/views/src/components/sub-components/AppChatButton.vue
@@ -10,6 +10,7 @@
         <small>Chat</small>
       </span>
     </span>
+    <audio src="static/new-message-tone.mp3" hidden preload="auto" ref="audio"></audio>
   </v-btn>
 </template>
 
@@ -20,9 +21,15 @@
       return {
         newMessages: 0,
         intervalHandler: null,
-        pageDefaultTitle: document.title
+        pageDefaultTitle: document.title,
+        audioLoaded: false
       }
     },
+    mounted() {
+      this.$refs.audio.addEventListener("canplaythrough", () => {
+        this.audioLoaded = true;
+      });
+    },
     methods: {
       nullifyMessages() {
         if (this.newMessages > 0) {
@@ -35,6 +42,10 @@
     },
     sockets: {
       chat_message(m) {
+        if (!document.hasFocus() && this.audioLoaded) {
+          this.$refs.audio.play();
+        }
+
         if (this.$router.history.current.name === 'AppChat') {
           return;
         }
diff --git a/views/static/new-message-tone.mp3 b/views/static/new-message-tone.mp3
new file mode 100644
index 0000000..2891c62
Binary files /dev/null and b/views/static/new-message-tone.mp3 differ