Skip to content

Luminosity contrast ratio of '--rz-secondary' text with its background does not meet the minimum contrast ratio of 4.5:1 in Windows. #1923

@msftedad

Description

@msftedad

Describe the bug
Luminosity contrast ratio of '--rz-secondary' text with its background does not meet the minimum contrast ratio of 4.5:1 in Windows. The low contrast ratio between the '--rz-secondary' text and its background in Windows can greatly impact users with visual impairments. This issue makes it challenging for them to read the text, which can result in missed information and a diminished user experience.

To Reproduce
Steps to reproduce the behavior:

  1. Open URL: Blazor Color Utilities | Free UI Components by Radzen in the latest edge browser.
  2. Navigate to '--rz-secondary' content in theme colors section.
  3. Turn on the accessibility insights for windows tool.
  4. Select Foreground color (#FFFFFF) and Background color (#E91E63) of 'Search' and 'more options' icon using color picker.
  5. Verify whether contrast ratio between '--rz-secondary' text with its background does meet the minimum contrast ratio or not.

Alternatively link your repo with a sample project that can be run.
https://blazor.radzen.com/colors?theme=material

Expected behavior
Contrast ratio between '--rz-secondary' text with its background should be greater than or equal to the required ratio of 4.5:1 in Windows.

Screenshots
If applicable, add screenshots to help explain your problem.

Contrast.ratio.between.--rz-secondary.text.with.its.background.does.not.meet.the.minimum.contrast.ratio.in.Windows.mp4

Desktop (please complete the following information):
OS: Windows 11 Enterprise Insider Preview Version 24H2(OS Build 26120.2415)
Browser: Microsoft Edge Version 132.0.2957.26

Additional context
NA

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions