CodeForPhilly / CodeForPhilly/balancer-main

The subtext under some page titles is too light and not accessible.

Open
#332 5 comments 0 reactions 1 assignee Claimed by @StubberG3 View on GitHub
Good for newcomers
Dominant language
TypeScript
Stars
21
Forks
19
PR merge metrics
No merged PRs in 30d

Description

UI Work Request by Suzanne Hunter, @sueuxdesigner
Date: 8/7/25

Image
Image
Image

has inadequate contrast to the white background and is not accessible to color-blind and visually impaired users. For the following pages:
https://balancertestsite.com/
https://balancertestsite.com/medications
https://balancertestsite.com/feedback

You can see the font-color CSS in code for that selection is rgb(156,163,175 / var(--tw-text-opacity, 1). (see image FixSubtextColorContrast01.png)

Converting that to a Hex value, that gray is #9CA3AF.
When #9CA3AF is run through an accessibility color check like https://www.accessibilitychecker.org/color-contrast-checker/ ,
That color does not pass a readability test (see FixSubtextColorContrast02.png).

Please change that gray to a darker value like #4f5763 or rgb(79, 87, 99), which does pass the test (see FixSubtextColorContrast03.png).

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.