diff --git a/change/@griffel-webpack-extraction-plugin-12160e79-5a79-4ece-a6b2-0d216619592e.json b/change/@griffel-webpack-extraction-plugin-12160e79-5a79-4ece-a6b2-0d216619592e.json
new file mode 100644
index 000000000..da3fdb579
--- /dev/null
+++ b/change/@griffel-webpack-extraction-plugin-12160e79-5a79-4ece-a6b2-0d216619592e.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: do not emit empty CSS files",
+  "packageName": "@griffel/webpack-extraction-plugin",
+  "email": "olfedias@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/code.ts b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/code.ts
new file mode 100644
index 000000000..bde294d36
--- /dev/null
+++ b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/code.ts
@@ -0,0 +1,8 @@
+import { __styles } from '@griffel/react';
+
+export const useStyles = __styles(
+  {
+    root: {},
+  },
+  {},
+);
diff --git a/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/fs.json b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/fs.json
new file mode 100644
index 000000000..8cfb87db5
--- /dev/null
+++ b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/fs.json
@@ -0,0 +1 @@
+["bundle.js"]
diff --git a/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/output.css b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/output.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/output.ts b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/output.ts
new file mode 100644
index 000000000..0750ca727
--- /dev/null
+++ b/packages/webpack-extraction-plugin/__fixtures__/webpack/empty/output.ts
@@ -0,0 +1,5 @@
+import { __css as _css } from '@griffel/react';
+import { __styles } from '@griffel/react';
+export const useStyles = _css({
+  root: {},
+});
diff --git a/packages/webpack-extraction-plugin/src/GriffelCSSExtractionPlugin.test.ts b/packages/webpack-extraction-plugin/src/GriffelCSSExtractionPlugin.test.ts
index e1fc94b66..eacf513e2 100644
--- a/packages/webpack-extraction-plugin/src/GriffelCSSExtractionPlugin.test.ts
+++ b/packages/webpack-extraction-plugin/src/GriffelCSSExtractionPlugin.test.ts
@@ -230,6 +230,7 @@ describe('webpackLoader', () => {
   testFixture('reset');
   testFixture('reset-media');
   testFixture('mixed');
+  testFixture('empty');
 
   // Multiple calls of __styles
   testFixture('multiple');
diff --git a/packages/webpack-extraction-plugin/src/webpackLoader.test.ts b/packages/webpack-extraction-plugin/src/webpackLoader.test.ts
index 5075004cc..b6a31be77 100644
--- a/packages/webpack-extraction-plugin/src/webpackLoader.test.ts
+++ b/packages/webpack-extraction-plugin/src/webpackLoader.test.ts
@@ -186,6 +186,7 @@ describe('webpackLoader', () => {
   testFixture('basic-rules');
   testFixture('reset');
   testFixture('mixed');
+  testFixture('empty');
 
   // Multiple
   testFixture('multiple');
diff --git a/packages/webpack-extraction-plugin/src/webpackLoader.ts b/packages/webpack-extraction-plugin/src/webpackLoader.ts
index 31bd9f0e4..be70cfd0e 100644
--- a/packages/webpack-extraction-plugin/src/webpackLoader.ts
+++ b/packages/webpack-extraction-plugin/src/webpackLoader.ts
@@ -72,7 +72,14 @@ function webpackLoader(
     const resultSourceMap = unstable_keepOriginalCode ? inputSourceMap : result.sourceMap;
 
     if (result.cssRulesByBucket) {
-      const css = Object.entries(result.cssRulesByBucket).reduce((acc, [cssBucketName, cssBucketRules]) => {
+      const entries = Object.entries(result.cssRulesByBucket);
+
+      if (entries.length === 0) {
+        this.callback(null, resultCode, resultSourceMap);
+        return;
+      }
+
+      const css = entries.reduce((acc, [cssBucketName, cssBucketRules]) => {
         if (cssBucketName === 'm') {
           return (
             acc +
diff --git a/packages/webpack-loader/__fixtures__/empty/code.ts b/packages/webpack-loader/__fixtures__/empty/code.ts
new file mode 100644
index 000000000..c79de6eb0
--- /dev/null
+++ b/packages/webpack-loader/__fixtures__/empty/code.ts
@@ -0,0 +1,5 @@
+import { makeStyles } from '@griffel/react';
+
+export const useStyles = makeStyles({
+  root: {},
+});
diff --git a/packages/webpack-loader/__fixtures__/empty/output.ts b/packages/webpack-loader/__fixtures__/empty/output.ts
new file mode 100644
index 000000000..f7330031a
--- /dev/null
+++ b/packages/webpack-loader/__fixtures__/empty/output.ts
@@ -0,0 +1,7 @@
+import { __styles } from '@griffel/react';
+export const useStyles = __styles(
+  {
+    root: {},
+  },
+  {},
+);
diff --git a/packages/webpack-loader/src/webpackLoader.test.ts b/packages/webpack-loader/src/webpackLoader.test.ts
index 5c24d1680..2acae75ad 100644
--- a/packages/webpack-loader/src/webpackLoader.test.ts
+++ b/packages/webpack-loader/src/webpackLoader.test.ts
@@ -232,6 +232,7 @@ describe('webpackLoader', () => {
   testFixture('object');
   testFixture('function');
   testFixture('reset');
+  testFixture('empty');
 
   // Integration fixtures for config functionality
   testFixture('config-modules', {