Input Types Cheat Sheet

The humble input field. Or maybe not so humble… This handy cheat sheet will help you quickly reference all the different text and temporal input types available in HTML. The next time you need to collect information from your users, make sure you are using the right input for the job.

Text Inputs

Name	Code	Example
Text input	<input type="text" />
Search input	<input type="search" />
Number input	<input type="number" />
Email input	<input type="email" />
Password input	<input type="password" />
Telephone input	<input type="tel" />
URL input	<input type="url" />

Temporal Inputs

Name	Code	Example
Date input	<input type="date" />
Time input	<input type="time" />
Month input (Chrome/Edge only)	<input type="month" />
Week input (Chrome/Edge only)	<input type="week" />
Datetime input	<input type="datetime-local" />