Feature description
Improve text and UI element color contrast in the Light Mode theme to meet standard accessibility guidelines.
Problem this solves
Currently, navigating the application in light mode is frustrating because much of the secondary text and many UI controls use very pale grey colors on a white or light grey background. This results in poor legibility, causing eye strain and making the app difficult to use for individuals with visual impairments or anyone viewing the screen in a brightly lit environment. Specifically, inactive buttons and instructional text are barely visible.
Proposed solution
Update the light mode CSS color palette to ensure all text and interactive elements meet at least the WCAG (Web Content Accessibility Guidelines) AA standard for contrast ratios (4.5:1 for normal text, 3:1 for large text and UI components).
Alternatives considered
Forcing Dark Mode: Defaulting all users to dark mode could solve the contrast issue, but it removes user choice for those who genuinely prefer or need a light interface.
High Contrast Toggle: Creating a third "High Contrast" theme. While helpful, the default Light Mode should still be legible on its own without requiring users to find a special accessibility toggle.
Additional context
The contrast issues are highly noticeable in several areas of the app, as seen in the provided screenshots:
Feature description
Improve text and UI element color contrast in the Light Mode theme to meet standard accessibility guidelines.
Problem this solves
Currently, navigating the application in light mode is frustrating because much of the secondary text and many UI controls use very pale grey colors on a white or light grey background. This results in poor legibility, causing eye strain and making the app difficult to use for individuals with visual impairments or anyone viewing the screen in a brightly lit environment. Specifically, inactive buttons and instructional text are barely visible.
Proposed solution
Update the light mode CSS color palette to ensure all text and interactive elements meet at least the WCAG (Web Content Accessibility Guidelines) AA standard for contrast ratios (4.5:1 for normal text, 3:1 for large text and UI components).
Alternatives considered
Forcing Dark Mode: Defaulting all users to dark mode could solve the contrast issue, but it removes user choice for those who genuinely prefer or need a light interface.
High Contrast Toggle: Creating a third "High Contrast" theme. While helpful, the default Light Mode should still be legible on its own without requiring users to find a special accessibility toggle.
Additional context
The contrast issues are highly noticeable in several areas of the app, as seen in the provided screenshots: