Intl. DateTimeFormat
Formats dates and times according to the rules of a chosen language and time zone.
- Returns
- A formatter object with
format(),formatToParts(), andformatRange()methods.
Example
#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))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
#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, includingdateStyle,timeStyle,weekday,year,month,day,hour,minute, andtimeZone.
More examples
#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}`)
}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))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))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
#- DateAn object representing a specific moment in time, with methods to read and change the date and time.
- Intl.NumberFormatFormats numbers according to a given language’s rules: separators, currencies, percentages, and units.
- String.prototype.localeCompare()Compares two strings according to language rules. Returns a negative number, zero, or a positive number, perfect for sorting.
- Intl.RelativeTimeFormatFormats relative time in the chosen language, e.g. "in 3 days", "2 hours ago", or "yesterday".
Spotted a mistake or missing an example? Write to us.