diff --git a/stories/login/pages/Code.stories.tsx b/stories/login/pages/Code.stories.tsx
new file mode 100644
index 00000000..b8daddd3
--- /dev/null
+++ b/stories/login/pages/Code.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "code.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/DeleteAccountConfirm.stories.tsx b/stories/login/pages/DeleteAccountConfirm.stories.tsx
new file mode 100644
index 00000000..0baf4553
--- /dev/null
+++ b/stories/login/pages/DeleteAccountConfirm.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "delete-account-confirm.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/DeleteCredential.stories.tsx b/stories/login/pages/DeleteCredential.stories.tsx
new file mode 100644
index 00000000..f2008d58
--- /dev/null
+++ b/stories/login/pages/DeleteCredential.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "delete-credential.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/FrontchannelLogout.stories.tsx b/stories/login/pages/FrontchannelLogout.stories.tsx
new file mode 100644
index 00000000..fdfddd54
--- /dev/null
+++ b/stories/login/pages/FrontchannelLogout.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "frontchannel-logout.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/LoginOauth2DeviceVerifyUserCode.stories.tsx b/stories/login/pages/LoginOauth2DeviceVerifyUserCode.stories.tsx
new file mode 100644
index 00000000..10daa0d9
--- /dev/null
+++ b/stories/login/pages/LoginOauth2DeviceVerifyUserCode.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "login-oauth2-device-verify-user-code.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/LoginRecoveryAuthnCodeConfig.stories.tsx b/stories/login/pages/LoginRecoveryAuthnCodeConfig.stories.tsx
new file mode 100644
index 00000000..6a77a0cc
--- /dev/null
+++ b/stories/login/pages/LoginRecoveryAuthnCodeConfig.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "login-recovery-authn-code-config.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/LoginRecoveryAuthnCodeInput.stories.tsx b/stories/login/pages/LoginRecoveryAuthnCodeInput.stories.tsx
new file mode 100644
index 00000000..3db064f3
--- /dev/null
+++ b/stories/login/pages/LoginRecoveryAuthnCodeInput.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "login-recovery-authn-code-input.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/LoginResetOtp.stories.tsx b/stories/login/pages/LoginResetOtp.stories.tsx
new file mode 100644
index 00000000..87e05409
--- /dev/null
+++ b/stories/login/pages/LoginResetOtp.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "login-reset-otp.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/LoginX509Info.stories.tsx b/stories/login/pages/LoginX509Info.stories.tsx
new file mode 100644
index 00000000..245465d6
--- /dev/null
+++ b/stories/login/pages/LoginX509Info.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "login-x509-info.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/WebauthnError.stories.tsx b/stories/login/pages/WebauthnError.stories.tsx
new file mode 100644
index 00000000..87d9e049
--- /dev/null
+++ b/stories/login/pages/WebauthnError.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "webauthn-error.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};
diff --git a/stories/login/pages/WebauthnRegister.stories.tsx b/stories/login/pages/WebauthnRegister.stories.tsx
new file mode 100644
index 00000000..e70eeabe
--- /dev/null
+++ b/stories/login/pages/WebauthnRegister.stories.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import type { Meta, StoryObj } from "@storybook/react";
+import { createPageStory, parameters } from "../createPageStory";
+
+const pageId = "webauthn-register.ftl";
+
+const { PageStory } = createPageStory({ pageId });
+
+const meta = {
+    title: `login/${pageId}`,
+    component: PageStory,
+    parameters
+} satisfies Meta<typeof PageStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+    render: () => <PageStory />
+};