> For the complete documentation index, see [llms.txt](https://desislavsd.gitbook.io/vue-select/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://desislavsd.gitbook.io/vue-select/slots.md).

# Slots

| Slot       | Scope                     | Description                                                                                                                                         |
| ---------- | ------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
| option     | **option, index, select** | Allows to provide custom template for the options in the dropdown list.                                                                             |
| selected   | **option, index, select** | Template for the selected options in the dropdown list.                                                                                             |
| both       | **option, index, select** | Template for both `option` and `selected` slots. Use when you want to provide similar templates for the selected options and those in the dropdown. |
| beforelist | **select**                | Add content before options in dropdown list                                                                                                         |
| afterlist  | **select**                | Add content after options in dropdown list                                                                                                          |
| spinner    | **select**                | Add content to spinner element                                                                                                                      |

Where scope properties are :

* **option** - [VSelectOption ](/vue-select/vselectoption.md)instance
* **select** - the vSelect instance
* **phrase** - the phrase in the input

{% hint style="success" %}
If the template you provide for `option` or `selected` or `both` slots contains only one root element it will replace the default root element for these slots. This way you may have complete control over the used tag, classes and attributes.
{% endhint %}

{% hint style="success" %}
You can add your own slots by modifying the [**Layout**](/vue-select/layout-and-theming.md) component.
{% endhint %}