Different logos for light/black theme?

AI-generated summary

The discussion revolves around adding different logos for light and dark themes in Discourse. djcyry asks how to achieve this and also inquires about adding a night/day mode button. cpradio suggests enabling the “Theme can be selected by users” checkbox in Admin settings, but djcyry wants a floating button.

sam shares a technique for allowing users to select dark/light themes, but n-b-sonar reports that this method no longer works due to a regression.

david recommends using a theme component, but Johnny_McIvor and tim_sevDesk ask about the availability of the plugin. david finally provides a solution, stating that users can now upload ‘dark mode’ versions of their logos in the site settings under the branding tab.

Hello ,
How can i add different logos for booth theme ?
I mean , for black theme a white logo (i have it already)
But for the light theme , a black logo ?

Black theme :

Light theme:

Also , is there any option to add a button for night/day mode in index , to change the theme ?

Thanks.

Try changing the theme here - note that there’s a partial white background included in the logo. You could do the same with an off-black background.

edit: Screenshot

Ok , i will try with the photoshop (poor skills :smiley: )
What about this :

Also , is there any option to add a button for night/day mode in index , to change the theme ?

If you check the “Theme can be selected by users” checkbox in Admin > Customize, it will show up as a link in the Hamburger menu.

Yes i know .
But i want to add a float button on index to do that .
Its a bad idea ? Just ask . Thanks

That could likely be done via a customization, but it would involve JavaScript and some CSS to style the button. Not sure how hard it would be to do, but I imagine it shouldn’t be terribly difficult as the themes should be exposed via the API.

I covered the technique here btw:

Am getting reports on our instance that @sam techniques (css trick) no longer works, and instead leads to double logo:

Is this a regression ? Any recommendation to mitigate this ?

Thanks!

The best method now is to use this theme component:

https://meta.discourse.org/t/alternative-logo-for-dark-themes/88502?u=david

I will update the post you linked so it doesn’t confuse people in future.

こんにちは、このプラグインはまだ利用可能ですか?

これに対する解決策はありますか?リンクはもう利用できません @david。

サイト設定でロゴの「ダークモード」バージョンをアップロードできるようになりました。ブランディングタブに移動し、「ロゴ ダーク」と「ロゴ スモール ダーク」までスクロールしてください。

詳細はこちら: