diff --git a/src/lib/cards/ButtonCard/ButtonCard.svelte b/src/lib/cards/ButtonCard/ButtonCard.svelte
index 429057f..bc7acc1 100644
--- a/src/lib/cards/ButtonCard/ButtonCard.svelte
+++ b/src/lib/cards/ButtonCard/ButtonCard.svelte
@@ -14,7 +14,7 @@
 		class={cn(
 			'text-base-950 dark:text-base-50 line-clamp-1 inline-flex items-center justify-center px-4 text-2xl font-semibold',
 			item.color === 'transparent'
-				? 'bg-accent-500 dark:text-base-950 rounded-2xl px-5 py-2.5 text-xl'
+				? 'bg-accent-400 dark:bg-accent-500 hover:bg-accent-400 dark:text-base-950 rounded-2xl px-5 py-2.5 text-xl transition-colors duration-100'
 				: ''
 		)}
 	>
diff --git a/src/lib/cards/ButtonCard/EditingButtonCard.svelte b/src/lib/cards/ButtonCard/EditingButtonCard.svelte
index 62c3764..6ef4c1e 100644
--- a/src/lib/cards/ButtonCard/EditingButtonCard.svelte
+++ b/src/lib/cards/ButtonCard/EditingButtonCard.svelte
@@ -16,7 +16,7 @@
 		class={cn(
 			'line-clamp-1 text-center text-2xl font-semibold',
 			item.color === 'transparent'
-				? 'bg-accent-500 dark:text-base-950 rounded-2xl px-5 py-2.5 text-xl'
+				? 'bg-accent-400 dark:bg-accent-500 hover:bg-accent-400 dark:text-base-950 rounded-2xl px-5 py-2.5 text-xl transition-colors duration-100'
 				: ''
 		)}
 	/>