Helpful | How to Change Autofill Form Field Background Color [RESOLVED]

Issue:

As you probably know, when a Gravity Form is filled using a browser’s “Autofill” function, the auto-filled form fields usually display a Yellow background color. This is the default color for all browsers and could lead your website visitors into believing there’s something wrong with their auto-filled entries.

Solution:

To solve the above (e.g., change the default Yellow background color to Light Green), please use the following CSS Rule:

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 60px #eff6ef inset!important;
}

Where #eff6ef (Light Green) can be changed to any other Hexacolor of your choice. This solution works for all browsers (confirmed).

Results:

screenshot-autofill-form-field-yellow-to-green

Hopefully, you found this topic useful and will consider applying the shared solution to your website.

Salud!

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.