Bug 250896 - Default styles for input:autofill disregards color-scheme
Summary: Default styles for input:autofill disregards color-scheme
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari Technology Preview
Hardware: Mac (Apple Silicon) macOS 13
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2023-01-20 06:47 PST by Johannes Odland
Modified: 2024-01-29 14:45 PST (History)
5 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Johannes Odland 2023-01-20 06:47:25 PST
UA stylesheet for input:autofill does not respect color-scheme: dark.

The stylesheet sets the background-color to a bright yellow, and color to black, regardless of whether color-scheme is dark, as in the stylesheet below.
This is suboptimal for users visiting dark websites, and authors building sites with support for dark mode. 

```css
input:autofill, input:-webkit-autofill-strong-password, 
input:-webkit-autofill-strong-password-viewable, 
input:-webkit-autofill-and-obscured {
   background-color: rgb(250, 255, 189);background-image: none;color: rgb(0, 0, 0);
}

Chrome on the other switches to a transparent color when in dark-mode, something that works better with the dark color scheme.

```css
input:-internal-autofill-selected {
    appearance: menulist-button;
    background-image: none !important;
    background-color: -internal-light-dark(rgb(232, 240, 254), rgba(70, 90, 126, 0.4)) !important;
    color: fieldtext !important;
}
```
Comment 1 Radar WebKit Bug Importer 2023-01-27 06:48:18 PST
<rdar://problem/104743445>