Dark Mode with Theme Selection

[cld-vasconcelos]

Description

To enhance user experience and accessibility, we need to implement a dark mode feature that allows users to choose between three display options: light mode, dark mode, and system default. This will provide a more comfortable viewing experience, especially in low-light environments, while also respecting system-wide theme preferences.

Requirements

• Implement a dark mode UI theme that applies to all interface elements consistently.
• Provide a theme selection option in the settings with three choices:
  • Light mode: Always use the light theme.
  • Dark mode: Always use the dark theme.
  • System default: Automatically match the user’s OS/system theme preference.
• Ensure that the selected theme persists across sessions.
• Apply smooth theme transitions when switching between modes.
• Verify accessibility compliance (e.g., contrast ratios, readability).

Acceptance Criteria

• A theme selection option is available in the settings.
• Users can switch between light mode, dark mode, and system default.
• The selected theme persists across user sessions.
• The UI updates seamlessly when changing themes.
• Dark mode follows accessibility best practices (e.g., sufficient contrast, readable text).

[cld-vasconcelos]

OpenHands started fixing the issue! You can monitor the progress here.