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.

이제 사이트 설정에서 로고의 ‘다크 모드’ 버전을 업로드할 수 있습니다. 브랜딩 탭으로 이동한 후 '로고 다크’와 ‘로고 소형 다크’ 항목으로 스크롤하세요:

자세한 내용은 여기서 확인하세요: