List Of New Input Types In HTML 5

Introduction

In this article, I will demonstrate new input types in HTML 5. HTML 5 introduces several input types like Date, DateTime, DateTime-local, time, week, month, email, tel, URL, search, range, color, and number to improve the user experience and to make the forms more interactive. However, if a browser fails to recognize these new input types, it will treat them like a normal text box.

date	It allows the user to select a date from a drop-down calendar.
DateTime	It allows the user to select a date and time along with time zone
time	It allows the user to enter time.
DateTime-local	It allows the user to select a local date and time
week	It allows the user to select a week and year from a drop-down calendar.
month	It allows the user to select a month and year from a drop-down calendar.
email	It allows the user to enter an e-mail address.
tel	It allows the user to enter the phone number with a specific pattern.
URL	It allows the user to enter a website URL
search	It's a text field for entering a search string
range	It allows the user to range the value with the slider.
number	It allows the user to enter a numeric value with the increase and decrease arrow.
color	It allows the user to select a color from the color picker

The date input type in HTML 5 allows the user to select a date from the datepicker calendar. It has got a next button and a pre-button with a closing round button in the center of next and pre. Below is the example of the date input type in HTML 5.