Intl.DateTimeFormat

Formats dates and times according to the rules of a chosen language and time zone.

Returns
A formatter object with format(), formatToParts(), and formatRange() methods.
On this page

Example

#
JavaScript
const lesson = new Date(Date.UTC(2026, 8, 28, 10, 30))

const full = new Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeZone: 'UTC' })
const short = new Intl.DateTimeFormat('en-US', { dateStyle: 'short', timeZone: 'UTC' })

console.log(full.format(lesson))
console.log(short.format(lesson))
Console
Monday, September 28, 2026
9/28/26

Definition and usage

#

Intl.DateTimeFormat turns a Date object into readable text, for example "Monday, September 28, 2026" or "9/28/26". It automatically picks month and weekday names in the chosen language, their correct grammatical form, and the order of the parts.

The simplest approach is the dateStyle and timeStyle options, with the values "full", "long", "medium", or "short". When you need more control, supply individual components: weekday, year, month, day, hour, minute. You can’t combine them with dateStyle or timeStyle.

The timeZone option sets the time zone the date is shown in, e.g. "Europe/Warsaw" or "UTC". Without it, the formatter uses the user’s own time zone, so the same moment displays differently in Poland than in Japan. The examples on this page always set the time zone explicitly, so the result is always the same.

Syntax

#
Syntax
new Intl.DateTimeFormat(locales)
new Intl.DateTimeFormat(locales, options)

formatter.format(date)

Parameters

#
  • locales

    optional, string or array

    A locale code, e.g. "en-US" or "pl-PL". If omitted, it means the browser’s language.
  • options

    optional object

    Settings, including dateStyle, timeStyle, weekday, year, month, day, hour, minute, and timeZone.

More examples

#
The same moment in different time zones
JavaScript
const liveLesson = new Date(Date.UTC(2026, 8, 28, 10, 30))
const zones = ['Europe/Warsaw', 'Asia/Tokyo', 'America/New_York']

for (const timeZone of zones) {
  const time = new Intl.DateTimeFormat('en-US', { timeStyle: 'short', timeZone }).format(liveLesson)
  console.log(`${timeZone}: ${time}`)
}
Console
Europe/Warsaw: 12:30 PM
Asia/Tokyo: 7:30 PM
America/New_York: 6:30 AM
Selected date components
JavaScript
const date = new Date(Date.UTC(2026, 8, 28, 10, 30))

const weekday = new Intl.DateTimeFormat('en-US', { weekday: 'long', timeZone: 'UTC' })
const dayMonth = new Intl.DateTimeFormat('en-US', { day: 'numeric', month: 'long', timeZone: 'UTC' })
const time = new Intl.DateTimeFormat('en-US', { hour: '2-digit', minute: '2-digit', timeZone: 'UTC' })

console.log(weekday.format(date))
console.log(dayMonth.format(date))
console.log(time.format(date))
Console
Monday
September 28
10:30 AM
Other languages
JavaScript
const date = new Date(Date.UTC(2026, 8, 28))
const options = { dateStyle: 'full', timeZone: 'UTC' }

console.log(new Intl.DateTimeFormat('de-DE', options).format(date))
console.log(new Intl.DateTimeFormat('fr-FR', options).format(date))
Console
Montag, 28. September 2026
lundi 28 septembre 2026

Browser support

#

Widely available

Works in all modern browsers, phones included. You can use it without worry.

  • Chrome
  • Edge
  • Firefox
  • Safari

Good practices

#
  • If every user needs to see the same time (e.g. an event deadline in Poland), pass timeZone: "Europe/Warsaw".
  • Create the formatter once and reuse it, e.g. when displaying a list of messages with dates.
  • For text like "yesterday" or "in 3 days", use the related Intl.RelativeTimeFormat.

Related entries

#

Spotted a mistake or missing an example? Write to us.