diff --git a/website/src/lib/components/ui/collapsible/collapsible-content.svelte b/website/src/lib/components/ui/collapsible/collapsible-content.svelte
index bdabb55..6239883 100644
--- a/website/src/lib/components/ui/collapsible/collapsible-content.svelte
+++ b/website/src/lib/components/ui/collapsible/collapsible-content.svelte
@@ -1,7 +1,18 @@
 <script lang="ts">
 	import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+	import { browser } from "$app/environment";
 
-	let { ref = $bindable(null), ...restProps }: CollapsiblePrimitive.ContentProps = $props();
+	let { 
+		ref = $bindable(null), 
+		children,
+		...restProps 
+	}: CollapsiblePrimitive.ContentProps = $props();
 </script>
 
-<CollapsiblePrimitive.Content bind:ref data-slot="collapsible-content" {...restProps} />
+{#if browser}
+	<CollapsiblePrimitive.Content bind:ref data-slot="collapsible-content" {...restProps} />
+{:else}
+	<div data-slot="collapsible-content" {...restProps}>
+		{@render children?.()}
+	</div>
+{/if}
diff --git a/website/src/lib/components/ui/collapsible/collapsible-trigger.svelte b/website/src/lib/components/ui/collapsible/collapsible-trigger.svelte
index ece7ad6..039dd82 100644
--- a/website/src/lib/components/ui/collapsible/collapsible-trigger.svelte
+++ b/website/src/lib/components/ui/collapsible/collapsible-trigger.svelte
@@ -1,7 +1,18 @@
 <script lang="ts">
 	import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+	import { browser } from "$app/environment";
 
-	let { ref = $bindable(null), ...restProps }: CollapsiblePrimitive.TriggerProps = $props();
+	let { 
+		ref = $bindable(null), 
+		children,
+		...restProps 
+	}: CollapsiblePrimitive.TriggerProps = $props();
 </script>
 
-<CollapsiblePrimitive.Trigger bind:ref data-slot="collapsible-trigger" {...restProps} />
+{#if browser}
+	<CollapsiblePrimitive.Trigger bind:ref data-slot="collapsible-trigger" {...restProps} />
+{:else}
+	<button data-slot="collapsible-trigger" {...restProps}>
+		{@render children?.()}
+	</button>
+{/if}
diff --git a/website/src/lib/components/ui/collapsible/collapsible.svelte b/website/src/lib/components/ui/collapsible/collapsible.svelte
index 39cdd4e..e6cd0bd 100644
--- a/website/src/lib/components/ui/collapsible/collapsible.svelte
+++ b/website/src/lib/components/ui/collapsible/collapsible.svelte
@@ -1,11 +1,19 @@
 <script lang="ts">
 	import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+	import { browser } from "$app/environment";
 
 	let {
 		ref = $bindable(null),
 		open = $bindable(false),
+		children,
 		...restProps
 	}: CollapsiblePrimitive.RootProps = $props();
 </script>
 
-<CollapsiblePrimitive.Root bind:ref bind:open data-slot="collapsible" {...restProps} />
+{#if browser}
+	<CollapsiblePrimitive.Root bind:ref bind:open data-slot="collapsible" {...restProps} />
+{:else}
+	<div data-slot="collapsible">
+		{@render children?.()}
+	</div>
+{/if}