diff --git a/docs/src/pages/components/MultiSelect.svx b/docs/src/pages/components/MultiSelect.svx
index 6af4b4dd..5936cebd 100644
--- a/docs/src/pages/components/MultiSelect.svx
+++ b/docs/src/pages/components/MultiSelect.svx
@@ -13,6 +13,12 @@ By default, items will be ordered alphabetically based on the `item.text` value.
     {id: "2", text: "Fax"}]}"
   />
 
+### Custom slot
+
+Override the default slot to customize the display of each item. Access the item and index through the `let:` directive.
+
+<FileSource src="/framed/MultiSelect/MultiSelectSlot" />
+
 ### No alphabetical ordering
 
 To prevent alphabetical item ordering, pass an empty function to the `sortItem` prop.
diff --git a/docs/src/pages/framed/MultiSelect/MultiSelectSlot.svelte b/docs/src/pages/framed/MultiSelect/MultiSelectSlot.svelte
new file mode 100644
index 00000000..96d591b0
--- /dev/null
+++ b/docs/src/pages/framed/MultiSelect/MultiSelectSlot.svelte
@@ -0,0 +1,33 @@
+<script>
+  import { MultiSelect } from "carbon-components-svelte";
+</script>
+
+<MultiSelect
+  titleText="Contact"
+  label="Select contact methods..."
+  items="{[
+    { id: '0', text: 'Slack' },
+    { id: '1', text: 'Email' },
+    { id: '2', text: 'Fax' },
+  ]}"
+  let:item
+  let:index
+>
+  <div>
+    <strong>{item.text}</strong>
+  </div>
+  <div>
+    id: {item.id} - index:
+    {index}
+  </div>
+</MultiSelect>
+
+<style>
+  :global(.bx--list-box__menu-item, .bx--list-box__menu-item__option) {
+    height: auto;
+  }
+
+  :global(.bx--checkbox-label-text) {
+    display: block;
+  }
+</style>