diff --git a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html
index 8f560bc..e364147 100644
--- a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html
+++ b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.html
@@ -58,7 +58,7 @@
           )
         "
       ></app-btn-large>
-      <div class="btn-small">
+      <div class="favorite-img">
         <img
           [class.red]="currentUserLikedCurrentMovie"
           src="./../../../../assets/img/favorite.svg"
diff --git a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss
index 1570c83..b95f6bf 100644
--- a/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss
+++ b/frontend/src/app/components/home/browse/hero-banner/hero-banner.component.scss
@@ -85,7 +85,7 @@ section {
   justify-content: left;
   width: 100%;
   gap: 12px;
-  .btn-small {
+  .favorite-img {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -101,10 +101,14 @@ section {
         filter: brightness(0) saturate(100%) invert(18%) sepia(98%)
           saturate(7267%) hue-rotate(342deg) brightness(94%) contrast(119%);
       }
+      .red {
+        filter: brightness(0) saturate(100%) invert(9%) sepia(96%)
+          saturate(7415%) hue-rotate(248deg) brightness(90%) contrast(144%);
+      }
     }
     img {
-      width: 28px;
-      height: 28px;
+      width: 24px;
+      height: 24px;
     }
   }
 }