Time Picker

TimePicker

Time selection with hour, minute, and optional second selectors. Supports both 12-hour and 24-hour formats.

Default (24-Hour)

A basic time picker with 24-hour format.

Selected: None

Time picker with 12-hour format and AM/PM selector.

Selected: None

Time picker with seconds selector enabled.

Selected: None

Restrict minute selection to 15-minute intervals.

Selected: None

Restrict minute selection to 30-minute intervals.

Selected: None

Time picker with minimum and maximum time constraints (9 AM - 5 PM).

Selected: None

TimePicker integrated with form fields.

Appointment Time

Select your preferred appointment time.

Selected: None

Multiple time pickers for meeting start and end times.

Meeting Start

Meeting End

Duration: Select both times

A disabled time picker.

Component parameters and their types.

Prop	Type	Default	Description
SelectedTime	TimeOnly?	—	The currently selected time.
Use12Hour	bool	false	When true, uses 12-hour format with AM/PM selector.
ShowSeconds	bool	false	When true, shows a seconds selector.
MinuteStep	int	1	The interval between selectable minute values.
MinTime	TimeOnly?	—	The minimum selectable time.
MaxTime	TimeOnly?	—	The maximum selectable time.
Placeholder	string?	—	Placeholder text shown when no time is selected.
Disabled	bool	false	When true, the picker is non-interactive.
Class	string?	—	Additional CSS classes appended to the root element.