diff --git a/components/product/ProductCard/ProductCard.module.css b/components/product/ProductCard/ProductCard.module.css
index b18182916..d5d441fea 100644
--- a/components/product/ProductCard/ProductCard.module.css
+++ b/components/product/ProductCard/ProductCard.module.css
@@ -47,13 +47,15 @@
 }
 
 .header .name {
-  @apply pt-0 max-w-full w-full leading-extra-loose;
+  @apply pt-0 max-w-full w-full leading-extra-loose
+  transition-colors ease-in-out duration-500;
   font-size: 2rem;
   letter-spacing: 0.4px;
 }
 
 .header .name span {
-  @apply py-4 px-6 bg-primary text-primary font-bold;
+  @apply py-4 px-6 bg-primary text-primary font-bold
+  transition-colors ease-in-out duration-500;
   font-size: inherit;
   letter-spacing: inherit;
   box-decoration-break: clone;
@@ -62,7 +64,8 @@
 
 .header .price {
   @apply pt-2 px-6 pb-4 text-sm bg-primary text-accent-9
-  font-semibold inline-block tracking-wide;
+  font-semibold inline-block tracking-wide
+  transition-colors ease-in-out duration-500;
 }
 
 .imageContainer {