TimeDisplay
Flexible date/time display with multiple format variants and a multi-timezone tooltip on hover.
Import
import { TimeDisplay } from "@repo/design-system/components/ui/time-display";Playground
Date Order
Variant
Variants
default
inline
date
time
datetime
relative
Date Order
mdy (US)
dmy (Intl)
dmy + date
dmy + datetime
Custom Formats
Full day name
ISO-like
Short EU
Options
date + relative
default, no rel.
no tooltipMay 7, 2026, 9:36 PM
Custom Timezone Zones
Global zones
Input Types
Date object
ISO string
Timestamp