diff --git a/src/components/core/ThemeChanger.tsx b/src/components/core/ThemeChanger.tsx
index 629d133..7bc0daa 100644
--- a/src/components/core/ThemeChanger.tsx
+++ b/src/components/core/ThemeChanger.tsx
@@ -1,14 +1,14 @@
 "use client";
 import { useTheme } from "@wrksz/themes/client";
-import { useEffect, useState } from "react";
+import { useSyncExternalStore } from "react";
 
 export const ThemeChanger = () => {
   const { theme, setTheme } = useTheme();
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
+  const mounted = useSyncExternalStore(
+    () => () => undefined,
+    () => true,
+    () => false,
+  );
 
   if (!mounted) {
     return <p>Loading theme...</p>;