Skip to main content

Select Input

A select input presents users with a list of options, allowing them to choose a single item from the list.

Overview

The purpose of select inputs is to allow users to easily and accurately choose a single option from a predefined list. Typically used in forms, they provide a compact and efficient way to present a list of options and enable user selection.

Select inputs consist of a clickable area that, when activated, displays the available options in a native dropdown menu. Users can then choose one option by clicking or tapping on it, and the selected option replaces the initially displayed selection.

A select input with a selected value.

Resources

Figma Component
 Stable
Figma Documentation
 Stable
Web Components
 Planned
Vue [Fozzie]
 N/A
React [Snacks]
 Stable
iOS JustUI [UI Kit]
 Stable
iOS PIE [SwiftUI]
 Stable
Android PIE [Compose & Views]
 N/A