About the HTML Date & Time Input Generator
Five input types cover dates and times, and each expects its own value format. A date takes 2026-03-01, a time takes 14:30, a datetime-local joins them with a T as 2026-03-01T14:30, a month takes 2026-03 and a week takes the ISO form 2026-W09. Get the format wrong and the browser ignores your value without any message, which is the single most common reason a date field appears blank. The min and max attributes use the same format as the type they sit on.
The step attribute is measured in seconds for time and datetime-local, so 900 gives quarter hour increments and 60, the default, hides the seconds spinner. For a date input the step counts days, so 7 restricts the picker to one weekday.
What you see on screen is out of your hands. Each browser draws its own picker, and the display order of day, month and year follows the visitor operating system locale rather than the page language, so the same field shows 01/03/2026 in London and 03/01/2026 in Chicago. The submitted value stays ISO regardless. There is no time zone in datetime-local, so store the visitor offset separately when it matters. To convert what you receive, try the Date Format Converter.
How to use
- Pick the input type you need.
- Set the label and field name.
- Enter min, max and a default value in that type format.
- Add a step for fixed intervals, then copy the markup.
Common questions
- Why is my default date ignored?
- The value attribute must match the type format exactly, such as 2026-03-01 for date. Anything else is discarded without an error.
- Can I control how the date looks on screen?
- No. The picker and display order come from the browser and the visitor operating system locale. Only the submitted ISO value is fixed.
- What unit is step in?
- Seconds for time and datetime-local, days for date, months for month and weeks for week.
- Does datetime-local include a time zone?
- No, as the name says it is local and carries no offset. Capture the zone separately if the exact instant matters.