Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Low contrast on slider buttons. #4163

Closed
derekjackson-das opened this issue Sep 20, 2024 · 1 comment
Closed

Low contrast on slider buttons. #4163

derekjackson-das opened this issue Sep 20, 2024 · 1 comment
Labels
a11y Accessibility

Comments

@derekjackson-das
Copy link
Collaborator

Issue Description:
The slider buttons in the Controls side bar do not have sufficient contrast for non-text elements. According to WCAG 2.1, the required minimum contrast ratio is 3:1, but the toggles in the "off" state currently have a contrast ratio of about 1.3:1. Low-vision users may have difficulty identifying and using the controls. This contrast issue also affects other toggle buttons and some sliders across the application.

related to #4162

WCAG Criteria:
1.4.11 Non-text Contrast - AA

Screenshot
Screenshot of sliders in the control panel

Screenshot of contrast analyser showing contrast of buttin slider is 1.5 to 1.

Action and Notes:

Adding an outline to the slider button or the entire control should help meet WCAG requirements.
This contrast issue also occurs with other toggle buttons and sliders across the application.
Example fixes:
Screenshot 2024-09-20 at 11 03 06 AM

Screenshot 2024-09-20 at 11 09 15 AM
@danny-avila
Copy link
Owner

danny-avila commented Sep 22, 2024

Closed by #4091

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a11y Accessibility
Projects
None yet
Development

No branches or pull requests

2 participants