diff --git a/web-src/src/pages/SettingsPageOnlineServices.vue b/web-src/src/pages/SettingsPageOnlineServices.vue
index 1658794d..e0acd981 100644
--- a/web-src/src/pages/SettingsPageOnlineServices.vue
+++ b/web-src/src/pages/SettingsPageOnlineServices.vue
@@ -67,6 +67,11 @@
               Access to the Spotify Web API enables scanning of your Spotify library. Required scopes are
               <code>{{ spotify_required_scope | join }}</code>.
             </p>
+            <div v-if="spotify.webapi_token_valid" class="field fd-has-margin-top ">
+              <div class="control">
+                <a class="button is-danger" @click="logout_spotify">Logout</a>
+              </div>
+            </div>
           </div>
         </div>
       </template>
@@ -141,7 +146,7 @@ export default {
     },
 
     spotify_required_scope () {
-      if (this.spotify.webapi_token_valid && this.spotify.webapi_granted_scope && this.spotify.webapi_required_scope) {
+      if (this.spotify.webapi_required_scope) {
         return this.spotify.webapi_required_scope.split(' ')
       }
       return []
@@ -176,6 +181,10 @@ export default {
       })
     },
 
+    logout_spotify () {
+      webapi.spotify_logout()
+    },
+
     login_lastfm () {
       webapi.lastfm_login(this.lastfm_login).then(response => {
         this.lastfm_login.user = ''
diff --git a/web-src/src/webapi/index.js b/web-src/src/webapi/index.js
index 3ee2a98d..bc14b78e 100644
--- a/web-src/src/webapi/index.js
+++ b/web-src/src/webapi/index.js
@@ -356,6 +356,10 @@ export default {
     return axios.post('./api/spotify-login', credentials)
   },
 
+  spotify_logout () {
+    return axios.get('./api/spotify-logout')
+  },
+
   lastfm () {
     return axios.get('./api/lastfm')
   },