diff --git a/docs/src/app/(docs)/concepts/theming/page.mdx b/docs/src/app/(docs)/concepts/theming/page.mdx
index 7537241a6c..58b3237923 100644
--- a/docs/src/app/(docs)/concepts/theming/page.mdx
+++ b/docs/src/app/(docs)/concepts/theming/page.mdx
@@ -230,6 +230,40 @@ export function Page() {
   </Tab>
 </Tabs>
 
+<Note>
+  If you wrap your Tailwind config with `withUt` and use Storybook with webpack,
+  Storybook may fail to resolve Node builtins that `withUt` imports. Map them in
+  `.storybook/main.ts` (merge `webpackFinal` into your existing export if you
+  already have one):
+
+```ts
+// .storybook/main.ts
+import type { StorybookConfig } from "@storybook/react-webpack5";
+
+const config: StorybookConfig = {
+  // ...your existing Storybook config
+  webpackFinal: async (config) => {
+    const nodeExternals = {
+      // commonjs form avoids webpack's default `var` externalsType
+      "node:path": "commonjs path",
+      "node:module": "commonjs module",
+    };
+    if (Array.isArray(config.externals)) {
+      config.externals.push(nodeExternals);
+    } else if (config.externals) {
+      config.externals = [config.externals, nodeExternals];
+    } else {
+      config.externals = nodeExternals;
+    }
+    return config;
+  },
+};
+
+export default config;
+```
+
+</Note>
+
 <Note>
   If you're not wrapping your config as shown above, you have to import our
   stylesheet into your app. Otherwise, components will not look right.