diff --git a/src/renderer/components/card/card-rows.tsx b/src/renderer/components/card/card-rows.tsx
index 4b1576b4..9cf2e144 100644
--- a/src/renderer/components/card/card-rows.tsx
+++ b/src/renderer/components/card/card-rows.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { generatePath } from 'react-router';
 import { Link } from 'react-router-dom';
 import styled from 'styled-components';
-import { Album, AlbumArtist, Artist } from '/@/renderer/api/types';
+import { Album, AlbumArtist, Artist, Playlist } from '/@/renderer/api/types';
 import { Text } from '/@/renderer/components/text';
 import { AppRoute } from '/@/renderer/router/routes';
 import { CardRow } from '/@/renderer/types';
@@ -213,3 +213,28 @@ export const ALBUMARTIST_CARD_ROWS: { [key: string]: CardRow<AlbumArtist> } = {
         property: 'songCount',
     },
 };
+
+export const PLAYLIST_CARD_ROWS: { [key: string]: CardRow<Playlist> } = {
+    duration: {
+        property: 'duration',
+    },
+    name: {
+        property: 'name',
+        route: {
+            route: AppRoute.PLAYLISTS_DETAIL,
+            slugs: [{ idProperty: 'id', slugProperty: 'playlistId' }],
+        },
+    },
+    owner: {
+        property: 'owner',
+    },
+    public: {
+        property: 'public',
+    },
+    songCount: {
+        property: 'songCount',
+    },
+    updatedAt: {
+        property: 'songCount',
+    },
+};
diff --git a/src/renderer/components/virtual-grid/grid-card/grid-card-controls.tsx b/src/renderer/components/virtual-grid/grid-card/grid-card-controls.tsx
index 70c21252..b9058695 100644
--- a/src/renderer/components/virtual-grid/grid-card/grid-card-controls.tsx
+++ b/src/renderer/components/virtual-grid/grid-card/grid-card-controls.tsx
@@ -9,9 +9,10 @@ import { usePlayButtonBehavior } from '/@/renderer/store/settings.store';
 import { LibraryItem } from '/@/renderer/api/types';
 import { useHandleGeneralContextMenu } from '/@/renderer/features/context-menu/hooks/use-handle-context-menu';
 import {
+    PLAYLIST_CONTEXT_MENU_ITEMS,
     ALBUM_CONTEXT_MENU_ITEMS,
     ARTIST_CONTEXT_MENU_ITEMS,
-} from '/@/renderer/features/context-menu/context-menu-items';
+} from '../../../features/context-menu/context-menu-items';
 
 type PlayButtonType = UnstyledButtonProps & React.ComponentPropsWithoutRef<'button'>;
 
@@ -154,7 +155,11 @@ export const GridCardControls = ({
 
     const handleContextMenu = useHandleGeneralContextMenu(
         itemType,
-        itemType === LibraryItem.ALBUM ? ALBUM_CONTEXT_MENU_ITEMS : ARTIST_CONTEXT_MENU_ITEMS,
+        itemType === LibraryItem.ALBUM
+            ? ALBUM_CONTEXT_MENU_ITEMS
+            : itemType === LibraryItem.PLAYLIST
+            ? PLAYLIST_CONTEXT_MENU_ITEMS
+            : ARTIST_CONTEXT_MENU_ITEMS,
     );
 
     return (
@@ -168,22 +173,25 @@ export const GridCardControls = ({
                     <RiPlayFill size={25} />
                 </PlayButton>
                 <BottomControls>
-                    <SecondaryButton
-                        p={5}
-                        variant="subtle"
-                        onClick={(e) => handleFavorites(e, itemData?.serverId)}
-                    >
-                        <FavoriteWrapper isFavorite={itemData?.isFavorite}>
-                            {isFavorite ? (
-                                <RiHeartFill size={20} />
-                            ) : (
-                                <RiHeartLine
-                                    color="white"
-                                    size={20}
-                                />
-                            )}
-                        </FavoriteWrapper>
-                    </SecondaryButton>
+                    {itemType !== LibraryItem.PLAYLIST && (
+                        <SecondaryButton
+                            p={5}
+                            variant="subtle"
+                            onClick={(e) => handleFavorites(e, itemData?.serverId)}
+                        >
+                            <FavoriteWrapper isFavorite={itemData?.isFavorite}>
+                                {isFavorite ? (
+                                    <RiHeartFill size={20} />
+                                ) : (
+                                    <RiHeartLine
+                                        color="white"
+                                        size={20}
+                                    />
+                                )}
+                            </FavoriteWrapper>
+                        </SecondaryButton>
+                    )}
+
                     <SecondaryButton
                         p={5}
                         variant="subtle"
diff --git a/src/renderer/components/virtual-grid/grid-card/poster-card.tsx b/src/renderer/components/virtual-grid/grid-card/poster-card.tsx
index e0a1dcde..80dd0310 100644
--- a/src/renderer/components/virtual-grid/grid-card/poster-card.tsx
+++ b/src/renderer/components/virtual-grid/grid-card/poster-card.tsx
@@ -4,7 +4,7 @@ import { generatePath, useNavigate } from 'react-router-dom';
 import { SimpleImg } from 'react-simple-img';
 import { ListChildComponentProps } from 'react-window';
 import styled from 'styled-components';
-import { Album, AlbumArtist, Artist, LibraryItem } from '/@/renderer/api/types';
+import { Album, AlbumArtist, Artist, LibraryItem, Playlist } from '/@/renderer/api/types';
 import { CardRows } from '/@/renderer/components/card';
 import { Skeleton } from '/@/renderer/components/skeleton';
 import { GridCardControls } from '/@/renderer/components/virtual-grid/grid-card/grid-card-controls';
@@ -13,7 +13,7 @@ import { CardRow, PlayQueueAddOptions, Play, CardRoute } from '/@/renderer/types
 interface BaseGridCardProps {
     columnIndex: number;
     controls: {
-        cardRows: CardRow<Album | AlbumArtist | Artist>[];
+        cardRows: CardRow<Album | AlbumArtist | Artist | Playlist>[];
         handleFavorite: (options: {
             id: string[];
             isFavorite: boolean;