JavaScript Date toLocaleDateString() Method

What You’ll Learn

toLocaleDateString() formats the date portion of a Date for human readers using locale rules. Pass a language tag and options to control weekday names, numeric vs long months, and preset styles—ideal for dashboards, birthdays, and international apps.

Introduction

Machine formats like toISOString() are perfect for APIs, but users expect dates that match their language and region. toLocaleDateString() uses the Intl engine to produce readable calendar labels.

Unlike toDateString(), which always follows a fixed ddd mmm dd yyyy pattern, locale formatting adapts separators, order, and month names. For storage and JSON, still prefer toJSON() or ISO strings—use toLocaleDateString() at the presentation layer.

Understanding the toLocaleDateString() Method

Date.prototype.toLocaleDateString([locales[, options]]) returns a localized string for the calendar date of a Date instant:

• Default — date.toLocaleDateString() uses the runtime’s default locale and short date style.
• Locales — a BCP 47 tag ('en-US', 'fr-FR') or array of fallbacks.
• Options — control fields like weekday, month, day, year, or preset dateStyle.
• timeZone — optional IANA name (for example, 'America/New_York') to format the date as it appears in that zone.

📝 Syntax

dateObj.toLocaleDateString([locales[, options]])

Parameters

• locales (optional) — string or array of BCP 47 locale tags.
• options (optional) — object with Intl date fields or dateStyle / timeZone.

Return value

• A localized date string (no time component).
• "Invalid Date" if the Date is invalid.

Examples Gallery

Open DevTools Console (F12) or use Try-it links. Locale output may vary slightly by engine; examples use fixed dates for clarity.

const date = new Date(2026, 2, 15);
const label = date.toLocaleDateString();

console.log(label); // e.g. "3/15/2026" in en-US

3/15/2026  (en-US example; your locale may differ)

const date = new Date(2026, 2, 15);

const longUS = date.toLocaleDateString('en-US', {
  weekday: 'long',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
});

console.log(longUS); // "Sunday, March 15, 2026"

Sunday, March 15, 2026

const meeting = new Date(Date.UTC(2026, 2, 1));

const locales = ['en-US', 'fr-FR', 'de-DE', 'ja-JP'];

for (const locale of locales) {
  console.log(
    locale + ':',
    meeting.toLocaleDateString(locale, { dateStyle: 'long' })
  );
}

en-US: March 1, 2026
fr-FR: 1 mars 2026
de-DE: 1. März 2026
ja-JP: 2026年3月1日

const birthday = new Date(1990, 4, 20);
const opts = { dateStyle: 'full' };

console.log(birthday.toLocaleDateString('en-US', opts));
// "Tuesday, May 20, 1990"

console.log(birthday.toLocaleDateString('en-US', { dateStyle: 'short' }));
// "5/20/90"

Tuesday, May 20, 1990
5/20/90

// 2026-03-01 01:30 UTC
const instant = new Date(Date.UTC(2026, 2, 1, 1, 30, 0));

console.log(instant.toLocaleDateString('en-US', { timeZone: 'UTC' }));
// "3/1/2026"

console.log(instant.toLocaleDateString('en-US', { timeZone: 'America/Los_Angeles' }));
// "2/28/2026" — still Feb 28 in Pacific time

3/1/2026
2/28/2026

🚀 Common Use Cases

• User profiles — show birthdays as May 20 in the visitor’s locale.
• Dashboards — column headers and row labels with dateStyle: 'medium'.
• Multilingual apps — switch locale tag when the user changes language.
• Email templates — long weekday + month for event reminders.
• Invoice dates — regional numeric formats without manual padding.
• Fallback UX — try ['user-locale', 'en-US'] when a locale is unsupported.

📝 Notes

• Date only—no hours, minutes, or seconds in the output.
• Read-only: does not mutate the Date.
• Output varies by locale and options; do not parse locale strings back to dates in production.
• Store ISO or epoch values; format with toLocaleDateString() at display time.
• Invalid dates return "Invalid Date"—unlike toISOString() which throws.
• Do not pass time-only options like hour or minute—use toLocaleString() for those.

💡 Best Practices