Align Website Themes with System Dark Mode Preference

Brave Feature Requests Android Requests
, , , ,
1

Many users prefer their browsing experience to seamlessly match their system-wide dark/light theme settings. Currently, Brave Browser allows users to enable a global dark mode, but websites themselves often do not adjust their themes dynamically based on the system’s dark mode preference. This results in inconsistencies, forcing users to manually toggle website-specific dark modes or rely on extensions.

Proposed Solution:
Introduce a native setting in Brave Browser that automatically aligns website themes with the user’s system-level dark/light mode preference. This would work as follows:

  1. When the system dark mode is enabled, Brave would request websites to adopt their built-in dark themes (if available) via the prefers-color-scheme CSS media query.
  2. For websites that lack native dark mode support, Brave could apply a filter-based dark mode (similar to the existing “Force Dark Mode” flag) as a fallback.
  3. Allow users to override this behavior via a simple toggle in settings (e.g., “Always use system theme,” “Always light,” “Always dark”).

Expected Behavior:

  • Brave detects the OS-level dark/light mode setting.
  • Websites with native dark/light themes automatically switch to match the system preference.
  • For unsupported sites, Brave’s built-in dark mode activates as a fallback.
  • Users retain control to manually override per-site or globally.

Additional Considerations:

  • Ensure compatibility with existing flags like #enable-force-dark for consistency.
  • Add an option to disable the fallback filter for users who prefer native website styling.
  • Sync the setting across devices for logged-in Brave Sync users.

Benefits:

  • Streamlined experience: Reduces the need for manual adjustments or third-party extensions.
  • Consistency: Aligns browser behavior with OS-level expectations, similar to apps like Slack or macOS/iOS native apps.
  • Accessibility: Helps users with light sensitivity or visual impairments maintain a cohesive viewing experience.

Closing:
By prioritizing system-level theme alignment, Brave can further cement its reputation as a privacy-focused and user-centric browser. This feature would resonate with users who value both aesthetics and seamless integration with their device’s ecosystem.

Upvote this post if you’d like to see Brave implement this! Share your thoughts below on how you’d use this feature. :lion: