Shadcn Select

Explore the collection of awesome Shadcn Select Components, featuring 36 select variants designed for customizable, and interactive UI elements built with React and Tailwind CSS.

Have any suggestions for Select variants?

Join our Discord community and share your ideas to help us improve and expand our component variants!

Native select default

Native select with placeholder

Native select with icon

Native select with helper text

Could you share which city you're based in?

Native select with error

Selected option is invalid

Required native select *

Native select with option groups

Native select with overlapping label

Native select with inset label

Default select

Select with placeholder

Select with icon

Select with helper text

Could you share which city you're based in?

Select with error

Selected option is invalid

Select with colored border and ring

Select with background color

Ghost Select

Disabled select

Disabled options select

Required select *

Select with options groups

Select with separator

Select with overlapping label

Select with inset label

Timezone Select

Select option with icon

Select with leading text

Status select

Options with flag

Options with avatar

Multiselect

Select categories

Clothing

Footwear

Inspired by shadcn/ui expressions

Multiselect with placeholder and clear

Select categories

Inspired by shadcn/ui expressions

Native multiple select

Listbox with single option selectable

Built using React Aria

Listbox with option groups

Built using React Aria

Shadcn Animated Select

Enhance your interface with 2 Shadcn animated select component variants, crafted with React, Tailwind CSS, and Motion for smooth, interactive animations.

Select menu slide-in from bottom

Select menu zoom-in

Shadcn Radio Group

Shadcn Sheet