diff --git a/web/src/components/card/ExportCard.tsx b/web/src/components/card/ExportCard.tsx
index 021524532..a7f5e7657 100644
--- a/web/src/components/card/ExportCard.tsx
+++ b/web/src/components/card/ExportCard.tsx
@@ -1,9 +1,8 @@
 import ActivityIndicator from "../indicators/activity-indicator";
-import { LuTrash } from "react-icons/lu";
 import { Button } from "../ui/button";
 import { useCallback, useState } from "react";
-import { isDesktop, isMobile } from "react-device-detect";
-import { FaDownload, FaPlay, FaShareAlt } from "react-icons/fa";
+import { isMobile } from "react-device-detect";
+import { FiMoreVertical } from "react-icons/fi";
 import { Skeleton } from "../ui/skeleton";
 import {
   Dialog,
@@ -15,15 +14,19 @@ import {
 import { Input } from "../ui/input";
 import useKeyboardListener from "@/hooks/use-keyboard-listener";
 import { DeleteClipType, Export } from "@/types/export";
-import { MdEditSquare } from "react-icons/md";
 import { baseUrl } from "@/api/baseUrl";
 import { cn } from "@/lib/utils";
 import { shareOrCopy } from "@/utils/browserUtil";
 import { useTranslation } from "react-i18next";
 import { ImageShadowOverlay } from "../overlay/ImageShadowOverlay";
 import BlurredIconButton from "../button/BlurredIconButton";
-import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip";
 import { useIsAdmin } from "@/hooks/use-is-admin";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "../ui/dropdown-menu";
 
 type ExportProps = {
   className: string;
@@ -42,7 +45,6 @@ export default function ExportCard({
 }: ExportProps) {
   const { t } = useTranslation(["views/exports"]);
   const isAdmin = useIsAdmin();
-  const [hovered, setHovered] = useState(false);
   const [loading, setLoading] = useState(
     exportedRecording.thumb_path.length > 0,
   );
@@ -136,12 +138,14 @@ export default function ExportCard({
 
       <div
         className={cn(
-          "relative flex aspect-video items-center justify-center rounded-lg bg-black md:rounded-2xl",
+          "relative flex aspect-video cursor-pointer items-center justify-center rounded-lg bg-black md:rounded-2xl",
           className,
         )}
-        onMouseEnter={isDesktop ? () => setHovered(true) : undefined}
-        onMouseLeave={isDesktop ? () => setHovered(false) : undefined}
-        onClick={isDesktop ? undefined : () => setHovered(!hovered)}
+        onClick={() => {
+          if (!exportedRecording.in_progress) {
+            onSelect(exportedRecording);
+          }
+        }}
       >
         {exportedRecording.in_progress ? (
           <ActivityIndicator />
@@ -158,95 +162,76 @@ export default function ExportCard({
             )}
           </>
         )}
-        {hovered && (
-          <>
-            <div className="absolute inset-0 rounded-lg bg-black bg-opacity-60 md:rounded-2xl" />
-            <div className="absolute right-3 top-2">
-              <div className="flex items-center justify-center gap-4">
-                {!exportedRecording.in_progress && (
-                  <Tooltip>
-                    <TooltipTrigger asChild>
-                      <BlurredIconButton
-                        onClick={() =>
-                          shareOrCopy(
-                            `${baseUrl}export?id=${exportedRecording.id}`,
-                            exportedRecording.name.replaceAll("_", " "),
-                          )
-                        }
-                      >
-                        <FaShareAlt className="size-4" />
-                      </BlurredIconButton>
-                    </TooltipTrigger>
-                    <TooltipContent>{t("tooltip.shareExport")}</TooltipContent>
-                  </Tooltip>
-                )}
-                {!exportedRecording.in_progress && (
+        {!exportedRecording.in_progress && (
+          <div className="absolute bottom-2 right-3 z-40">
+            <DropdownMenu>
+              <DropdownMenuTrigger>
+                <BlurredIconButton
+                  aria-label={t("tooltip.editName")}
+                  onClick={(e) => e.stopPropagation()}
+                >
+                  <FiMoreVertical className="size-5" />
+                </BlurredIconButton>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent align="end">
+                <DropdownMenuItem
+                  className="cursor-pointer"
+                  aria-label={t("tooltip.shareExport")}
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    shareOrCopy(
+                      `${baseUrl}export?id=${exportedRecording.id}`,
+                      exportedRecording.name.replaceAll("_", " "),
+                    );
+                  }}
+                >
+                  {t("tooltip.shareExport")}
+                </DropdownMenuItem>
+                <DropdownMenuItem
+                  className="cursor-pointer"
+                  aria-label={t("tooltip.downloadVideo")}
+                >
                   <a
                     download
                     href={`${baseUrl}${exportedRecording.video_path.replace("/media/frigate/", "")}`}
+                    onClick={(e) => e.stopPropagation()}
                   >
-                    <Tooltip>
-                      <TooltipTrigger asChild>
-                        <BlurredIconButton>
-                          <FaDownload className="size-4" />
-                        </BlurredIconButton>
-                      </TooltipTrigger>
-                      <TooltipContent>
-                        {t("tooltip.downloadVideo")}
-                      </TooltipContent>
-                    </Tooltip>
+                    {t("tooltip.downloadVideo")}
                   </a>
-                )}
-                {isAdmin && !exportedRecording.in_progress && (
-                  <Tooltip>
-                    <TooltipTrigger asChild>
-                      <BlurredIconButton
-                        onClick={() =>
-                          setEditName({
-                            original: exportedRecording.name,
-                            update: undefined,
-                          })
-                        }
-                      >
-                        <MdEditSquare className="size-4" />
-                      </BlurredIconButton>
-                    </TooltipTrigger>
-                    <TooltipContent>{t("tooltip.editName")}</TooltipContent>
-                  </Tooltip>
+                </DropdownMenuItem>
+                {isAdmin && (
+                  <DropdownMenuItem
+                    className="cursor-pointer"
+                    aria-label={t("tooltip.editName")}
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      setEditName({
+                        original: exportedRecording.name,
+                        update: undefined,
+                      });
+                    }}
+                  >
+                    {t("tooltip.editName")}
+                  </DropdownMenuItem>
                 )}
                 {isAdmin && (
-                  <Tooltip>
-                    <TooltipTrigger asChild>
-                      <BlurredIconButton
-                        onClick={() =>
-                          onDelete({
-                            file: exportedRecording.id,
-                            exportName: exportedRecording.name,
-                          })
-                        }
-                      >
-                        <LuTrash className="size-4 fill-destructive text-destructive hover:text-white" />
-                      </BlurredIconButton>
-                    </TooltipTrigger>
-                    <TooltipContent>{t("tooltip.deleteExport")}</TooltipContent>
-                  </Tooltip>
+                  <DropdownMenuItem
+                    className="cursor-pointer"
+                    aria-label={t("tooltip.deleteExport")}
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      onDelete({
+                        file: exportedRecording.id,
+                        exportName: exportedRecording.name,
+                      });
+                    }}
+                  >
+                    {t("tooltip.deleteExport")}
+                  </DropdownMenuItem>
                 )}
-              </div>
-            </div>
-
-            {!exportedRecording.in_progress && (
-              <Button
-                className="absolute left-1/2 top-1/2 h-20 w-20 -translate-x-1/2 -translate-y-1/2 cursor-pointer text-white hover:bg-transparent hover:text-white"
-                aria-label={t("button.play", { ns: "common" })}
-                variant="ghost"
-                onClick={() => {
-                  onSelect(exportedRecording);
-                }}
-              >
-                <FaPlay />
-              </Button>
-            )}
-          </>
+              </DropdownMenuContent>
+            </DropdownMenu>
+          </div>
         )}
         {loading && (
           <Skeleton className="absolute inset-0 aspect-video rounded-lg md:rounded-2xl" />