Clock()

Clock(__namedParameters): Element

Clock - An auto-updating UTC time component.

Uses a https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat|DateTimeFormat configured with 'en-US', { timeStyle: 'long, timeZone: 'UTC', hour12: false } by default, but can be overridden with the formatter prop.

NOTE: This component comes unstyled by default.

Parameters

__namedParameters

ClockProps

Returns

Element

Examples

// Standard Clock
<Clock /> // <time>15:54:14 UTC</time>

// Styled
<Clock className="fg-accent-primary-bold" />

// Custom Format
const formatter = new Intl.DateTimeFormat('en-US', {
  dateStyle: "short",
  timeStyle: 'long',
  timeZone: 'UTC',
  hour12: false
});

<Clock formatter={formatter} /> // <time>9/30/25, 15:54:14 UTC</time>

See

DateTimeFormat MDN