diff --git a/web/src/routes/preview/tools/[id]/ParamControl.svelte b/web/src/lib/components/kit/ParamControl.svelte
similarity index 100%
rename from web/src/routes/preview/tools/[id]/ParamControl.svelte
rename to web/src/lib/components/kit/ParamControl.svelte
diff --git a/web/src/routes/preview/tools/[id]/PreviewPanel.svelte b/web/src/lib/components/kit/PreviewPanel.svelte
similarity index 100%
rename from web/src/routes/preview/tools/[id]/PreviewPanel.svelte
rename to web/src/lib/components/kit/PreviewPanel.svelte
diff --git a/web/src/routes/preview/tools/[id]/SettingsPanel.svelte b/web/src/lib/components/kit/SettingsPanel.svelte
similarity index 100%
rename from web/src/routes/preview/tools/[id]/SettingsPanel.svelte
rename to web/src/lib/components/kit/SettingsPanel.svelte
diff --git a/web/src/routes/preview/demo/WorkspaceHeader.svelte b/web/src/lib/components/kit/WorkspaceHeader.svelte
similarity index 100%
rename from web/src/routes/preview/demo/WorkspaceHeader.svelte
rename to web/src/lib/components/kit/WorkspaceHeader.svelte
diff --git a/web/src/routes/preview/demo/+page.svelte b/web/src/routes/preview/demo/+page.svelte
index d6c78a2..e24e07e 100644
--- a/web/src/routes/preview/demo/+page.svelte
+++ b/web/src/routes/preview/demo/+page.svelte
@@ -14,13 +14,13 @@
 	import Badge from "$lib/components/kit/ui/Badge.svelte";
 	import DownloadButton from "$lib/components/kit/ui/DownloadButton.svelte";
 	import IconButton from "$lib/components/kit/ui/IconButton.svelte";
+	import WorkspaceHeader from "$lib/components/kit/WorkspaceHeader.svelte";
 	import {
 		ChevronDown,
 		Plus,
 		Settings2,
 		SlidersHorizontal,
 	} from "@lucide/svelte";
-	import WorkspaceHeader from "./WorkspaceHeader.svelte";
 
 	let gradColor = $state("#DCEBFF");
 	let direction = $state(135);