diff --git a/web/src/app/(admin)/admin/layout.tsx b/web/src/app/(admin)/admin/layout.tsx
index 3049182..aeaebf7 100644
--- a/web/src/app/(admin)/admin/layout.tsx
+++ b/web/src/app/(admin)/admin/layout.tsx
@@ -8,7 +8,7 @@ import { usePathname, useRouter } from "next/navigation";
 import type { ReactNode } from "react";
 import { useEffect } from "react";
 
-import { UserStatusActions } from "@/components/user-status-actions";
+import { UserStatusActions } from "@/components/layout/user-status-actions";
 import { adminLayoutStyle } from "@/lib/app-theme";
 import { useUserStore } from "@/stores/use-user-store";
 
diff --git a/web/src/app/(user)/canvas/[id]/canvas-client-page.tsx b/web/src/app/(user)/canvas/[id]/canvas-client-page.tsx
index f42602e..1effa67 100644
--- a/web/src/app/(user)/canvas/[id]/canvas-client-page.tsx
+++ b/web/src/app/(user)/canvas/[id]/canvas-client-page.tsx
@@ -14,7 +14,7 @@ import { canvasThemes, type CanvasBackgroundMode } from "@/lib/canvas-theme";
 import { useThemeStore } from "@/stores/use-theme-store";
 import { useAssetStore } from "@/stores/use-asset-store";
 import { useUserStore } from "@/stores/use-user-store";
-import { UserStatusActions } from "@/components/user-status-actions";
+import { UserStatusActions } from "@/components/layout/user-status-actions";
 import { cropDataUrl } from "../utils/canvas-image-data";
 import { App, Button, Dropdown, Modal } from "antd";
 import { NODE_DEFAULT_SIZE, getNodeSpec } from "../constants";
diff --git a/web/src/app/(user)/layout.tsx b/web/src/app/(user)/layout.tsx
index 25bd868..2266e14 100644
--- a/web/src/app/(user)/layout.tsx
+++ b/web/src/app/(user)/layout.tsx
@@ -3,7 +3,7 @@
 import type { ReactNode } from "react";
 import { usePathname } from "next/navigation";
 
-import { AppTopNav } from "@/components/app-top-nav";
+import { AppTopNav } from "@/components/layout/app-top-nav";
 import { type NavigationToolSlug, navigationTools } from "@/lib/navigation-tools";
 import { useConfigStore } from "@/stores/use-config-store";
 
diff --git a/web/src/app/layout.tsx b/web/src/app/layout.tsx
index 1314b9b..7a3fbd7 100644
--- a/web/src/app/layout.tsx
+++ b/web/src/app/layout.tsx
@@ -1,9 +1,10 @@
 import type { Metadata } from "next";
 import Script from "next/script";
 import { AntdRegistry } from "@ant-design/nextjs-registry";
-import { AppProviders } from "@/components/app-providers";
+import { AppProviders } from "@/components/layout/app-providers";
 import "antd/dist/reset.css";
 import "./globals.css";
+import React from "react";
 
 export const metadata: Metadata = {
   title: "无限画布",
diff --git a/web/src/components/app-providers.tsx b/web/src/components/layout/app-providers.tsx
similarity index 94%
rename from web/src/components/app-providers.tsx
rename to web/src/components/layout/app-providers.tsx
index 9c4b5b5..6b95109 100644
--- a/web/src/components/app-providers.tsx
+++ b/web/src/components/layout/app-providers.tsx
@@ -7,7 +7,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { App, ConfigProvider } from "antd";
 import zhCN from "antd/locale/zh_CN";
 
-import { ClientRootInit } from "@/components/client-root-init";
+import { ClientRootInit } from "@/components/layout/client-root-init";
 import { getAntThemeConfig } from "@/lib/app-theme";
 import { useThemeStore } from "@/stores/use-theme-store";
 
diff --git a/web/src/components/app-top-nav.tsx b/web/src/components/layout/app-top-nav.tsx
similarity index 98%
rename from web/src/components/app-top-nav.tsx
rename to web/src/components/layout/app-top-nav.tsx
index db8d17f..a75c753 100644
--- a/web/src/components/app-top-nav.tsx
+++ b/web/src/components/layout/app-top-nav.tsx
@@ -5,10 +5,10 @@ import Link from "next/link";
 import { App, Button, Drawer, Form, Input, Modal, Segmented } from "antd";
 
 import { ModelPicker } from "@/components/model-picker";
-import { GitHubLink } from "@/components/github-link";
-import { UserStatusActions } from "@/components/user-status-actions";
 import { AnimatedThemeToggler } from "@/components/ui/animated-theme-toggler";
-import { VersionReleaseModal } from "@/components/version-release-modal";
+import { GitHubLink } from "@/components/layout/github-link";
+import { UserStatusActions } from "@/components/layout/user-status-actions";
+import { VersionReleaseModal } from "@/components/layout/version-release-modal";
 import { useConfigStore, useEffectiveConfig, type AiConfig } from "@/stores/use-config-store";
 import { navigationTools, type NavigationToolSlug } from "@/lib/navigation-tools";
 import { fetchImageModels } from "@/services/api/image";
diff --git a/web/src/components/client-root-init.tsx b/web/src/components/layout/client-root-init.tsx
similarity index 100%
rename from web/src/components/client-root-init.tsx
rename to web/src/components/layout/client-root-init.tsx
diff --git a/web/src/components/github-link.tsx b/web/src/components/layout/github-link.tsx
similarity index 100%
rename from web/src/components/github-link.tsx
rename to web/src/components/layout/github-link.tsx
diff --git a/web/src/components/user-status-actions.tsx b/web/src/components/layout/user-status-actions.tsx
similarity index 96%
rename from web/src/components/user-status-actions.tsx
rename to web/src/components/layout/user-status-actions.tsx
index 2951ec2..a5abf40 100644
--- a/web/src/components/user-status-actions.tsx
+++ b/web/src/components/layout/user-status-actions.tsx
@@ -5,9 +5,9 @@ import { Dropdown } from "antd";
 import { Settings2 } from "lucide-react";
 import type { ItemType } from "antd/es/menu/interface";
 
-import { GitHubLink } from "@/components/github-link";
 import { AnimatedThemeToggler } from "@/components/ui/animated-theme-toggler";
-import { VersionReleaseModal } from "@/components/version-release-modal";
+import { GitHubLink } from "@/components/layout/github-link";
+import { VersionReleaseModal } from "@/components/layout/version-release-modal";
 import { cn } from "@/lib/utils";
 import { useThemeStore } from "@/stores/use-theme-store";
 import { useUserStore } from "@/stores/use-user-store";
diff --git a/web/src/components/version-release-modal.tsx b/web/src/components/layout/version-release-modal.tsx
similarity index 100%
rename from web/src/components/version-release-modal.tsx
rename to web/src/components/layout/version-release-modal.tsx