diff --git a/generate-module.js b/generate-module.js
index fd2623f..54ec688 100755
--- a/generate-module.js
+++ b/generate-module.js
@@ -48,9 +48,11 @@ function checkNameClashes (icons) {
   fse.mkdirpSync(path.join(__dirname, 'package', 'esm', 'light'))
 
   for (const { name, filename, svgPath } of icons) {
-    const code = `import createIcon from './util/createIcon'
-  export default createIcon('${svgPath}', '${name}')
-  `
+    const code = `
+      "use client";
+      import createIcon from './util/createIcon'
+      export default createIcon('${svgPath}', '${name}')
+    `
 
     // es module
     fse.writeFileSync(path.join(__dirname, 'package', 'esm', `${filename || name}.js`), babel.transform(code, {
@@ -70,9 +72,11 @@ function checkNameClashes (icons) {
   }
 
   for (const { name, filename, svgPath } of lightIcons) {
-    const code = `import createIcon from '../util/createIcon'
-  export default createIcon('${svgPath}', '${name}')
-  `
+    const code = `
+      "use client";
+      import createIcon from '../util/createIcon'
+      export default createIcon('${svgPath}', '${name}')
+    `
 
     // es module
     fse.writeFileSync(path.join(__dirname, 'package', 'esm', 'light', `${filename || name}.js`), babel.transform(code, {
diff --git a/src/util/createIcon.js b/src/util/createIcon.js
index 325385b..6bf577b 100644
--- a/src/util/createIcon.js
+++ b/src/util/createIcon.js
@@ -1,4 +1,3 @@
-"use client";
 import { createSvgIcon } from "@mui/material/utils";
 
 export default (path, name) => createSvgIcon(<path d={path} />, name);