Comparison file · selection

Select vs Combobox vs Autocomplete vs Date Picker vs Multi-select

Choose between fixed selection, editable selection, and suggestion behavior.

Run the diagnosis
Selection and suggestions comparison diagram

Common search decision

Combobox vs Autocomplete: separate the control from the behavior

A Combobox is the control that combines input or selection with a related popup. Autocomplete is the suggestion behavior that filters or completes values as users type, often inside an editable Combobox.

01

Choose a Select

Use it when users choose from a manageable fixed list and typing is not part of the job.

02

Choose a Combobox with Autocomplete

Use it when users type, filter, or complete a value and the popup must expose the matching options accessibly.

Open the direct Combobox vs Autocomplete comparison

Fast decision

Start with the behavior that changes the build

01

Select

If users need to type or filter a long list, use an editable Combobox.

Open field note ↗
02

Combobox

Autocomplete describes how suggestions respond to input; Combobox is the broader widget pattern.

Open field note ↗
03

Autocomplete

Specify whether suggestions are advisory or whether the final value must come from the list.

Open field note ↗
04

Date Picker

A date picker is a form control for dates. Distinguish it from a time picker, a general calendar view, and a date-pattern text input without a popup.

Open field note ↗
05

Multi-select

Multi-select describes a multiple-value contract; use Select for one fixed value and Checkbox Group when all choices should stay visible.

Open field note ↗

Behavior matrix

Compare contracts, not silhouettes

DecisionSelectComboboxAutocompleteDate PickerMulti-select
Input behaviorSelection only.Editable text input is available.Editable text input is available.Editable text input is available.Editable text input is available.
Value contractMust come from the fixed list.May be constrained or free-form; specify the policy.Free-form or constrained; specify the policy.May be constrained or free-form; specify the policy.May be constrained or free-form; specify the policy.
FilteringNo dynamic text filtering.May filter the popup as text is entered.Suggestions change as text is entered.May filter the popup as text is entered.May filter the popup as text is entered.
KeyboardUses native or equivalent option navigation and selection behavior.Arrow keys explore suggestions, Enter accepts, Escape closes, and text editing keys remain intact.Text editing remains native; arrows explore; Enter accepts; Escape closes.Arrow keys navigate days; Enter selects; Escape closes; Tab exits the control.Arrow keys move through options, Space or Enter changes selection, and every selected value can be reviewed and removed without a pointer.
MobilePrefer native behavior when it provides a better platform picker.Keep the input visible above the virtual keyboard and make options touch-friendly.Avoid covering the input with the virtual keyboard or popup.Prefer native platform date picker where available; custom pickers must handle touch on small targets.Prefer a full-width list or native control when a small popup cannot show selected values and touch targets clearly.

Discriminating questions

Ask only what changes the result

  1. Do users need to type into the control?Yes / No
  2. May the final value be something outside the provided option list?Yes / No
  3. Should the option list narrow as the user types?Yes / No

Implementation consequences

Turn the comparison into a build decision

The final choice must explain both the selected contract and the alternatives it excludes.

01

Name the task

Choose between fixed selection, editable selection, and suggestion behavior. Write the user goal before choosing any component from a library.

02

Freeze the decisive dimensions

For this group, compare Input behavior, Value contract, Filtering, Keyboard, Mobile. Do not allow visual similarity to replace those requirements.

03

State the exclusion

Record why the closest rejected pattern fails. That reason helps a coding agent avoid silently substituting a familiar but incompatible component.

04

Verify the behavior

Open the selected pattern reference, copy its acceptance checks, and test focus, keyboard, dismissal, placement, content, and mobile behavior in the real interface.

Frequently asked questions

Select vs Combobox vs Autocomplete vs Date Picker vs Multi-select questions

Direct answers based on the reviewed behavior contract above.

What is the main difference between Select, Combobox, Autocomplete, Date Picker, Multi-select?

Choose between fixed selection, editable selection, and suggestion behavior. The decisive dimensions on this page are Input behavior, Value contract, Filtering, Keyboard, Mobile. Read each column as a behavior contract, not as a visual style recommendation.

How do I choose among Select, Combobox, Autocomplete, Date Picker, Multi-select?

Begin with the required user task, then answer the discriminating questions above. Choose the pattern whose purpose and behavior match the evidence, and explicitly reject alternatives whose focus, input, modality, persistence, or structural contract would break the task.

Can two of these terms apply to the same interface?

Sometimes. This taxonomy includes semantic patterns, composite patterns, presentation forms, behavior variants, message channels, and generic behavior labels. A presentation term and a semantic contract can coexist, so specify each required property instead of forcing every term into a flat either-or choice.

How should I verify the final implementation?

Open the selected pattern reference and run its observable checks. At minimum, confirm the configured trigger, dismissal, focus, keyboard behavior, interactive content, placement, and mobile adaptation. Also verify the linked official or first-party source against the library you ship.