zero·style

Dictionary entry

input mask

View related-term graphUse in a brief
Was this helpful?
UI / UXCurated · verified

A pattern that shapes what a user types as they go, automatically adding formatting like slashes in a date or spaces in a card number.

Synonyms

  • field mask
  • format mask
  • masked input

Related terms

In plain words

  • the box that adds the slashes in a date for you
  • auto-formatting as you type

Usage example

An input mask turns the phone number into (555) 123-4567 as the user types the digits.

Don't confuse with…

  • placeholder textAn input mask actively formats what is typed; placeholder text is only a passive example that disappears.

Categories

  • Forms & inputs

Related-term graph

Two hops from input mask — click a term to open its entry, or re-center the graph on it

Focus term

Directly related

Two hops away

  • Relatedinput mask related of form validation
  • Relatedinput mask related of helper text
  • Relatedinput mask related of placeholder text
  • Relatedinput mask related of text field
  • Relatedform validation related of error message
  • Relatedhelper text related of error message
  • Relatedplaceholder text related of helper text
  • Relatedform validation related of inline validation
  • Relatedform validation related of input mask
  • Relatedplaceholder text related of input mask
  • Relatedtext field related of label
  • Relatedhelper text related of label
  • Relatedplaceholder text related of label
  • Relatedtext field related of placeholder text
  • Relatedhelper text related of placeholder text
  • Relatedform validation related of required field
  • Relatedtext field related of text area
  • Relatedplaceholder text related of text field

Stop describing. Start naming.

Turn a plain-language description into a designer-ready brief in minutes.

Start a brief