# Select: Multiple

> With `multiple`, the list stays open while you pick, and the value can summarise long selections.

Example: https://hextaui.com/docs/select/examples/multiple
Component docs: https://hextaui.com/docs/select.md

## Add this example

```bash
npx shadcn@latest add https://hextaui.com/r/select-multiple.json
```

This adds `components/examples/select/multiple.tsx` with the Select component and the HextaUI theme tokens.

## Source

```tsx title="components/examples/select/multiple.tsx"
"use client"

import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select"

const labels = ["Bug", "Feature", "Design", "Docs", "Performance"]

export function SelectMultiple() {
  return (
    <Select multiple defaultValue={["Bug", "Design"]}>
      <SelectTrigger aria-label="Labels" className="w-56">
        <SelectValue placeholder="Add labels">
          {(value: string[]) =>
            value.length > 2 ? `${value.length} labels` : value.join(", ")
          }
        </SelectValue>
      </SelectTrigger>
      <SelectContent alignItemWithTrigger={false}>
        {labels.map((label) => (
          <SelectItem key={label} value={label}>
            {label}
          </SelectItem>
        ))}
      </SelectContent>
    </Select>
  )
}
```

## Props in this example

### Select

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `defaultValue` | `Value \| Value[] \| null` | – |  |
| `multiple` | `boolean` | `false` |  |

### SelectValue

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `placeholder` | `ReactNode` | – |  |

### SelectContent

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `alignItemWithTrigger` | `boolean` | `true` | Open over the trigger with the current option lined up. |

### SelectItem

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `value` | `Value` | – |  |

## More Select examples

- [Sizes](https://hextaui.com/docs/select/examples/sizes.md)
- [Groups and long lists](https://hextaui.com/docs/select/examples/groups.md)
- [With icons](https://hextaui.com/docs/select/examples/icons.md)
- [In a form](https://hextaui.com/docs/select/examples/field.md)
- [Disabled and invalid](https://hextaui.com/docs/select/examples/states.md)
- [Below the trigger](https://hextaui.com/docs/select/examples/dropdown.md)
- [Right to left](https://hextaui.com/docs/select/examples/rtl.md)