diff --git a/web-src/package-lock.json b/web-src/package-lock.json
index 2e33854696..73efcaa31a 100644
--- a/web-src/package-lock.json
+++ b/web-src/package-lock.json
@@ -8,6 +8,7 @@
       "name": "owntone-web",
       "version": "0.0.0",
       "dependencies": {
+        "@aacassandra/vue3-progressbar": "^1.0.3",
         "axios": "^0.24.0",
         "moment": "^2.29.1",
         "reconnectingwebsocket": "^1.0.0",
@@ -22,6 +23,15 @@
         "vite": "^2.7.2"
       }
     },
+    "node_modules/@aacassandra/vue3-progressbar": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@aacassandra/vue3-progressbar/-/vue3-progressbar-1.0.3.tgz",
+      "integrity": "sha512-e4SlgYwXiNABJbHYOChs3aSiCyR+1D6WAjWR1zo3vCs/9k6Vjj2GIPXWNJA/YP4RhlQS4eSC3RtCPC95CfAEbw==",
+      "dependencies": {
+        "core-js": "^3.6.5",
+        "vue": "^3.0.0"
+      }
+    },
     "node_modules/@babel/parser": {
       "version": "7.16.6",
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.16.6.tgz",
@@ -161,6 +171,16 @@
         "follow-redirects": "^1.14.4"
       }
     },
+    "node_modules/core-js": {
+      "version": "3.20.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.20.1.tgz",
+      "integrity": "sha512-btdpStYFQScnNVQ5slVcr858KP0YWYjV16eGJQw8Gg7CWtu/2qNvIM3qVRIR3n1pK2R9NNOrTevbvAYxajwEjg==",
+      "hasInstallScript": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/core-js"
+      }
+    },
     "node_modules/csstype": {
       "version": "2.6.19",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.19.tgz",
@@ -676,6 +696,15 @@
     }
   },
   "dependencies": {
+    "@aacassandra/vue3-progressbar": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@aacassandra/vue3-progressbar/-/vue3-progressbar-1.0.3.tgz",
+      "integrity": "sha512-e4SlgYwXiNABJbHYOChs3aSiCyR+1D6WAjWR1zo3vCs/9k6Vjj2GIPXWNJA/YP4RhlQS4eSC3RtCPC95CfAEbw==",
+      "requires": {
+        "core-js": "^3.6.5",
+        "vue": "^3.0.0"
+      }
+    },
     "@babel/parser": {
       "version": "7.16.6",
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.16.6.tgz",
@@ -800,6 +829,11 @@
         "follow-redirects": "^1.14.4"
       }
     },
+    "core-js": {
+      "version": "3.20.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.20.1.tgz",
+      "integrity": "sha512-btdpStYFQScnNVQ5slVcr858KP0YWYjV16eGJQw8Gg7CWtu/2qNvIM3qVRIR3n1pK2R9NNOrTevbvAYxajwEjg=="
+    },
     "csstype": {
       "version": "2.6.19",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.19.tgz",
diff --git a/web-src/package.json b/web-src/package.json
index 47c8d823c0..e5c324d1aa 100644
--- a/web-src/package.json
+++ b/web-src/package.json
@@ -7,6 +7,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@aacassandra/vue3-progressbar": "^1.0.3",
     "axios": "^0.24.0",
     "moment": "^2.29.1",
     "reconnectingwebsocket": "^1.0.0",
diff --git a/web-src/src/main.js b/web-src/src/main.js
index 75bd7675bc..fdbbf6be68 100644
--- a/web-src/src/main.js
+++ b/web-src/src/main.js
@@ -1,7 +1,13 @@
 import { createApp } from 'vue'
 import store from './store'
+import VueProgressBar from '@aacassandra/vue3-progressbar'
 import App from './App.vue'
 
 createApp(App)
   .use(store)
+  .use(VueProgressBar, {
+    color: 'hsl(204, 86%, 53%)',
+    failedColor: 'red',
+    height: '1px'
+  })
   .mount('#app')
diff --git a/web-src/src/progress/index.js b/web-src/src/progress/index.js
deleted file mode 100644
index a080b37185..0000000000
--- a/web-src/src/progress/index.js
+++ /dev/null
@@ -1,8 +0,0 @@
-import Vue from 'vue'
-import VueProgressBar from 'vue-progressbar'
-
-Vue.use(VueProgressBar, {
-  color: 'hsl(204, 86%, 53%)',
-  failedColor: 'red',
-  height: '1px'
-})