# Select: Sizes

> `size` on `SelectTrigger` matches Input and Button heights.

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

## Add this example

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

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

## Source

```tsx title="components/examples/select/sizes.tsx"
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/select"

const sizes = ["sm", "default", "lg"] as const

export function SelectSizes() {
  return (
    <div className="flex flex-wrap items-center gap-3">
      {sizes.map((size) => (
        <Select key={size} defaultValue="week">
          <SelectTrigger size={size} aria-label={`Range (${size})`}>
            <SelectValue />
          </SelectTrigger>
          <SelectContent>
            <SelectItem value="day">Today</SelectItem>
            <SelectItem value="week">This week</SelectItem>
            <SelectItem value="month">This month</SelectItem>
          </SelectContent>
        </Select>
      ))}
    </div>
  )
}
```

## Props in this example

### Select

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

### SelectTrigger

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `size` | `"sm" \| "default" \| "lg"` | `"default"` |  |

### SelectItem

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

## More Select examples

- [Groups and long lists](https://hextaui.com/docs/select/examples/groups.md)
- [With icons](https://hextaui.com/docs/select/examples/icons.md)
- [Multiple](https://hextaui.com/docs/select/examples/multiple.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)