Native Select

Open-state select showing the focused control and the flyout list with one option muted as chosen.

USD · US Dollar

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Form27 } from "@/components/beste/piece/form27";

<Form27
  label="Default currency"
  value="USD · US Dollar"
  placeholder="Select a currency"
  open={true}
  options={[
    "USD · US Dollar",
    "EUR · Euro",
    "GBP · British Pound",
    "TRY · Turkish Lira"
  ]}
/>

More Form pieces

View all Form

Notifications

New bookings
Payment received
Weekly summary

Preferences Toggles

form35

A compact settings card listing labeled rows, each with an accent on/off toggle switch.

DesignPolishGood first issueAdd label

Multi Select

form16

Picker that keeps chosen options as removable violet pills next to a chevron to open the list.

Mira Studio
acm
Beste StudioDesign · 12 members
BesteworksEngineering · 34 members
Beste LabsResearch · 6 members

Combobox

form18

Searchable single-select with a query bar above a filtered list and a check for the active row.

Start typing to search
Beste Sözen
Beste SözenDesign lead
Mirko Petrov
Mirko PetrovEngineer
Noor Ahmed
Noor AhmedProduct

Contact Picker

form29

Searchable people picker with a focused search input above a list that tints the selected row.

Segmented Control

form24

Pill-grouped segmented control with inset muted track and a raised card under the active choice.

Assign to
Filter people…
Beste Sözen
Beste Sözen
Andrea Kim
Andrea Kim
Noor Ahmed
Noor Ahmed
Jules Park
Jules Park

Assignee Picker

form20

Popover with a header label, filter bar, and a selectable person list that checks chosen rows.