Bug 236010 – AX: Color and background-color properties for <select> have low colour contrast

• Component: Accessibility
• Status: NEW

[Owen Jones]

Created attachment 450633 [details]
Screenshot of WebAIM color contrast result and live page example

##Steps to reproduce
1. Open an iOS Safari browser (version 15)
2. Go to a webpage with a <select> element which uses the default color and background-color properties (for example, https://www.gov.uk/search/all?keywords=benefits&order=relevance) 
3. Check what the <select> element’s background colour and 

##Expected behaviour
The <select> element should have an adequate colour contrast between its background colour and font colour.

To meet WCAG colour contrast criteria for small text, that would be a ratio of at least 4.5:1 for AA, and ideally a ratio of 7:1 or greater for AAA.

Currently, the colours for Chromium are set as #000 for the font and #FFF for the background, which is an excellent colour contrast ratio of 21:1.


##Actual behaviour
Currently the <select> font and background have a colour contrast ratio of 3.31:1. This is well below the 4.5:1 ratio recommended in WCAG 2.0 for AA compliance.

The current defaults are:
* #E9E9EA for the background
* #007AFF for the font

Permalink showing the colour contrast report: https://webaim.org/resources/contrastchecker/?fcolor=007AFF&bcolor=E9E9EA

[Radar WebKit Bug Importer]

<rdar://problem/88373912>