diff --git a/frontend/src/components/VolumeIcon.tsx b/frontend/src/components/VolumeIcon.tsx
index ea6ecb773a..034f127057 100644
--- a/frontend/src/components/VolumeIcon.tsx
+++ b/frontend/src/components/VolumeIcon.tsx
@@ -3,13 +3,15 @@ import { IoMdVolumeHigh, IoMdVolumeOff } from "react-icons/io";
 import beep from "#/utils/beep";
 
 function VolumeIcon(): JSX.Element {
-  const [isMuted, setIsMuted] = useState(true);
+  const [isMuted, setIsMuted] = useState(
+    document.cookie.indexOf("audio") === -1,
+  );
 
   const toggleMute = () => {
     const cookieName = "audio";
     setIsMuted(!isMuted);
     if (!isMuted) {
-      document.cookie = `${cookieName}=;`;
+      document.cookie = `${cookieName}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
     } else {
       document.cookie = `${cookieName}=on;`;
       beep();