autocomplete="on" on input fields levels custom styles with browser styles

[evdama]

Using autocomplete="on" on an input field overrides custom styles on an input field with browser default styles. The code to reproduce below:

    <div>
      <label for="full-name" class="block text-grey-900  font-bold">
        Full Name
      </label>
    </div>


    <div>
      <input id="full-name" type="text" placeholder="Jane Doe" autocomplete="on" class="form-input bg-teal-300 border border-blue-600 rounded w-full py-2 px-4 text-grey-800 leading-tight">
    </div>

I can make it work with https://css-tricks.com/snippets/css/change-autocomplete-styles-webkit-browsers/ but that's basically duplicating my styles in non-tw manner.

[psibean]

Yep, this is slightly annoying

It makes sense from a UX perspective the autocomplete style is intended to prompt the user to double-check the fields that were autocompleted. It would be nice if tailwind provided a convenient means to clear these styles and apply our own, similar to focus, active, etc.