Newly availableVery useful for timers, activity summaries, and media interfaces that display elapsed or remaining duration.

Overview

Intl.DurationFormat formats time durations according to locale conventions. It helps applications present hours, minutes, and seconds in a way that matches user expectations.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
129
129
136
16.4
129
16.4
Built-in object

The Intl.DurationFormat() constructor creates Intl.DurationFormat objects.

129
129
136
16.4
129
16.4

The format() method of Intl.DurationFormat instances formats a duration according to the locale and formatting options of this Intl.DurationFormat object.

129
129
136
16.4
129
16.4

The formatToParts() method of Intl.DurationFormat instances returns an array of objects representing each part of the formatted string that would be returned by Intl/DurationFormat/format. It is useful for building custom strings from the locale-specific tokens.

129
129
136
16.4
129
16.4

The resolvedOptions() method of Intl.DurationFormat instances returns a new object with properties reflecting the options computed during initialization of this DurationFormat object.

129
129
136
16.4
129
16.4

The Intl.DurationFormat.supportedLocalesOf() static method returns an array containing those of the provided locales that are supported in duration formatting without having to fall back to the runtime's default locale.

129
129
136
16.4
129
16.4
1+Supported (version) Not supported Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

Syntax

JAVASCRIPT
new Intl.DurationFormat('ja', { style: 'long' })
  .format({ hours: 2, minutes: 30 });
// '2 hours 30 minutes'

Live demo

Format a duration object

Render the same duration with Intl.DurationFormat when the API is available.

JavaScript
Output
Press the Run button

Compare style options

Format the same duration with long, short, and narrow styles.

JavaScript
Output
Press the Run button

Build a countdown label

Turn a remaining duration into a readable UI label.

JavaScript
Output
Press the Run button

Use cases

  • Timer displays

    Format session lengths, countdowns, or elapsed time in a locale-aware way.

  • Usage summaries

    Present durations in reports, dashboards, and histories without building custom formatting rules.

Cautions

  • Decide early whether users need compact, digital, or long-form output so formatting stays consistent across the product.
  • Duration formatting solves presentation, not scheduling or timezone logic.

Accessibility

  • Localized durations are easier to understand for screen reader users than stitched-together manual strings.
  • If time is critical, pair the formatted value with a clear label such as elapsed time or remaining time.

Powered by web-features