This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020.
The hourCycle accessor property of Intl.Locale instances returns the hour cycle type for this locale.
There are 2 main types of time keeping conventions (clocks) used around the world: the 12 hour clock and the 24 hour clock. For a list of supported hour cycle types, see Intl.Locale.prototype.getHourCycles().
The hourCycle property's value is set at construction time, either through the hc key of the locale identifier or through the hourCycle option of the Intl.Locale() constructor. The latter takes priority if they are both present; and if neither is present, the property has value undefined.
The set accessor of hourCycle is undefined. You cannot change this property directly.
Like other locale subtags, the hour cycle type can be added to the Intl.Locale object via the locale string, or a configuration object argument to the constructor.
In the Unicode locale string spec, hourCycle is an "extension subtag". These subtags add additional data about the locale, and are added to locale identifiers using the -u extension key. To add the hour cycle type to the initial locale identifier string passed into the Intl.Locale() constructor, first add the -u extension key if it doesn't exist. Next, add the -hc extension to indicate that you are adding an hour cycle. Finally, add the hour cycle type.
const locale = new Intl.Locale("fr-FR-u-hc-h23");
console.log(locale.hourCycle); // "h23"
The Intl.Locale() constructor has an optional configuration object argument, which can contain any of several extension types, including hour cycle types. Set the hourCycle property of the configuration object to your desired hour cycle type, and then pass it into the constructor.
const locale = new Intl.Locale("en-US", { hourCycle: "h12" });
console.log(locale.hourCycle); // "h12"
| Desktop | Mobile | Server | |||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | Bun | Deno | Node.js | |
hourCycle |
74 | 79 | 75 | 62 | 14 | 74 | 79 | 53 | 14 | 11.0 | 74 | 14 | 1.0.0 | 1.8 | 12.0.0 |
Intl.LocaleIntl.Locale.prototype.getHourCycles()
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/hourCycle