pwa-builder / PWABuilder

The simplest way to create progressive web apps across platforms and devices. Start here. This repo is home to several projects in the PWABuilder family of tools.
https://docs.pwabuilder.com
Other
2.54k stars 273 forks source link

{Freeway-Bug}[PWA Builder]: Color contrast ratio is less than 3:1 for the close icon present on the discord popup. #4744

Open Anshi0420 opened 2 weeks ago

Anshi0420 commented 2 weeks ago

What happened?

The close icon on the Discord popup does not meet the minimum color contrast ratio of 3:1 against its background, it is 2.7:1.

How do we reproduce the behavior?

Repro Steps:

  1. Open the above URL.
  2. Now check the color contrast ratio for the close button present on the discord pop up.
  3. Observe the issue.

What do you expect to happen?

The close icon should have a color contrast ratio of at least 3:1 with its background to ensure readability and accessibility.

What environment were you using?

Test Environment: OS Build: Windows 11 Enterprise Insider Preview 24H2 (26120.461) Edge Browser: Version 123.0.2400.1 (Official build) dev (64-bit) URL: https://www.pwabuilder.com/ Tool: Color contrast Analyzer

Additional context

User Impact: Users with visual impairments, particularly those with low vision or color blindness, may struggle to perceive or locate the close icon on the Discord popup. This can lead to difficulty in dismissing the popup or navigating the interface effectively, impacting the overall usability and accessibility of the application for these users.

WCAG Reference: https://www.w3.org/WAI/WCAG22/Understanding/non-text-contrast

Attachments: WCAG1 4 11_Color contrast ratio is less than for the close icon present on the discord popup