[Adaptive Cards - Element Property] - Ensures the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds.

[vagpt]

Target Platforms

Other

SDK Version

1.6

Application Name

Adaptive Cards

Problem Description

Test Environment:
URL: https://adaptivecards.io/
OS Version: Dev (OS Build 27695.1000)
Browser Version: Version 130.0.2849.1 (Official build) dev (64-bit)
Tool: Accessibility Insight for Web

Repro steps:

1. Open the above URL in the edge dev browser.
2. Navigate to the 'Designer' option and press enter key to activate it.
3. Navigate to Element Properties. button and press enter key to activate it.
4. Run the accessibility insight for web tool and observe the issue.

Actual Result:
The contrast between foreground and background colors does not meets WCAG 2 AA minimum contrast ratio thresholds. Currently it is 3.34 which is less than 4.5:1.

Expected Result:
Ensures the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds.
It should be equal to or greater than 4.5:1.

Element path:
.selected.acd-tree-item > .acd-tree-item-text > .acd-data-tree-item-additionalText

Snippet:
[Object]

How to fix:
Fix any of the following:
Element has insufficient color contrast of 3.34 (foreground color: #2d7bb7, background color: #bce2ff, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1.

User Impact:
It will impact the low vision user if the contrast ratio of text is less than 4.5:1 as they will face difficulties to see the elements properly.

WCAG Reference:
https://www.w3.org/WAI/WCAG21/Understanding/use-of-color

“ Have feedback to share on Bugs ? please tag bug as “A11yRCA” and add your feedback in the comment section”

Screenshots

Card JSON

NA

Sample Code Language

No response

Sample Code

No response