---
meta:
title: Option
description: Options define the selectable items within various form controls such as select.
layout: component
---
```html:preview
Option 1
Option 2
Option 3
```
```jsx:react
import SlOption from '@shoelace-style/shoelace/dist/react/option';
import SlSelect from '@shoelace-style/shoelace/dist/react/select';
const App = () => (
Option 1
Option 2
Option 3
);
```
## Examples
### Disabled
Use the `disabled` attribute to disable an option and prevent it from being selected.
```html:preview
Option 1
Option 2
Option 3
```
```jsx:react
import SlOption from '@shoelace-style/shoelace/dist/react/option';
import SlSelect from '@shoelace-style/shoelace/dist/react/select';
const App = () => (
Option 1
Option 2
Option 3
);
```
### Prefix & Suffix
Add icons to the start and end of menu items using the `prefix` and `suffix` slots.
```html:preview
Email
Phone
Chat
```