Meta theme-color is not respecting current color scheme

Hi, the problem described in these two topics:

Is still occurring for me (testing latest/trial version of hosted Discourse)

@mk0r I can’t reproduce this problem here on Meta. I use the Grey Amber theme/color scheme here which isn’t the default theme for Meta:

And the theme-color meta tag has the right color for me:

<meta name="theme-color" content="#36393e">

#36393e is the header background color of the Grey Amber scheme. If I open Meta in an incognito window without logging in, the theme-color meta tag has the header background of the default color scheme (the Light scheme):

<meta name="theme-color" content="#ffffff">

Have you tried cleaning the browser cache/cookies for your site? If that doesn’t help, can you try and see if you can reproduce this issue here on Meta and share the steps to reproduce the issue?


Thank you for checking, I am able to reproduce it — it’s specifically in relation to dark mode.

theme-color stays the same as when in default/light mode, for me at least, here on meta and on my installation.

I even just tried to add this to the head:

<meta name="theme-color" media="(prefers-color-scheme: dark)" content="black" />

It shows in the source but isn’t affecting anything, maybe because the first meta tag doesn’t specify prefers-color-scheme: light?

The main issue for me is the bright status bar clashing badly with the dark page on mobile and it being bright white on the scroll to refresh

Just signed up to comment as I think this is the same issue I’m having.

Using what I think you call the progressive web app (on Android 13, the install app option when viewing a Discourse forum on Chrome, in this instance it is the app correctly reflects system dark mode settings but the status bar stays in light mode. This issue is not present on Chrome. See pic below: app on left, Chrome browser on right.


Sad this doesn’t get any attention :frowning: I’m not technical enough to write a pull request but I feel like this must be a fairly trivial fix? Maybe it seems nit picky but there are aesthetic and functional reasons why I would hope this can be fixed :pray:t4: