diff --git a/site/package.json b/site/package.json
index 0c40a9bee2784..9ca6bac5257fa 100644
--- a/site/package.json
+++ b/site/package.json
@@ -51,6 +51,7 @@
 		"@mui/utils": "5.16.6",
 		"@mui/x-tree-view": "7.18.0",
 		"@radix-ui/react-avatar": "1.1.2",
+		"@radix-ui/react-collapsible": "1.1.2",
 		"@radix-ui/react-dialog": "1.1.2",
 		"@radix-ui/react-dropdown-menu": "2.1.4",
 		"@radix-ui/react-label": "2.1.0",
diff --git a/site/pnpm-lock.yaml b/site/pnpm-lock.yaml
index ec5c0b97d4762..d1650c218f7ea 100644
--- a/site/pnpm-lock.yaml
+++ b/site/pnpm-lock.yaml
@@ -66,6 +66,9 @@ importers:
       '@radix-ui/react-avatar':
         specifier: 1.1.2
         version: 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-collapsible':
+        specifier: 1.1.2
+        version: 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@radix-ui/react-dialog':
         specifier: 1.1.2
         version: 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -1603,6 +1606,19 @@ packages:
       '@types/react-dom':
         optional: true
 
+  '@radix-ui/react-collapsible@1.1.2':
+    resolution: {integrity: sha512-PliMB63vxz7vggcyq0IxNYk8vGDrLXVWw4+W4B8YnwI1s18x7YZYqlG9PLX7XxAJUi0g2DxP4XKJMFHh/iVh9A==}
+    peerDependencies:
+      '@types/react': '*'
+      '@types/react-dom': '*'
+      react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+      react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    peerDependenciesMeta:
+      '@types/react':
+        optional: true
+      '@types/react-dom':
+        optional: true
+
   '@radix-ui/react-collection@1.1.0':
     resolution: {integrity: sha512-GZsZslMJEyo1VKm5L1ZJY8tGDxZNPAoUeQUIbKeJfoi7Q4kmig5AsgLMYYuyYbfjd8fBmFORAIwYAkXMnXZgZw==}
     peerDependencies:
@@ -7568,6 +7584,22 @@ snapshots:
       '@types/react': 18.3.12
       '@types/react-dom': 18.3.1
 
+  '@radix-ui/react-collapsible@1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.1
+      '@radix-ui/react-compose-refs': 1.1.1(@types/react@18.3.12)(react@18.3.1)
+      '@radix-ui/react-context': 1.1.1(@types/react@18.3.12)(react@18.3.1)
+      '@radix-ui/react-id': 1.1.0(@types/react@18.3.12)(react@18.3.1)
+      '@radix-ui/react-presence': 1.1.2(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-primitive': 2.0.1(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@radix-ui/react-use-controllable-state': 1.1.0(@types/react@18.3.12)(react@18.3.1)
+      '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@18.3.12)(react@18.3.1)
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+    optionalDependencies:
+      '@types/react': 18.3.12
+      '@types/react-dom': 18.3.1
+
   '@radix-ui/react-collection@1.1.0(@types/react-dom@18.3.1)(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
     dependencies:
       '@radix-ui/react-compose-refs': 1.1.0(@types/react@18.3.12)(react@18.3.1)
diff --git a/site/src/components/Collapsible/Collapsible.stories.tsx b/site/src/components/Collapsible/Collapsible.stories.tsx
new file mode 100644
index 0000000000000..cb391c4d83135
--- /dev/null
+++ b/site/src/components/Collapsible/Collapsible.stories.tsx
@@ -0,0 +1,53 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Button } from "components/Button/Button";
+import { ChevronsUpDown } from "lucide-react";
+import {
+	Collapsible,
+	CollapsibleContent,
+	CollapsibleTrigger,
+} from "./Collapsible";
+
+const meta: Meta<typeof Collapsible> = {
+	title: "components/Collapsible",
+	component: Collapsible,
+	args: {
+		className: "w-[350px] space-y-2",
+		children: (
+			<>
+				<div className="flex items-center justify-between space-x-4 px-4">
+					<h4 className="text-sm font-semibold">
+						@peduarte starred 3 repositories
+					</h4>
+					<CollapsibleTrigger asChild>
+						<Button size="sm">
+							<ChevronsUpDown className="h-4 w-4" />
+							<span className="sr-only">Toggle</span>
+						</Button>
+					</CollapsibleTrigger>
+				</div>
+				<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-sm">
+					@radix-ui/primitives
+				</div>
+				<CollapsibleContent className="space-y-2">
+					<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-sm">
+						@radix-ui/colors
+					</div>
+					<div className="rounded-md border px-4 py-2 font-mono text-sm shadow-sm">
+						@stitches/react
+					</div>
+				</CollapsibleContent>
+			</>
+		),
+	},
+};
+
+export default meta;
+type Story = StoryObj<typeof Collapsible>;
+
+export const Close: Story = {};
+
+export const Open: Story = {
+	args: {
+		open: true,
+	},
+};
diff --git a/site/src/components/Collapsible/Collapsible.tsx b/site/src/components/Collapsible/Collapsible.tsx
new file mode 100644
index 0000000000000..8c9e611330cec
--- /dev/null
+++ b/site/src/components/Collapsible/Collapsible.tsx
@@ -0,0 +1,14 @@
+/**
+ * Copied from shadc/ui on 12/26/2024
+ * @see {@link https://ui.shadcn.com/docs/components/collapsible}
+ */
+
+import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
+
+const Collapsible = CollapsiblePrimitive.Root;
+
+const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
+
+const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
+
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };