diff --git a/front/src/components/playlist/Card.vue b/front/src/components/playlist/Card.vue
index 201937a62..2eb64775f 100644
--- a/front/src/components/playlist/Card.vue
+++ b/front/src/components/playlist/Card.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import Card from '~/components/ui/Card.vue'
-import PlayButton from '~/components/ui/button/Play.vue'
+import PlayButton from '~/components/audio/PlayButton.vue'
 import OptionsButton from '~/components/ui/button/Options.vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
@@ -51,7 +51,11 @@ if (import.meta.env.PROD) {
       />
     </template>
 
-    <PlayButton @play="play(playlist)" />
+    <PlayButton
+        :icon-only="true"
+        :is-playable="playlist.is_playable"
+        :playlist="playlist"
+      />
 
     <a
       class="funkwhale link"