Strongly typed inputs · iOS & Android

Every keyboard your
input type can summon

See the exact mobile keyboard each input type, inputmode, and enterkeyhint produces on iOS and Android, before you ship.

Open Playground →Jump to gallery

No SDK. No guesswork. Just input types and keyboards.

// layouts9 presets

The keyboard arrangement itself, controlled by type and inputmode. Focus each preset and compare what comes up.

Default texttype=text Emailtype=email URLtype=url Telephonetype=tel Numeric (integer)inputmode=numeric Decimalinputmode=decimal type="number"type=number Searchtype=search Password (secure entry)type=password

// enter-keys7 presets

enterkeyhint relabels the return key. Most labels only render when the input sits inside a form.

enterkeyhint="enter"enterkeyhint=enter enterkeyhint="go"enterkeyhint=go enterkeyhint="done"enterkeyhint=done enterkeyhint="next"enterkeyhint=next enterkeyhint="previous"enterkeyhint=previous enterkeyhint="search"enterkeyhint=search enterkeyhint="send"enterkeyhint=send

// autofills5 presets

autocomplete-driven offers above the keyboard: saved contacts and cards, OTP codes from SMS, and password suggestions.

One-time code (SMS autofill)inputmode=numeric Strong password suggestiontype=password Saved password filltype=password Contact autofill (name)type=text Credit card autofillinputmode=numeric

// inputs5 presets

Inputs that summon native picker UI instead of a keyboard: dates, times, and selects. Since iOS 14 these float near the control rather than docking to the bottom.

Date (calendar)type=date Month (the wheel)type=month Timetype=time Date + timetype=datetime-local Select<select>

// misc6 presets

Text-handling behaviors and non-standard editing surfaces: autocapitalization, autocorrect, textarea, contenteditable, and suppressed keyboards.

inputmode="none"inputmode=none Textarea (multiline)<textarea>contenteditable<contenteditable>autocapitalize="words"type=text autocapitalize="characters"type=text Autocorrect offtype=text

// recipesall recipes →

The right answer, not just the picture — verdict, markup, and traps for the common input jobs.

The right input for card numbersA card number, filled from the browser's saved cards — or scanned with the camera on iOS.The right input for currency amountsA money amount with decimals — 19.99 — entered on a digit pad.The right input for email addressesAn email address, typed without autocorrect surprises or filled from the browser's own suggestion.The right input for one-time codesA six-digit SMS code the user should never have to type by hand.The right input for passwordsA password field that surfaces the saved credential — or generates a strong new one.The right input for phone numbersA phone number, typed on the dial pad or filled from the user's own contact card.The right input for search fieldsA search box whose keyboard says Search on the return key.

Native-only

The keyboards the web can't reach.

The gallery stops where WebKit does. We're building a companion app to test every native keyboard, picker, and accessory bar on a real device, the controls no HTML can summon.

One email when it ships. Nothing else.

What only native can summon

Full date wheel
Bottom-docked picker
Cancel / Done bar
Custom keypad inputView
Wheel time picker

Every keyboard yourinput type can summon

The keyboards the web can't reach.

What only native can summon

Every keyboard your
input type can summon