CSS :autofill

The :autofill pseudo-class matches form controls whose value was filled automatically by the browser. It styles the input itself after autofill, not the autocomplete suggestion menu.

Syntax

input:autofill {
  border-color: #2563eb;
}

input:-webkit-autofill {
  box-shadow: 0 0 0 1000px #eff6ff inset;
}

Example

Result:

Browsers apply this selector only after they autofill a saved value.

Important note

You cannot turn autofill off with -webkit-autofill: none. Use form attributes such as autocomplete to guide browser behavior, and use CSS only for styling the autofilled control.