diff --git a/packages/frontend/.storybook/generate.tsx b/packages/frontend/.storybook/generate.tsx
index b71d3c2a4..62e84d149 100644
--- a/packages/frontend/.storybook/generate.tsx
+++ b/packages/frontend/.storybook/generate.tsx
@@ -107,7 +107,11 @@ function toStories(component: string): string {
 	const base = basename(component);
 	const dir = dirname(component);
 	const literal = (
-		<literal value={component.slice('src/'.length, -'.vue'.length)} />
+		<literal
+			value={component
+				.slice('src/'.length, -'.vue'.length)
+				.replace(/\./g, '/')}
+		/>
 	) as estree.Literal;
 	const identifier = (
 		<identifier
diff --git a/packages/frontend/src/components/global/MkPageHeader.tabs.stories.ts b/packages/frontend/src/components/global/MkPageHeader.tabs.stories.ts
index 611aa0179..89c241eb7 100644
--- a/packages/frontend/src/components/global/MkPageHeader.tabs.stories.ts
+++ b/packages/frontend/src/components/global/MkPageHeader.tabs.stories.ts
@@ -3,7 +3,7 @@
 import { Meta, StoryObj } from '@storybook/vue3';
 import MkPageHeader_tabs from './MkPageHeader.tabs.vue';
 const meta = {
-	title: 'components/global/MkPageHeader.tabs',
+	title: 'components/global/MkPageHeader/tabs',
 	component: MkPageHeader_tabs,
 } satisfies Meta<typeof MkPageHeader_tabs>;
 export const Default = {