Open delan opened 1 month ago
- Matching pairs of system colors must guarantee contrast
One note on this: if a user has chosen the system colors (think of Windows High Contrast Mode / Contrast Themes), then the user may have intentionally chosen low contrast pairings (to reduce halation or being stuck working with a migraine).
As long as a user has an interface to select these colors (and Windows 11 Contrast Themes does not offer the granularity that prior versions did), then the must statement should be about honoring the user choice versus ensuring a minimum contrast.
Since Windows 11 lets users choose Highlight
and HighlightText
, those might be your defaults for now (until Windows 11 provides users a way to set any new color keywords you propose).
The CSS Working Group just discussed [css-pseudo-4] system colors for ::search-text
.
What should the default UA styles for ::search-text (#3812) be in impls that support it? We could add system colors analogous to ‘Highlight’ + ‘HighlightText’ or ‘Mark’ + ‘MarkText’:
Major impls that use a fixed background color to highlight search results also use a fixed foreground color (demo). Firefox uses fixed background and foreground colors, but swaps them if that would improve contrast, which is allowed for UA styles per #6150. Safari uses fixed background and foreground colors for the current search result (black on yellow NSTextFinder bubble), but does not use color to highlight other search results.
As a result, one drawback of this approach is, in browsers like Safari that don’t use color to highlight search results, the new system colors won’t mimic the UA default colors for search results, because such UAs would need to define ‘Search’ and ‘SearchText’ as ‘transparent’ and ‘currentColor’ respectively, and I’m not sure that’s allowed. But I would argue against allowing that anyway, in favour of just accepting the inconsistency, for two reasons:
Screenshots of major impls
![image](https://github.com/w3c/csswg-drafts/assets/465303/0a8c1b4e-7a66-4a62-b7bf-f839de21db97) ![image](https://github.com/w3c/csswg-drafts/assets/465303/f2d49d8c-b016-4ef4-ac11-4efd8a6a4d09) ![image](https://github.com/w3c/csswg-drafts/assets/465303/262173e7-40d5-40b4-a4b4-6a6db8f94606)