[MGTP Person Card-Style - Custom size properties]: The Luminosity Contrast Ratio of ‘Finance’ text is '3.34:1' which is less than 4.5:1.
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:
- Open the above URL.
- The ‘Microsoft Graph Toolkit Playground' Overview page will get displayed.
- Navigate to the ‘MGTP-Person-Card’ and activate it.
- Navigate to the ‘Style’ and activate it.
- Navigate to the ‘Custom size properties’ and activate it.
- Check luminosity ratio of ‘Finance’ text with AI tool and observe the issue.
Actual Result: The Luminosity Contrast Ratio of ‘Finance’ text is '3.34:1' which is less than 4.5:1.
Expected Result: The Luminosity Contrast Ratio of ‘Finance’ text should be equal or greater than 4.5:1.
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: