diff --git a/apps/www/components/code-block-command.tsx b/apps/www/components/code-block-command.tsx
index f74e21f1693..3725490d954 100644
--- a/apps/www/components/code-block-command.tsx
+++ b/apps/www/components/code-block-command.tsx
@@ -4,7 +4,7 @@ import * as React from "react"
 import { CheckIcon, ClipboardIcon } from "lucide-react"
 
 import { NpmCommands } from "@/types/unist"
-import { useConfig } from "@/hooks/use-config"
+import { useConfigPackageManager } from "@/hooks/use-config-package-manager"
 import { copyToClipboardWithMeta } from "@/components/copy-button"
 import { Tabs } from "@/registry/default/ui/tabs"
 import { Button } from "@/registry/new-york/ui/button"
@@ -16,7 +16,8 @@ export function CodeBlockCommand({
   __pnpmCommand__,
   __bunCommand__,
 }: React.ComponentProps<"pre"> & NpmCommands) {
-  const [config, setConfig] = useConfig()
+  const [configPackageManager, setConfigPackageManager] =
+    useConfigPackageManager()
   const [hasCopied, setHasCopied] = React.useState(false)
 
   React.useEffect(() => {
@@ -26,7 +27,7 @@ export function CodeBlockCommand({
     }
   }, [hasCopied])
 
-  const packageManager = config.packageManager || "pnpm"
+  const packageManager = configPackageManager || "pnpm"
   const tabs = React.useMemo(() => {
     return {
       pnpm: __pnpmCommand__,
@@ -58,10 +59,7 @@ export function CodeBlockCommand({
       <Tabs
         defaultValue={packageManager}
         onValueChange={(value) => {
-          setConfig({
-            ...config,
-            packageManager: value as "pnpm" | "npm" | "yarn" | "bun",
-          })
+          setConfigPackageManager(value as "pnpm" | "npm" | "yarn" | "bun")
         }}
       >
         <div className="flex items-center justify-between border-b border-zinc-800 bg-zinc-900 px-3 pt-2.5">
diff --git a/apps/www/hooks/use-config-package-manager.ts b/apps/www/hooks/use-config-package-manager.ts
new file mode 100644
index 00000000000..e84e76a9683
--- /dev/null
+++ b/apps/www/hooks/use-config-package-manager.ts
@@ -0,0 +1,13 @@
+import { useAtom } from "jotai"
+import { atomWithStorage } from "jotai/utils"
+
+type ConfigPackageManager = "npm" | "yarn" | "pnpm" | "bun"
+
+const configAtom = atomWithStorage<ConfigPackageManager>(
+  "config-package-manager",
+  "pnpm"
+)
+
+export function useConfigPackageManager() {
+  return useAtom(configAtom)
+}
diff --git a/apps/www/hooks/use-config.ts b/apps/www/hooks/use-config.ts
index 982e9ba0e06..8f0b26b2feb 100644
--- a/apps/www/hooks/use-config.ts
+++ b/apps/www/hooks/use-config.ts
@@ -8,14 +8,12 @@ type Config = {
   style: Style["name"]
   theme: BaseColor["name"]
   radius: number
-  packageManager: "npm" | "yarn" | "pnpm" | "bun"
 }
 
 const configAtom = atomWithStorage<Config>("config", {
   style: "new-york",
   theme: "zinc",
   radius: 0.5,
-  packageManager: "pnpm",
 })
 
 export function useConfig() {