diff --git a/src/components/upload-file/UploadFileCard.vue b/src/components/upload-file/UploadFileCard.vue
index c8642d66..09f0b23e 100644
--- a/src/components/upload-file/UploadFileCard.vue
+++ b/src/components/upload-file/UploadFileCard.vue
@@ -48,7 +48,7 @@ onMounted(() => {
 </script>
 <template>
   <div
-    class="bordered rounded row items-center q-pa-md"
+    class="bordered rounded row items-center q-pa-md card"
     :class="{ 'cursor-pointer': clickable }"
     @click="$emit('click')"
   >
@@ -91,3 +91,9 @@ onMounted(() => {
     />
   </div>
 </template>
+<style scoped>
+.card:hover {
+  transition: ease-in-out 0.3s;
+  background: hsla(var(--info-bg) / 0.05);
+}
+</style>