---
id: Select
section: components
subsection: menus
cssPrefix: pf-v5-c-select
propComponents:
  ['Select', 'SelectOption', 'SelectGroup', 'SelectList', 'MenuToggle', 'SelectToggleProps', 'SelectPopperProps']
ouia: true
---

import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';

## Examples

`Select` builds off of the Menu component suite to wrap commonly used properties and functions for a select menu. See the [Menu documentation](/components/menus/menu) for a full list of properties that may be passed through `Select` to further customize the select menu, or the [custom menu examples](/components/menus/custom-menus) for additional examples of fully functional menus.

### Single

```ts file="./SelectBasic.tsx"

```

### Option variations

Showcases different option variants and customizations that are commonly used in a select menu. For a more complete list, see the [Menu documentation](/components/menus/menu).

```ts file="./SelectOptionVariations.tsx"

```

### Grouped single

```ts file="./SelectGrouped.tsx"

```

### Checkbox

```ts file="./SelectCheckbox.tsx"

```

### Typeahead

```ts file="./SelectTypeahead.tsx"

```

### Typeahead with create option

```ts file="./SelectTypeaheadCreatable.tsx"

```

### Multiple typeahead with chips

```ts file="./SelectMultiTypeahead.tsx"

```

### Multiple typeahead with create option

```ts file="./SelectMultiTypeaheadCreatable.tsx"

```

### Multiple typeahead with checkboxes

```ts file="./SelectMultiTypeaheadCheckbox.tsx"

```

### View more

```ts file="./SelectViewMore.tsx"

```

### Footer

```ts file="./SelectFooter.tsx"

```