Back to Forms & Inputs
Tags Combobox
A multi-select combobox that renders chosen options as removable chips inside the field — filtered suggestions, keyboard-first, and a 'create new' row when nothing matches.
ReactTypeScript
Type to filter, Enter to add, Backspace to remove.
Forms & Inputsmulti-selectcomboboxtagsautocomplete
Stack: React + Tailwind CSS + shadcn/ui — every prompt is written for this stack and is most accurate in it.
Dependencies: lucide-react
Overview
Surface
One fused pill — chips + text input share a single field surface
Keyboard
↑↓ navigate, Enter adds, Backspace on empty query pops the last chip
Creatable
No match → an 'Add “query”' row creates a new tag inline
Focus
:has() lifts the ring to the wrapper — inner input stays chromeless