HTML: input placeholder

The placeholder attribute displays a short hint inside an empty input field.

What you will learn

Minimal example

<label for="phone">Phone number</label>
<input id="phone" name="phone" type="tel"
  placeholder="e.g. 555-0100">

The label remains visible while the placeholder gives an example of the expected format. The placeholder disappears when the user starts typing.

Use it for hints, not names

A placeholder has low contrast in many browsers and is not a reliable accessible name. Always provide a label or another appropriate naming technique. Put required instructions and error messages outside the placeholder.

Common mistakes