Select Clearable - Clearable

Pro

Controlled select with a button to clear the current value.

Shadcn Select Clearable component

Component Data

  • ID:select/select-clearable
  • Access:pro
  • Created:May 23, 2026
  • Type:example

Select Clearable component design & features

This example controls Select value in React state and adds a ghost Button with an X icon to reset the field to empty.

Clearable selects are useful in optional filters, search panels, and forms where users should be able to remove a previous choice quickly.