> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cognite.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Time picker

> A visual time selector used inside date time pickers or standalone for time-only input. Handles hour and minute selection — only include seconds when the use case genuinely requires that level of precision.

## Time picker

<Badge color="blue">v1.0.0</Badge> | [View in Storybook](https://master--695bb4b1b8041ae09768950a.chromatic.com/?path=/docs/primitives-timepicker--docs)

### When to use

* Time-only input where a visual selector is clearer than free text.
* Paired with [Date picker](/aura-design-system/primitives/date-picker) when both date and time are required.
* Inside [Date and time picker](/aura-design-system/primitives/date-and-time-picker) and [Date time range picker](/aura-design-system/primitives/date-time-range-picker) flows.

### When not to use

* When only a date is needed, use [Date picker](/aura-design-system/primitives/date-picker) instead.
* For time range input without dates, pair two instances with clear "start" and "end" labels or use a dedicated range primitive.

### Dos and don'ts

* Do match the time format (12hr/24hr) to the user's locale or application setting — don't hardcode one.
* Do include AM/PM selection clearly when using 12-hour format; ambiguity here causes real errors.
* Don't include seconds unless the context requires it (log timestamps, precise scheduling) — it adds complexity most users don't need.

### Behavior

* When paired with [Date picker](/aura-design-system/primitives/date-picker), the date and time should feel like one composed input — changes to either should update a single combined value, not two separate ones.
* If the time value has constraints (e.g. only future times, business hours only), disable invalid times rather than letting users select them and fail on submit.

### Often used with

* [Date picker](/aura-design-system/primitives/date-picker), [Date and time picker](/aura-design-system/primitives/date-and-time-picker), [Label](/aura-design-system/primitives/label), [Helper text](/aura-design-system/primitives/helper-text).