Skip to content

{Linked:Bug4815270}[Adaptive Cards > Designer] - In dark mode, the color contrast ratio of 'Learn more', w.r.t background color is 2.23:1, which is less than 4.5:1 #9070

@vagpt

Description

@vagpt

Target Platforms

Other

SDK Version

1.6

Application Name

Adaptive Cards

Problem Description

Test Environment:
URL: https://adaptivecards.io/designer/
Version 24H2(OS build 26100.2033)
Edge dev Version 132.0.2945.0 (Official build) dev (64-bit)
Tool: Accessibility Insight For Web

Pre-Requisite:
Run the below attached JSON file under 'Copy Card Payload editor.'
Enable the Dark Mode.

Repro Steps:

  1. Open the above URL on the EDGE Dev browser.
  2. Run the Json file.
  3. Navigate to the Preview mode and press enter key to activate it.
  4. Open the tool and check the contrast ratio for the Learn more link and observe the issue.

Actual Result:
In dark mode, the color contrast ratio of 'Learn more', w.r.t background color is 2.23:1, which is less than 4.5:1.

Expected Result:
In dark mode, the contrast ratio of Learn more link should be greater than or equal to 4.5:1._

User Impact:
Most people find it easier to read text when it has a sufficiently high contrast against its background. People with visual disabilities, low vision, limited color perception, or presbyopia are likely to find text unreadable when contrast is too low.

WCAG Reference Link:
https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum

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

Screenshots

Image

json file for bug.txt

Card JSON

NA

Sample Code Language

No response

Sample Code

No response

Metadata

Metadata

Labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions