HTML Input Types — Complete Reference

Every HTML <input> type with live examples, attributes, browser support & mobile keyboard info

22 Input Types 6 Categories 100% Interactive
No input types match your search.

Key Features

Live Examples

Every input type renders live — interact with them directly in the browser to see real behavior.

📱

Mobile Keyboard Info

See exactly which virtual keyboard each type triggers on iOS and Android devices.

Validation Rules

Built-in browser validation for each type — pattern matching, range checks, and required fields.

📋

Copy Snippets

One click to copy production-ready HTML for any input type. Paste directly into your project.

Frequently Asked Questions

What is the difference between text and search input types?
The search type is semantically for search fields. Browsers may style it differently (rounded corners, clear X button). It also triggers a search-optimized keyboard on some mobile devices. Functionally, both accept free-form text, but search signals intent to browsers and assistive technology.
Which input types have built-in browser validation?
email, url, number, tel (with pattern), date/time variants, and file (with accept) all have built-in validation. Required fields, min/max, minlength/maxlength, and pattern attributes add further constraints. Browsers show native error tooltips when validation fails on form submit.
How do I style input types consistently across browsers?
Use appearance: none or appearance: textfield to strip native styling, then apply your own. For range, color, file, and date inputs, you'll need vendor-specific pseudo-elements (::-webkit-slider-thumb, ::-webkit-color-swatch, etc.). Normalize.css or modern-CSS-reset can help as a base layer.

Stay Updated

Get notified when we add new input types, browser updates, or HTML5 tips.