forms contract

TimePicker

Hour + minute selector. Locale-aware 12/24h.

Variants

wheel
iOS-style scroll wheel — touch surfaces
numeric
Two number inputs separated by ":" — keyboard-first

Sizes

  • md
  • lg

Example

<TimePicker value={time} onChange={setTime} step={15} format="auto" />

Usage rule

Match the user locale (12h with AM/PM toggle in en-US, 24h elsewhere).

The full TimePicker contract has 3 more rules, plus the do-not patterns. Get the full recipe.

Related

Get the TimePicker contract in your project.