Library

React Components / v9 (@fluentui/react-components)

System Info

https://master--628d031b55e942004ac95df1.chromatic.com/?path=/docs/theme-color--page

Are you reporting Accessibility issue?

no

Reproduction

https://master--628d031b55e942004ac95df1.chromatic.com/?path=/docs/theme-color--page

Bug Description

Context

Our high-contrast colors were updated by our accessibility team member Ben Truelove.

To-do

Update the current/default Fluent V9 high-contrast colors to the latest HC ramp.

• hcHyperlink from #FFFF00 to #75E9FC
• hcDisabled from #3FF23F to #A6A6A6
• hcHighlight from #1AEBFF to #8EE3F0
• hcCanvas from #000000 to #202020
• hcCanvasText from #FFFFFF to #FFFFFF
• hcHighlighText from #000000 to #263B50
• hcButtonFace from #FFFFFF to #202020
• hcButtonText from #000000 to #FFFFFF

Add an additional high-contrast "desert" ramp.

• hcHyperlink #1C5E75
• hcDisabled #676767
• hcHighlight #903909
• hcCanvas #FFFAEF
• hcCanvasText #3D3D3D
• hcHighlighText #FFF5E3
• hcButtonFace #FFFAEF
• hcButtonText #202020

I expect there to be accessibility warnings when implementing this. Please tag @redongreen for review and any questions.

Logs

No response

Requested priority

Normal

Products/sites affected

Fluent 2 WEB UI

Are you willing to submit a PR to fix?

no

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.