Menu
Forms & Inputs
<input> Types
text, email, password, number, date, file, color, range, and more.
1Pick the Right Type
The type attribute changes validation, on-screen keyboard, and browser UI. Use type="email" instead of type="text" so mobile keyboards show @, etc.
Example Code
<input type="text" placeholder="Name" />
<input type="email" placeholder="you@site.com" />
<input type="password" />
<input type="number" min="0" max="100" step="5" />
<input type="date" />
<input type="time" />
<input type="file" accept="image/*" />
<input type="color" value="#4f46e5" />
<input type="range" min="0" max="100" />
<input type="tel" />
<input type="url" />
<input type="search" />Finished reading?
Mark this topic as complete to track progress.