Seems the most foolproof way to start with a UTC date is to create a new Date object and use the setUTC… methods to set it to the date/time you want.

Then the various toLocale…String methods will provide localized output.

Example:

// This would come from the server.
// Also, this whole block could probably be made into an mktime function.
// All very bare here for quick grasping.
d = new Date();
d.setUTCFullYear(2004);
d.setUTCMonth(1);
d.setUTCDate(29);
d.setUTCHours(2);
d.setUTCMinutes(45);
d.setUTCSeconds(26);

console.log(d);                        // -> Sat Feb 28 2004 23:45:26 GMT-0300 (BRT)
console.log(d.toLocaleString());       // -> Sat Feb 28 23:45:26 2004
console.log(d.toLocaleDateString());   // -> 02/28/2004
console.log(d.toLocaleTimeString());   // -> 23:45:26

Some references:

  • toLocaleString
  • toLocaleDateString
  • toLocaleTimeString
  • getTimezoneOffset
Answer from kch on Stack Overflow
Top answer
1 of 16
225

Seems the most foolproof way to start with a UTC date is to create a new Date object and use the setUTC… methods to set it to the date/time you want.

Then the various toLocale…String methods will provide localized output.

Example:

// This would come from the server.
// Also, this whole block could probably be made into an mktime function.
// All very bare here for quick grasping.
d = new Date();
d.setUTCFullYear(2004);
d.setUTCMonth(1);
d.setUTCDate(29);
d.setUTCHours(2);
d.setUTCMinutes(45);
d.setUTCSeconds(26);

console.log(d);                        // -> Sat Feb 28 2004 23:45:26 GMT-0300 (BRT)
console.log(d.toLocaleString());       // -> Sat Feb 28 23:45:26 2004
console.log(d.toLocaleDateString());   // -> 02/28/2004
console.log(d.toLocaleTimeString());   // -> 23:45:26

Some references:

  • toLocaleString
  • toLocaleDateString
  • toLocaleTimeString
  • getTimezoneOffset
2 of 16
66

You can do it with moment.js (deprecated in 2021)

It's best to parse your date string from UTC as follows (create an ISO-8601 compatible string on the server to get consistent results across all browsers):

var m = moment("2013-02-08T09:30:26Z");

Now just use m in your application, moment.js defaults to the local timezone for display operations. There are many ways to format the date and time values or extract portions of it.

You can even format a moment object in the users locale like this:

m.format('LLL') // Returns "February 8 2013 8:30 AM" on en-us

To transform a moment.js object into a different timezone (i.e. neither the local one nor UTC), you'll need the moment.js timezone extension. That page has also some examples, it's pretty simple to use.

Note: Moment JS recommends more modern alternatives, so it is probably not a good choice for new projects.

🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleDateString
Date.prototype.toLocaleDateString() - JavaScript | MDN
The toLocaleDateString() method of Date instances returns a string with a language-sensitive representation of the date portion of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.
Discussions

Confused about Date months

Confused about Date months

Got stupidly confused with months, as seems I'm missing something or Date() is acting weird.

I'm aware months in Date() are supposed to start from zero (January: 0, February: 1...).

But creating a Date() from a short 'YYYY-MM' string is funky:

Hi, u/Gualdrapo,

I would like to draw your attention to the Note: section in the mdn webdocs article on Date() constructor:

Note: When parsing date strings with the Date constructor (and Date.parse, they are equivalent), always make sure that the input conforms to the ISO 8601 format (YYYY-MM-DDTHH:mm:ss.sssZ) — the parsing behavior with other formats is implementation-defined and may not work across all browsers.

As can be seen, MM format is required for months. And if you check https://tc39.es/ecma262/#sec-date-time-string-format, it has the below:

MM   is the month of the year as two decimal digits from 01 (January) to 12 (December).

The behavior you are seeing is consistent with the above.

Also, doing "2022-0" returns an invalid date, and "2022-01" returns December 2021...

Try again and see:

const month = new Date("2022-01");
console.log('Month: ' + month.toLocaleDateString('en-US', { year:             'numeric', month: 'long' }));

The above returns "Month: January 2022," not December 2021.

More on reddit.com
🌐 r/learnjavascript
3
1
July 31, 2020
How to get only the timeZone name in JavaScript?
The intent of the methods you are using is that it is choosing appropriate formats for you depending on the user's locale. There is not an option to include the time zone twice, but you can use string concatenation and JavaScript's Intl API to achieve something like what you want: console.log( (new Date()).toLocaleString(["en-US"], {timeZoneName: "short"}) + ' ' + Intl.DateTimeFormat().resolvedOptions().timeZone ); > "5/1/2021, 5:48:19 PM EDT America/New_York" More on reddit.com
🌐 r/Frontend
11
6
May 3, 2021
Hydration Error on Production with Date String
Hi, I am facing the exact same issue as you. I am also getting the exact same hydration errors on prod (Minified React Error #418, #423, #425). I have no errors in development, only on prod. And for me too the errors happen because of the date formatting. I am curious if you found any solution to your problem. More on reddit.com
🌐 r/nextjs
16
10
May 2, 2022
How do we work with the date and datetime in JS?
Depending on how the date data is being used, could possibly just store it as a string. That'll bite you if you need to do any kind of math on it though. More on reddit.com
🌐 r/webdev
32
8
December 14, 2021
🌐
MDN Web Docs
developer.mozilla.org › en-US › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleTimeString
Date.prototype.toLocaleTimeString() - JavaScript | MDN
October 30, 2025 - The toLocaleTimeString() method of Date instances returns a string with a language-sensitive representation of the time portion of this date in the local timezone. In implementations with Intl.DateTimeFormat API support, this method delegates to Intl.DateTimeFormat.
🌐
W3Schools
w3schools.com › jsref › jsref_tolocaledatestring.asp
W3Schools.com
The toLocaleDateString() method returns the date (not the time) of a date object as a string, using locale conventions. Date.toLocaleDateString(locales, options) JavaScript Dates · JavaScript Date Formats · JavaScript Date Get Methods · ...
🌐
Medium
medium.com › geekculture › level-up-your-date-and-time-formatting-skills-in-javascript-866d8b656092
Level Up Your Date and Time Formatting Skills in JavaScript | by Danielle Dias | Geek Culture | Medium
May 26, 2023 - In addition to the specific date ... time portions of a Date object. To get a localized string representation of the full date and time, we can use toLocaleString() without any parameters....
🌐
Lokalise
lokalise.com › home › date and time localization with formats | lokalise
Date and time localization with formats | Lokalise
December 2, 2025 - Oktober 2023 // German locale ... locale (e.g., en-US) The Date.prototype.toLocaleTimeString() method in JavaScript is a handy tool for localizing the time portion of a Date object....
🌐
Phrase
phrase.com › home › resources › blog › a guide to date and time localization
A Guide to Date and Time Localization | Phrase
July 31, 2025 - // English-America date.toLocaleTimeString("en-US", { timeZone: "UTC" }); // => "2:00:00 PM" // Arabic-Egypt date.toLocaleTimeString("ar-EG", { timeZone: "UTC" }); // => "٢:٠٠:٠٠ م" // Hindi-India date.toLocaleTimeString("hi-IN", { timeZone: "UTC" }); // => "2:00:00 pm" // Russian-Russia date.toLocaleTimeString("ru-RU", { timeZone: "UTC" }); // => "14:00:00" // Chinese-China date.toLocaleTimeString("zh-CN", { timeZone: "UTC" }); // => "14:00:00" // Japanese-Japan date.toLocaleTimeString("jp-JP", { timeZone: "UTC" }); // => "2:00:00 p.m."Code language: JavaScript (javascript) 🗒️ Just like Date.toLocaleDateString(), Date.toLocaleTimeString() uses Intl.DateTimeFormat under the hood when it’s available.
🌐
Droidscript
droidscript.org › javascript › Global_Objects › Date › toLocaleDateString().html
dateObj.toLocaleDateString()
The default value for each date-time component property is undefined, but if the weekday, year, month, day properties are all undefined, then year, month, and day are assumed to be "numeric". In basic use without specifying a locale, a formatted string in the default locale and with default options is returned. var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0)); // toLocaleDateString() without arguments depends on the implementation, // the default locale, and the default time zone console.log(date.toLocaleDateString()); // → "12/11/2012" if run in en-US locale with time zone America/Los_Angeles
Find elsewhere
🌐
GeeksforGeeks
geeksforgeeks.org › javascript › javascript-date-tolocaledatestring-method
JavaScript Date toLocaleDateString() Method - GeeksforGeeks
July 11, 2025 - The toLocaleDateString() method in JavaScript is used to convert the date and time of a Date object to a string representing the date portion using the locale-specific conventions.
🌐
Pebble Developers
developer.rebble.io › docs › rockyjs › Date
Date // Pebble Developers
Date.toLocaleDateString(locale, options) This method returns a string with a language sensitive representationof the time portion of this date object. d.toLocaleDateString(undefined, {weekday: 'long'}); String locale · (Optional) The name of ...
🌐
Sentry
sentry.io › sentry answers › javascript › how do i format a date in javascript?
How do I Format a Date in JavaScript? | Sentry
December 15, 2022 - If you are formatting many dates, use Intl.DateTimeFormat(), as it allows you to create an Intl.DateTimeFormat object that you can format multiple times using the format() method. You only define the locales and options once. ... const date = new Date(Date.UTC(2022, 10, 22, 9, 0, 0)); const date2 = new Date(Date.UTC(2022, 11, 22, 9, 0, 0)); const options = { weekday: "long", year: "numeric", month: "long", day: "numeric", }; console.log(date.toLocaleDateString("en-ZA", options)); // Tuesday, 22 November 2022 console.log(date.toLocaleDateString("ko", options)); // 2022년 11월 22일 화요일 const intDateFormat = new Intl.DateTimeFormat("en-ZA", options); console.log(intDateFormat.format(date)); // Tuesday, 22 November 2022 console.log(intDateFormat.format(date2)); // Thursday, 22 December 2022
🌐
Codecademy
codecademy.com › docs › javascript › dates › .tolocaledatestring()
JavaScript | Dates | .toLocaleDateString() | Codecademy
June 2, 2023 - When used without any parameters, .toLocaleDateString() returns a string with the month, day, and year options defaulted to numeric. How they’re arranged and formatted depends on the default locale in which the method was used.
🌐
Reality Ripple
udn.realityripple.com › docs › Web › JavaScript › Reference › Global_Objects › Date › toLocaleDateString
Date.prototype.toLocaleDateString() - JavaScript
var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0)); // toLocaleDateString() without arguments depends on the implementation, // the default locale, and the default time zone console.log(date.toLocaleDateString()); // → "12/11/2012" if run in en-US locale with time zone America/Los_Angeles
🌐
freeCodeCamp
freecodecamp.org › news › how-to-format-a-date-with-javascript-date-formatting-in-js
How to Format a Date with JavaScript – Date Formatting in JS
November 7, 2024 - toLocaleDateString(): This method returns a string representing the date portion of a Date object using the system's local conventions.
🌐
Codú
codu.co › articles › how-to-show-hours-and-minutes-only-with-tolocaletimestring-7dskbbzo
How To Show Hours and Minutes Only With toLocaleTimeString() | by Niall Maher | Codú
This method converts a Date object to a string, using locale settings to display time. But by default, you'll also see the seconds (which, in many use cases, is not what you want.)
🌐
Vultr Docs
docs.vultr.com › javascript › examples › display-date-and-time
JavaScript Program to Display Date and Time | Vultr Docs
December 18, 2024 - Use the toLocaleTimeString() method to extract only the time part from the current date. ... This method outputs the current time formatted according to the user's locale, focusing exclusively on hours, minutes, and sometimes seconds.
🌐
Bugfender
bugfender.com › blog › javascript-date-and-time
The Definitive Guide to JavaScript Date and Time | Bugfender
February 18, 2025 - const date = new Date().toLoca... two dates in JavaScript, you can subtract one Date Object from another to get the difference in milliseconds and then convert that into the desired units (e.g., seconds, minutes, hours, or ...
🌐
DEV Community
dev.to › rsa › perfectly-localizing-date-time-with-intl-datetimeformat-ack
Perfectly localizing date & time with Intl.DateTimeFormat - DEV Community
December 3, 2020 - const dtf = new Intl.DateTimeFormat('pt-BR'); dtf.format(date); //=> "05/11/2020" // equivalent to date.toLocaleDateString('pt-BR') Note the difference: the default, which in my case is 'en-US', uses the M/D/Y format. pt-BR, however, uses D/M/Y with zero left padded day and month values. By default, DateTimeFormat only outputs the date, without the time.
🌐
Codeproject
reference.codeproject.com › javascript
javascript Date.prototype.toLocaleDateString() - CodeProject Reference
November 5, 2021 - var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0)); // toLocaleDateString() without arguments depends on the implementation, // the default locale, and the default time zone console.log(date.toLocaleDateString()); // → "12/11/2012" if run in en-US locale with time zone America/Los_Angeles