diff --git a/apps/design-system/content/docs/components/combobox.mdx b/apps/design-system/content/docs/components/combobox.mdx
index 3ad33b0124e..5b00f003667 100644
--- a/apps/design-system/content/docs/components/combobox.mdx
+++ b/apps/design-system/content/docs/components/combobox.mdx
@@ -132,3 +132,9 @@ You can create a responsive combobox by using the `<Popover />` on desktop and t
 ### Form
 
 <ComponentPreview name="combobox-form" />
+
+### Create from list
+
+When users can create an option while choosing one, give the action a clear verb label and place it at the bottom of the list, separated from the existing options. Keep the current selection in place while they create the new option.
+
+<ComponentPreview name="combobox-create-option" peekCode wide />
diff --git a/apps/design-system/registry/default/example/combobox-create-option.tsx b/apps/design-system/registry/default/example/combobox-create-option.tsx
new file mode 100644
index 00000000000..01fa6b5adc7
--- /dev/null
+++ b/apps/design-system/registry/default/example/combobox-create-option.tsx
@@ -0,0 +1,71 @@
+'use client'
+
+import { Check, Plus } from 'lucide-react'
+import { useState } from 'react'
+import {
+  ComboboxTrigger,
+  Command,
+  CommandGroup,
+  CommandItem,
+  CommandList,
+  CommandSeparator,
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from 'ui'
+
+const buckets = ['Images', 'Exports']
+
+export default function ComboboxCreateOption() {
+  const [selectedBucket, setSelectedBucket] = useState('')
+  const [isListOpen, setIsListOpen] = useState(false)
+
+  return (
+    <Popover open={isListOpen} onOpenChange={setIsListOpen}>
+      <PopoverTrigger asChild>
+        <ComboboxTrigger
+          aria-expanded={isListOpen}
+          data-state={isListOpen ? 'open' : 'closed'}
+          className="w-[240px]"
+        >
+          {selectedBucket || 'Select a bucket'}
+        </ComboboxTrigger>
+      </PopoverTrigger>
+      <PopoverContent className="w-[240px] p-0" align="start">
+        <Command>
+          <CommandList>
+            <CommandGroup>
+              {buckets.map((bucket) => (
+                <CommandItem
+                  key={bucket}
+                  value={bucket}
+                  className="cursor-pointer justify-between"
+                  onSelect={() => {
+                    setSelectedBucket(bucket)
+                    setIsListOpen(false)
+                  }}
+                >
+                  {bucket}
+                  {selectedBucket === bucket && <Check size={14} />}
+                </CommandItem>
+              ))}
+            </CommandGroup>
+            <CommandSeparator />
+            <CommandGroup>
+              <CommandItem
+                className="cursor-pointer"
+                onSelect={() => {
+                  setIsListOpen(false)
+                  // Open the creation flow here without changing the selected bucket.
+                }}
+              >
+                <Plus size={14} className="mr-2" />
+                New bucket
+              </CommandItem>
+            </CommandGroup>
+          </CommandList>
+        </Command>
+      </PopoverContent>
+    </Popover>
+  )
+}
diff --git a/apps/design-system/registry/examples.ts b/apps/design-system/registry/examples.ts
index 256eaa8f60f..0a47eeaa6c8 100644
--- a/apps/design-system/registry/examples.ts
+++ b/apps/design-system/registry/examples.ts
@@ -385,6 +385,12 @@ export const examples: Registry = [
     registryDependencies: ['command'],
     files: ['example/combobox-demo.tsx'],
   },
+  {
+    name: 'combobox-create-option',
+    type: 'components:example',
+    registryDependencies: ['command'],
+    files: ['example/combobox-create-option.tsx'],
+  },
   {
     name: 'combobox-dropdown-menu',
     type: 'components:example',