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
Libraries
Radix UI, Base UI, React Aria

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.