cssfirefoxinputautofill

Remove new Firefox autofill color


A few days ago my Firefox Developer Edition updated to version 67.0b2 (64 bit). Since then all autofilled input fields have a yellow background, on literally every website.

How can I get rid of the yellow autofill color?

Changing inset box-shadow color doesn't seem to work like it does in Chrome.


Solution

  • Firefox 94 and newer

    Just change the input's background color in your css:

    input:autofill {
      background: #fff; /* or any other */
    }
    

    If you wish to remove the autofill background only in your Firefox browser, set layout.css.autofill.background to false in about:config.

    Firefox 67 (2019-05-21) - 94 (2021-11-02; excluding)

    Add this to your css:

    input {
      filter: none;
    }
    

    Why? At the bottom of view-source:resource://gre-resources/forms.css we can see this:

    :-moz-autofill, :-moz-autofill-preview {
      filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%);
    }
    

    And that is the cause of the yellow autofill background color.