diff --git a/src/remote/components/remote-container.tsx b/src/remote/components/remote-container.tsx
index 4566cd82e..a178f2a70 100644
--- a/src/remote/components/remote-container.tsx
+++ b/src/remote/components/remote-container.tsx
@@ -84,7 +84,7 @@ export const RemoteContainer = () => {
                     disabled={!id}
                     icon="favorite"
                     iconProps={{
-                        fill: song?.userFavorite ? 'primary' : 'default',
+                        fill: song?.userFavorite ? 'favorite' : 'default',
                     }}
                     onClick={() => {
                         if (!id) return;
diff --git a/src/renderer/components/item-card/item-card-controls.module.css b/src/renderer/components/item-card/item-card-controls.module.css
index 8684fa9ac..a1834165b 100644
--- a/src/renderer/components/item-card/item-card-controls.module.css
+++ b/src/renderer/components/item-card/item-card-controls.module.css
@@ -143,10 +143,6 @@
         opacity: 1;
         transform: scale(0.9);
     }
-
-    svg {
-        stroke: rgb(255 255 255);
-    }
 }
 
 .user-data {
diff --git a/src/renderer/components/item-card/item-card-controls.tsx b/src/renderer/components/item-card/item-card-controls.tsx
index 75539bcd7..e5e20f087 100644
--- a/src/renderer/components/item-card/item-card-controls.tsx
+++ b/src/renderer/components/item-card/item-card-controls.tsx
@@ -128,10 +128,10 @@ export const ItemCardControls = ({
                     icon="favorite"
                     iconProps={{
                         color: (item as { userFavorite: boolean }).userFavorite
-                            ? 'primary'
+                            ? 'favorite'
                             : 'default',
                         fill: (item as { userFavorite: boolean }).userFavorite
-                            ? 'primary'
+                            ? 'favorite'
                             : undefined,
                     }}
                     onClick={(e) => {
diff --git a/src/renderer/components/item-detail/item-detail.tsx b/src/renderer/components/item-detail/item-detail.tsx
index 50a1a1f5f..91956f744 100644
--- a/src/renderer/components/item-detail/item-detail.tsx
+++ b/src/renderer/components/item-detail/item-detail.tsx
@@ -109,7 +109,7 @@ export const ItemDetail = ({ data, itemType, onClick, withControls }: ItemDetail
                             <ActionIcon
                                 icon="favorite"
                                 iconProps={{
-                                    fill: data?.userFavorite ? 'primary' : 'default',
+                                    fill: data?.userFavorite ? 'favorite' : 'default',
                                 }}
                                 size="xs"
                             />
diff --git a/src/renderer/components/item-list/item-table-list/columns/favorite-column.tsx b/src/renderer/components/item-list/item-table-list/columns/favorite-column.tsx
index 34e0cabb6..53389e430 100644
--- a/src/renderer/components/item-list/item-table-list/columns/favorite-column.tsx
+++ b/src/renderer/components/item-list/item-table-list/columns/favorite-column.tsx
@@ -17,8 +17,8 @@ export const FavoriteColumn = (props: ItemTableListInnerColumn) => {
                     className={row ? undefined : 'hover-only'}
                     icon="favorite"
                     iconProps={{
-                        color: row ? 'primary' : 'muted',
-                        fill: row ? 'primary' : undefined,
+                        color: row ? 'favorite' : 'muted',
+                        fill: row ? 'favorite' : undefined,
                         size: 'md',
                     }}
                     onClick={(event) => {
diff --git a/src/renderer/features/albums/routes/dummy-album-detail-route.tsx b/src/renderer/features/albums/routes/dummy-album-detail-route.tsx
index 634c313dd..9f3ed90c2 100644
--- a/src/renderer/features/albums/routes/dummy-album-detail-route.tsx
+++ b/src/renderer/features/albums/routes/dummy-album-detail-route.tsx
@@ -168,7 +168,7 @@ const DummyAlbumDetailRoute = () => {
                             <ActionIcon
                                 icon="favorite"
                                 iconProps={{
-                                    fill: detailQuery?.data?.userFavorite ? 'primary' : undefined,
+                                    fill: detailQuery?.data?.userFavorite ? 'favorite' : undefined,
                                 }}
                                 loading={
                                     createFavoriteMutation.isPending ||
diff --git a/src/renderer/features/artists/components/album-artist-detail-content.tsx b/src/renderer/features/artists/components/album-artist-detail-content.tsx
index 614729a24..8982faa7f 100644
--- a/src/renderer/features/artists/components/album-artist-detail-content.tsx
+++ b/src/renderer/features/artists/components/album-artist-detail-content.tsx
@@ -235,7 +235,7 @@ export const AlbumArtistDetailContent = () => {
                         <ActionIcon
                             icon="favorite"
                             iconProps={{
-                                fill: detailQuery?.data?.userFavorite ? 'primary' : undefined,
+                                fill: detailQuery?.data?.userFavorite ? 'favorite' : undefined,
                             }}
                             onClick={handleFavorite}
                             size="lg"
diff --git a/src/renderer/features/player/components/mobile-fullscreen-player-metadata.tsx b/src/renderer/features/player/components/mobile-fullscreen-player-metadata.tsx
index 5630df629..a793b22cb 100644
--- a/src/renderer/features/player/components/mobile-fullscreen-player-metadata.tsx
+++ b/src/renderer/features/player/components/mobile-fullscreen-player-metadata.tsx
@@ -69,7 +69,7 @@ export const MobileFullscreenPlayerMetadata = memo(
                     <ActionIcon
                         icon="favorite"
                         iconProps={{
-                            fill: isFavorite ? 'primary' : undefined,
+                            fill: isFavorite ? 'favorite' : undefined,
                             size: 'md',
                         }}
                         onClick={onToggleFavorite}
diff --git a/src/renderer/features/player/components/right-controls.tsx b/src/renderer/features/player/components/right-controls.tsx
index 9bf6400d4..83d3b5c77 100644
--- a/src/renderer/features/player/components/right-controls.tsx
+++ b/src/renderer/features/player/components/right-controls.tsx
@@ -209,7 +209,7 @@ export const RightControls = () => {
                 <ActionIcon
                     icon="favorite"
                     iconProps={{
-                        fill: currentSong?.userFavorite ? 'primary' : undefined,
+                        fill: currentSong?.userFavorite ? 'favorite' : undefined,
                         size: 'lg',
                     }}
                     onClick={(e) => {