diff --git a/src/frontend/src/icons/JigsawStack/JigsawStackIcon.jsx b/src/frontend/src/icons/JigsawStack/JigsawStackIcon.jsx
index 26a404fc7..363b76fcf 100644
--- a/src/frontend/src/icons/JigsawStack/JigsawStackIcon.jsx
+++ b/src/frontend/src/icons/JigsawStack/JigsawStackIcon.jsx
@@ -9,7 +9,7 @@ const JigsawStackIconSVG = ({ isdark, ...props }) => (
   >
     <path
       fill={
-        isdark
+        stringToBool(isdark)
           ? "url(#paint0_linear_102_21_dark)"
           : "url(#paint0_linear_102_21)"
       }
diff --git a/src/frontend/src/icons/JigsawStack/index.tsx b/src/frontend/src/icons/JigsawStack/index.tsx
index 1da99f0d1..f7af942aa 100644
--- a/src/frontend/src/icons/JigsawStack/index.tsx
+++ b/src/frontend/src/icons/JigsawStack/index.tsx
@@ -1,3 +1,4 @@
+import { useDarkStore } from "@/stores/darkStore";
 import React, { forwardRef } from "react";
 import JigsawStackIconSVG from "./JigsawStackIcon";
 
@@ -5,5 +6,6 @@ export const JigsawStackIcon = forwardRef<
   SVGSVGElement,
   React.PropsWithChildren<{}>
 >((props, ref) => {
-  return <JigsawStackIconSVG ref={ref} {...props} />;
+  const isdark = useDarkStore((state) => state.dark).toString();
+  return <JigsawStackIconSVG ref={ref} {...props} isdark={isdark} />;
 });