Get the Client's Timezone & Offset in JavaScript

In this tutorial, we'll walk through two effective methods for retrieving the client's IANA timezone and offset using the JavaScript Internationalization API and the getTimezoneOffset() method.

Get the IANA Timezone

We'll invoke the Intl.DateTimeFormat() method from the Internationalization API to get the client's timezone:

console.log(Intl.DateTimeFormat().resolvedOptions().timeZone);
// America/Denver

The ECMAScript 2015 update introduced this method, and it currently works in 93.75% of browsers globally.

Get the Timezone Offset

To get the client's timezone offset, we'll use the getTimezoneOffset() method on a Date object:

console.log(new Date().getTimezoneOffset());
// 420

One thing to note is not all timezones are returned in whole hours. Because of this, the timezone offset returns in minutes instead of hours. To convert the offset into hours, we can perform a simple calculation by dividing the client's timezone in minutes by 60, the number of minutes in an hour:

console.log(new Date().getTimezoneOffset() / 60);
// 7

Another thing to note is although UTC is represented as a negative value in the western hemisphere and a positive value in the eastern hemisphere, this is the opposite when returning the timezone offset in minutes. For example, the America/New York timezone is UTC -5 but returns as 300 in JavaScript.

Conclusion

That covers returning the timezone and offset in JavaScript. At some point, it would be great to combine these features into a single API or function call. For now, this works perfectly!