diff --git a/web-src/src/components/PlayerButtonSkipBack.vue b/web-src/src/components/PlayerButtonSkipBack.vue
new file mode 100644
index 00000000..7672b931
--- /dev/null
+++ b/web-src/src/components/PlayerButtonSkipBack.vue
@@ -0,0 +1,25 @@
+<template>
+  <a v-on:click="play_skip_back">
+    <span class="icon"><i class="mdi mdi-replay"></i></span>
+  </a>
+</template>
+
+<script>
+import webapi from '@/webapi'
+
+export default {
+  name: 'PlayerButtonSkipBack',
+  props: [ 'when_ms' ],
+
+  methods: {
+    play_skip_back: function () {
+      if (this.$store.state.player.state !== 'stop') {
+        webapi.player_seek(this.when_ms - 10000)
+      }
+    }
+  }
+}
+</script>
+
+<style>
+</style>
diff --git a/web-src/src/components/PlayerButtonSkipFwd.vue b/web-src/src/components/PlayerButtonSkipFwd.vue
new file mode 100644
index 00000000..9d5d9b5c
--- /dev/null
+++ b/web-src/src/components/PlayerButtonSkipFwd.vue
@@ -0,0 +1,25 @@
+<template>
+  <a v-on:click="play_skip_fwd">
+    <span class="icon"><i class="mdi mdi-flip-h mdi-replay"></i></span>
+  </a>
+</template>
+
+<script>
+import webapi from '@/webapi'
+
+export default {
+  name: 'PlayerButtonSkipFwd',
+  props: [ 'when_ms' ],
+
+  methods: {
+    play_skip_fwd: function () {
+      if (this.$store.state.player.state !== 'stop') {
+        webapi.player_seek(this.when_ms + 10000)
+      }
+    }
+  }
+}
+</script>
+
+<style>
+</style>