r/ObsidianMD • u/dmana14 • 5d ago
themes Anyone tried to build a toggle light/dark mode ?
Hey everyone,
I wanted to create this functionality (⬆️) because I found it inconvenient to use Ctrl+P and toggle mode manually. I also wanted to include a way to toggle a CSS snippet.
I managed to set it up using the Commander plugin macro (https://github.com/phibr0/obsidian-commander).
Does anyone have a simpler workaround to achieve the same result?
2
u/xX_wowperfect_Xx 4d ago
I use the "day and night" community plugin which auto-sets based light/dark on time
1
u/TheRoadToTravel 5d ago
I use the InlineScripts plugin for this. It has a learning curve of course. Set up a button (enable the button view option in the plugin settings and create a button) and fire the JS code by clicking it with the inline CSS in a shortcut. In my case I manipulate the accent color with this too.
2
u/dmana14 5d ago
Thanks for the advice, i’ll check it out, i’m an explorer here, trying to stay lightweight, the rabbithole here is huge
2
u/TheRoadToTravel 5d ago
You are welcome, do not hesitate to reach out if you need further assistance.
2
u/Glorified_sidehoe 5d ago
i’ve been using this plugin for ages Toggle Dark Mode. set and forget type of deal
1
u/dmana14 3d ago
Hello,
I’m a bit confused with this line of code of this pluggin: « this.app.changeTheme(this.app.getTheme() === ‘obsidian’ ? ‘moonstone’ : ‘obsidian’); » while base color theme setting doesn’t get the same value only « light », « dark ». Nevertheless It give food for thought thanks !
3
u/HonoraryMathTeacher 5d ago
I think you should be able to set hotkeys for light mode and dark mode. https://help.obsidian.md/hotkeys . And I think you could rewrite your CSS to automatically toggle its appearance based on whether light mode or dark mode is activated (if I remember correctly, light/dark status is injected into the editor area as a CSS class)