diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
index d90b569..8147ac8 100644
--- a/.storybook/preview-head.html
+++ b/.storybook/preview-head.html
@@ -3,10 +3,10 @@
 
 <!-- Or you can load custom head-tag JavaScript: -->
 
-<script
+<!-- <script
   src="dist/src/utils/syncTheme.js"
   type="application/javascript"
-></script>
+></script> -->
 
 <link rel="preconnect" href="https://fonts.googleapis.com" />
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 770a582..181a220 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,7 +1,7 @@
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 export * from "./darkMode";
-export * from "./syncTheme";
+// export * from "./syncTheme";
 export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
 }
diff --git a/src/utils/syncTheme.ts b/src/utils/syncTheme.ts
index 1023db2..2640652 100644
--- a/src/utils/syncTheme.ts
+++ b/src/utils/syncTheme.ts
@@ -1,5 +1,5 @@
-import { theme } from "./darkMode";
+// import { theme } from "./darkMode";
 // This script sets up event listeners to set the appropriate css class in the DOM for the current theme. It's intended to be executed in the head of the document hence it is immediately invoked (IIFE).
-(() => {
-  theme.syncTheme();
-})();
+// (() => {
+//   theme.syncTheme();
+// })();