Input mask.
Guides entry into a defined visual format.
See it in context
What it is
An input mask can insert separators or show expected positions for structured values. It should make correction and paste easier instead of rejecting otherwise valid input unexpectedly.
When to use it
Show the expected format and normalize pasted values without discarding useful characters.
Know the difference
Validation checks correctness; a mask mainly guides how a value is presented during entry.
Across platforms
Web
Use a labeled native input and its appropriate type, inputmode, and autocomplete hints. Browser presentation and the available autofill UI vary.
iOS · iPadOS · Android
Choose the keyboard and content type for the value being entered. Keep the field visible above the on-screen keyboard and preserve the user’s selection.
macOS · Windows · Linux
Support ordinary keyboard editing, selection, paste, and undo. A desktop field should not depend on a touch-only accessory keyboard.
Go to the source
Primary documentation for the pattern and its platform conventions.