Skip to main content

How to Get the User's Time Zone in JavaScript

When building web applications that handle dates and times, you often need to know the user's local time zone to display information correctly. JavaScript's Intl (Internationalization) API is the modern, standard tool for this purpose, providing a reliable way to get time zone information without resorting to guesswork.

This guide will teach you the modern methods for getting a user's time zone. You will learn how to get the standard IANA time zone name (e.g., "Europe/London"), the localized, human-readable name, and the time zone offset.

The IANA (Internet Assigned Numbers Authority) time zone name is the most precise and unambiguous way to identify a user's time zone. It uses a "Region/City" format (e.g., "America/New_York") and automatically accounts for Daylight Saving Time. This is the value you should use when passing a user's time zone to a server or another API.

For example, we want to get the user's standard time zone identifier.

Solution: the Intl.DateTimeFormat object provides a simple way to get this information.

function getTimeZoneName() {
return Intl.DateTimeFormat().resolvedOptions().timeZone;
}

// Example Usage:
const timeZone = getTimeZoneName();

console.log(timeZone);
// Output: (e.g.) "America/Los_Angeles", "Europe/London", etc.

How it works:

  • Intl.DateTimeFormat(): Creates a new date/time formatter object using the browser's default locale and time zone settings.
  • .resolvedOptions(): Returns a new object containing the properties that were computed and resolved for the formatter, including the timeZone.
note

This is the best practice for identifying a user's time zone.

Goal 2: Get the Localized, Long Time Zone Name

If you need to display a human-readable time zone name to the user (e.g., "Pacific Standard Time"), you can use the timeZoneName option in the toLocaleString() method.

For example, we want to display the full, descriptive name of the user's current time zone.

Solution:

function getLongTimeZoneName(date = new Date()) {
const options = {
timeZoneName: 'long',
};

// A little trick: format a date and then extract the timezone part.
const dateString = date.toLocaleDateString(undefined, options);

// The result might be "10/27/2023, Pacific Daylight Time"
// We need to extract the part after the comma.
const timeZoneName = dateString.split(', ')[1];

return timeZoneName || Intl.DateTimeFormat().resolvedOptions().timeZone;
}


// Example Usage:
console.log(getLongTimeZoneName());
// Output: (e.g.) "Pacific Daylight Time"
note

You can also use timeZoneName: 'short' to get an abbreviation like PDT or GMT+2, but these can be ambiguous and are less reliable.

Goal 3: Get the Time Zone Offset

The time zone offset is the difference, in minutes, between UTC and the user's local time. The getTimezoneOffset() method of a Date object provides this value.

note

Important: This method has a quirk: the sign is the inverse of what you might expect.

  • A positive return value means the local time is behind UTC (e.g., in the Americas).
  • A negative return value means the local time is ahead of UTC (e.g., in Europe or Asia).

Solution:

const offsetInMinutes = new Date().getTimezoneOffset();

console.log(offsetInMinutes); // Output: 420 (for a UTC-7 timezone)

// You can convert this to hours
const offsetInHours = offsetInMinutes / 60;
console.log(`Your timezone is UTC${offsetInHours > 0 ? '-' : '+'}${Math.abs(offsetInHours)}`);

Conclusion

JavaScript's Intl API and Date object provide a comprehensive toolkit for handling time zones.

  • To get the standard, unambiguous IANA time zone name (the best choice for APIs and storage), use Intl.DateTimeFormat().resolvedOptions().timeZone.
  • To get a human-readable name for display purposes, use the timeZoneName option with toLocaleString().
  • To get the numeric offset from UTC in minutes, use the date.getTimezoneOffset() method, but be mindful of its inverted sign.

For most modern applications, the IANA name is the most useful and reliable piece of time zone information you can get.