Configuring locale override for HTML5 <input type=date> picker

Answer

There is no HTML attribute that can reliably change the language or format shown by the native <input type="date"> picker. Browsers derive the UI from the operating‑system locale or the Accept‑Language header, and most ignore the lang attribute on the element or the page. If you need a guaranteed, language‑consistent UI, the only practical path is to replace the native picker with a JavaScript date‑picker library that exposes a locale configuration.

Why the native picker won’t cooperate

• Chrome, Firefox, Edge, and Safari all implement the picker independently; only a handful of browsers honor lang on the <input> in a predictable way.
• Even when lang works, the format is still tied to the OS locale, not the attribute, so the value submitted remains the canonical YYYY‑MM‑DD.
• There is no future‑proof attribute in the HTML5 spec to override this behaviour.

Recommended steps for a consistent locale UI

1. Detect target browsers. If your audience is limited to, say, Chrome 90+ and Safari 15+, you can try the lang trick first:

   <input type="date" lang="fr">

   Check the picker; if it still shows the default locale, fall back to a polyfill.
2. Choose a polyfill. Libraries such as Flatpickr or Pikaday allow explicit locale configuration:

   import flatpickr from "flatpickr";
   import "flatpickr/dist/l10n/fr.js";
   flatpickr("#date", { locale: "fr" });

   These maintain keyboard navigation and ARIA roles when initialized with the altInput option.
3. Ensure accessibility. Verify that the polyfill emits role="textbox" and aria-label attributes, and that screen‑reader announcements match the displayed format.
4. Fallback for environments without JavaScript. Keep a hidden <input type="date"> as a graceful degradation fallback; it will still submit the ISO string.

When you might not need a polyfill

• If your user base is confined to a single locale that matches the OS setting, the native picker may suffice.
• For very lightweight pages where adding a library is undesirable, you can accept the mismatch between UI and submitted value and format the value on the server side.

What to tell me next

If you are targeting a specific set of browsers or devices, let me know which ones. That will narrow the recommendation to a more precise workaround.