Skip to main content

Feature Request: Support prefers-color-scheme and Default Theme Selection

I would love to see FluentCommunity support the browser's native prefers-color-scheme setting, along with an option to define a default theme for new users.

Why this would be useful

Currently, if a community wants Dark Mode to be the default experience, the available solutions rely on custom JavaScript snippets and localStorage manipulation. While these work, they can introduce issues such as a brief flash of the Light theme before Dark Mode is applied.

Using prefers-color-scheme would provide a much smoother user experience:

  • Users who prefer dark interfaces at the operating system/browser level would automatically see Dark Mode.
  • Users who prefer light interfaces would automatically see Light Mode.
  • No flash of the incorrect theme on first load.
  • No custom JavaScript required.
  • Better support for PWAs and mobile devices.
  • More consistent behavior across browsers and operating systems.

Suggested options

Community Customizer β†’ Theme Settings

Default Theme

  • System (prefers-color-scheme)
  • Light
  • Dark

This would allow community owners to choose whether they want to respect the user's system preference or force a specific default theme for new users.

User-selected preferences could still override the default and continue to be stored normally.

Example Behavior

  • System β†’ Follow the user's operating system/browser preference on first visit.
  • Dark β†’ New users see Dark Mode by default.
  • Light β†’ New users see Light Mode by default.

After a user manually changes the theme, their preference should continue to be remembered and take precedence over the default setting.

I believe this would improve both performance and user experience while eliminating the need for various dark-mode workarounds currently shared in the community.

We will look into this and review the matter, thank you.

Ron Dover

Tawsif Ahmed Riyad, thank you too for such an amazing product and support. I mean it!