[MGTP-People-picker- Style- Custom size properties]: The Luminosity Contrast Ratio of ‘Search for a name’ placeholder text of search edit field is '3.686:1' which is less than 4.5:1.

[Raisul123]

Test Environment: OS Build: Windows 11  Version: 24H2 (OS Build 26058.1400)  Browser: Edge dev  Browser Version 123.0.2400.1 (Official build) dev (64-bit) URL: Overview - Docs ⋅ Storybook (mgt.dev) Tool: Accessibility Insight for web

Repro Steps:

1. Open the above URL.
2. The ‘Microsoft Graph Toolkit Playground' Overview page will get displayed.
3. Navigate to the ‘MGTP-People-picker’ and activate it.
4. Navigate to the ‘Style’ and activate it.
5. Navigate to the ‘Custom size properties’ and activate it.
6. Navigate to the ‘Search for a name’ placeholder text of search edit
7. Check luminosity ratio with AI tool and observe the issue.

Actual Result: The Luminosity Contrast Ratio of ‘Search for a name’ placeholder text of search edit field is '3.686:1' which is less than 4.5:1.

Expected Result: The Luminosity Contrast Ratio of ‘Search for a name’ placeholder text of search edit field should be equal or greater than 4.5:1.

Note: Also Luminosity Contrast Ratio of ‘We didn’t find any matches’ text which is appeared when focus land on search edit field is '4.351:1' which is less than 4.5:1. (PFA)

User Impact: Low vision users would face difficulty in seeing the text if the color contrast ratio of the control is less than 4.5:1.

WCAG Reference: Understanding Success Criterion 1.4.3: Contrast (Minimum) | WAI | W3C

“ Have feedback on bugs logged, please tag bug as “A11yRCA“ and add your feedback in the comment section. “

Attachments: