Docs
Multi Select

Multi Select

Displays a list of options that a user can select one or more of. Supports search and filtering.

Installation

npx shadcn-ui@latest add multi-select

Usage

import { MultiSelect } from "@/components/ui/multi-select"
<MultiSelect
  options={[
    { value: "React", label: "React" },
    { value: "Vue", label: "Vue" },
    { value: "Svelte", label: "Svelte" },
    { value: "Angular", label: "Angular" },
  ]}
  selected={selected}
  onChange={setSelected}
  className="sm:w-[300px]"
  placeholder="Select a framework"
/>

Examples

Form

SelectSeparator