CSS ::placeholder Pseudo-element

Definition and Usage

CSS ::placeholder The pseudo-element is used to set <input> or <textarea> Style of the placeholder text of the element.

The placeholder text is set through the placeholder attribute, which describes the hint for the expected value of the field.

Tip:In most browsers, the default color of placeholder text is light gray.

Example

Change the color and opacity of the placeholder text in the input field:

input::placeholder {
  color: red;
  opacity: 0.5;
}

Try It Yourself

CSS Syntax

::placeholder {
  css declarations;
}

Technical Details

Browser Support

The numbers in the table indicate the first browser version that fully supports this pseudo-element.

Related pages

CSS Reference::placeholder-shown pseudo-class