Select
Displays a list of options for the user to pick from, triggered by a button.
Last updated: March 8, 2026
This page now includes more select patterns for forms, filters, and settings.
Basic Select
A simple dropdown to pick one option from a list.
Icon Select
A select input with colorful icons in the trigger and dropdown options.
Select With Separator
Grouped options separated by sections for better scanning.
Select With Avatars
User selector with avatars in both trigger and dropdown.
Select With Leading Text
Adds contextual leading text inside the trigger.
Select With Overlapping Label
Floating-style label treatment for compact form layouts.
Programming Select
Scrollable grouped select for larger option sets.
Status Select
Color-dot status selector with clear visual states.
Social Icon Select
Icon-based social channel selection.