The <input> tag with a type="time" attribute creates an input field that accepts a time value.
Inside this field is a clock icon. Clicking this icons opens a time picker.
An <input> element of type time>.
Clicking the clock icon opens a time picker. Alternatively, enter the time directly into the field.
<form action="/tutorial/action.html">
<fieldset>
<legend>Select time</legend>
<input type="time" name="time"><br /><br />
<input type="submit" value="Submit">
</fieldset>
</form>
The <input type="time"> creates an input field for time.
Clicking the clock icon inside the control opens the time picker.
The UI of this control varies from browser to browser. In addition, browser support is spotty.
The time field also accepts manual entry which follows a time format.
<input type="time">
Here is when type="time" support started for each browser:
 Chrome
|
20.0 | Jun 2012 |
 Firefox
|
57.0 | Nov 2017 |
 IE/Edge
|
12.0 | Jul 2015 |
 Opera
|
10.1 | Jun 2009 |
 Safari
|
Not Supported |
Back to <input>
