Select components

FREE

Free and open-source React select components built for modern applications and websites. These select components are built using React Aria and styled with Tailwind CSS.

Select example

Team member*This is a hint text to help user.

Installation

You can add this select component using our CLI or manually:

npx untitledui@latest add select

Select examples

Below are examples and variations of this select component:

Default

Team member*This is a hint text to help user.

Disabled

Team member*This is a hint text to help user.

Sizes

Team member*This is a hint text to help user.
Team member*This is a hint text to help user.

Icon leading

Team member*This is a hint text to help user.

Avatar leading

Team member*This is a hint text to help user.

Dot leading

Team member*This is a hint text to help user.

Tags

This is a hint text to help user.

FAQs

Please refer to our frequently asked questions page for more.

The select supports three sizes: "sm", "md", and "lg". The default size is "sm".

You can disable the select by setting the isDisabled prop to true.

Yes. Use the Select.ComboBox compound component instead of Select to enable search/filtering of options.

Pass icon for a leading icon or avatarUrl for a leading avatar on Select.Item. You can also pass icon on the Select component itself to show an icon in the trigger.

Yes. The select is built on React Aria Components, which provides full keyboard navigation, screen reader support, and ARIA attributes out of the box.

Rating badge and starsMulti-select