Time Field

A time field allows users to enter and edit time values using a keyboard. Each part of a time value is displayed in an individually editable segment.

Installation

npx shadcn add https://hq-ui.vercel.app/r/nova/date-field

Preview

Locale
Calendar
––––AM

Examples

Basic Usage

time-field-demo
Event time
––––AM

Without Time Zone

time-field-without-timezone
Event date
1740

Controlled

time-field-controlled

11:45:00

Event time
1145AM

Uncontrolled

time-field-uncontrolled
Event time
540PMUTC

Validation

time-field-validation
Event time
––––AM