diff --git a/docs/_snippets/main-config-core-allowed-hosts.md b/docs/_snippets/main-config-core-allowed-hosts.md
new file mode 100644
index 000000000000..987a90b0eee5
--- /dev/null
+++ b/docs/_snippets/main-config-core-allowed-hosts.md
@@ -0,0 +1,117 @@
+```js filename=".storybook/main.js" renderer="common" language="js" tabTitle="CSF 3"
+export default {
+  // Replace your-framework with the framework you are using, e.g. react-vite, nextjs, vue3-vite, etc.
+  framework: '@storybook/your-framework',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+};
+```
+
+```ts filename=".storybook/main.ts" renderer="common" language="ts" tabTitle="CSF 3"
+// Replace your-framework with the framework you are using, e.g. react-vite, nextjs, vue3-vite, etc.
+import type { StorybookConfig } from '@storybook/your-framework';
+
+const config: StorybookConfig = {
+  framework: '@storybook/your-framework',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+};
+
+export default config;
+```
+
+```ts filename=".storybook/main.ts" renderer="react" language="ts" tabTitle="CSF Next 🧪"
+// Replace your-framework with the framework you are using (e.g., react-vite, nextjs, nextjs-vite)
+import { defineMain } from '@storybook/your-framework/node';
+
+export default defineMain({
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  framework: '@storybook/your-framework',
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
+
+<!-- JS snippets still needed while providing both CSF 3 & Next -->
+
+```js filename=".storybook/main.js" renderer="react" language="js" tabTitle="CSF Next 🧪"
+// Replace your-framework with the framework you are using (e.g., react-vite, nextjs, nextjs-vite)
+import { defineMain } from '@storybook/your-framework/node';
+
+export default defineMain({
+  framework: '@storybook/your-framework',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
+
+```ts filename=".storybook/main.ts" renderer="vue" language="ts" tabTitle="CSF Next 🧪"
+import { defineMain } from '@storybook/vue3-vite/node';
+
+export default defineMain({
+  framework: '@storybook/vue3-vite',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
+
+<!-- JS snippets still needed while providing both CSF 3 & Next -->
+
+```js filename=".storybook/main.js" renderer="vue" language="js" tabTitle="CSF Next 🧪"
+import { defineMain } from '@storybook/vue3-vite/node';
+
+export default defineMain({
+  framework: '@storybook/vue3-vite',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
+
+```ts filename=".storybook/main.ts" renderer="angular" language="ts" tabTitle="CSF Next 🧪"
+import { defineMain } from '@storybook/angular/node';
+
+export default defineMain({
+  framework: '@storybook/angular',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
+
+```ts filename=".storybook/main.ts" renderer="web-components" language="ts" tabTitle="CSF Next 🧪"
+import { defineMain } from '@storybook/web-components-vite/node';
+
+export default defineMain({
+  framework: '@storybook/web-components-vite',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
+
+<!-- JS snippets still needed while providing both CSF 3 & Next -->
+
+```js filename=".storybook/main.js" renderer="web-components" language="js" tabTitle="CSF Next 🧪"
+import { defineMain } from '@storybook/web-components-vite/node';
+
+export default defineMain({
+  framework: '@storybook/web-components-vite',
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  core: {
+    allowedHosts: ['storybook.example.local'],
+  },
+});
+```
diff --git a/docs/api/main-config/main-config-core.mdx b/docs/api/main-config/main-config-core.mdx
index 880af2a6a782..e2531467af84 100644
--- a/docs/api/main-config/main-config-core.mdx
+++ b/docs/api/main-config/main-config-core.mdx
@@ -11,6 +11,7 @@ Type:
 
 ```ts
 {
+  allowedHosts?: string[] | true;
   builder?: string | { name: string; options?: BuilderOptions };
   channelOptions?: ChannelOptions;
   crossOriginIsolated?: boolean;
@@ -25,6 +26,20 @@ Type:
 
 Configures Storybook's internal features.
 
+## `allowedHosts`
+
+Type: `string[] | true`
+
+Default: `[]`
+
+Configures the allowed hosts for the Storybook dev server, used for Origin and Host header validation. Storybook's localhost and local network (or [`--host`](../cli-options.mdx#dev)) addresses are always allowed. Use this when accessing your local Storybook instance through a reverse proxy (e.g. your webapp dev server). Set to `true` to disable hostname validation (insecure).
+
+{/* prettier-ignore-start */}
+
+<CodeSnippets path="main-config-core-allowed-hosts.md" />
+
+{/* prettier-ignore-end */}
+
 ## `builder`
 
 Type: