diff --git a/src/components/ui/collapsible/collapsible-content.svelte b/src/components/ui/collapsible/collapsible-content.svelte
new file mode 100644
index 0000000..6c9f34e
--- /dev/null
+++ b/src/components/ui/collapsible/collapsible-content.svelte
@@ -0,0 +1,14 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+
+  let {
+    ref = $bindable(null),
+    ...restProps
+  }: CollapsiblePrimitive.ContentProps = $props();
+</script>
+
+<CollapsiblePrimitive.Content
+  bind:ref
+  data-slot="collapsible-content"
+  {...restProps}
+/>
diff --git a/src/components/ui/collapsible/collapsible-trigger.svelte b/src/components/ui/collapsible/collapsible-trigger.svelte
new file mode 100644
index 0000000..ab2ce1f
--- /dev/null
+++ b/src/components/ui/collapsible/collapsible-trigger.svelte
@@ -0,0 +1,14 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+
+  let {
+    ref = $bindable(null),
+    ...restProps
+  }: CollapsiblePrimitive.TriggerProps = $props();
+</script>
+
+<CollapsiblePrimitive.Trigger
+  bind:ref
+  data-slot="collapsible-trigger"
+  {...restProps}
+/>
diff --git a/src/components/ui/collapsible/collapsible.svelte b/src/components/ui/collapsible/collapsible.svelte
new file mode 100644
index 0000000..ac14155
--- /dev/null
+++ b/src/components/ui/collapsible/collapsible.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+  import { Collapsible as CollapsiblePrimitive } from "bits-ui";
+
+  let {
+    ref = $bindable(null),
+    open = $bindable(false),
+    ...restProps
+  }: CollapsiblePrimitive.RootProps = $props();
+</script>
+
+<CollapsiblePrimitive.Root
+  bind:ref
+  bind:open
+  data-slot="collapsible"
+  {...restProps}
+/>
diff --git a/src/components/ui/collapsible/index.ts b/src/components/ui/collapsible/index.ts
new file mode 100644
index 0000000..296a91b
--- /dev/null
+++ b/src/components/ui/collapsible/index.ts
@@ -0,0 +1,13 @@
+import Root from "./collapsible.svelte";
+import Trigger from "./collapsible-trigger.svelte";
+import Content from "./collapsible-content.svelte";
+
+export {
+  Root,
+  Content,
+  Trigger,
+  //
+  Root as Collapsible,
+  Content as CollapsibleContent,
+  Trigger as CollapsibleTrigger,
+};