# Permanent Dark Mode?

**URL:** <https://community.silverbullet.md/t/permanent-dark-mode/370>\
**Category:** General\
**Created:** [April 7, 2024, 8:04pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370 "2024-04-07T20:04:34Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![rlw1138](https://community.silverbullet.md/user_avatar/community.silverbullet.md/rlw1138/32/264_2.png) [@rlw1138](https://community.silverbullet.md/u/rlw1138)\
**Post date:** [April 7, 2024, 8:04pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/1 "2024-04-07T20:04:34Z")

</div>

I had to reboot, and when my Space came back up it was no longer in Dark Mode.

Is there something I can add to make dark mode permanent?

THANKS!

---

<div class="post-metadata">

**Author:** ![rlw1138](https://community.silverbullet.md/user_avatar/community.silverbullet.md/rlw1138/32/264_2.png) [@rlw1138](https://community.silverbullet.md/u/rlw1138)\
**Post date:** [April 16, 2024, 5:14pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/2 "2024-04-16T17:14:33Z")

</div>

I just figured out that it’s because of clearing browser cache, nothing to do with rebooting.

“problem” solved

---

<div class="post-metadata">

**Author:** ![zef](https://community.silverbullet.md/user_avatar/community.silverbullet.md/zef/32/7_2.png) [@zef](https://community.silverbullet.md/u/zef)\
**Post date:** [April 16, 2024, 8:51pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/3 "2024-04-16T20:51:11Z")

</div>

Sorry I didn’t respond before. Dark mode should indeed be permanent already per client. Glad you figured out what was causing it for you.

---

<div class="post-metadata">

**Author:** ![nighto](https://community.silverbullet.md/user_avatar/community.silverbullet.md/nighto/32/705_2.png) [@nighto](https://community.silverbullet.md/u/nighto)\
**Post date:** [September 25, 2024, 5:53pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/4 "2024-09-25T17:53:59Z")

</div>

Is there no way to enable a server-wide dark mode? Or is it possible to at least support “prefers-color-scheme”? I want to prevent getting blinded by SilverBullet each time I open the page 😅

---

<div class="post-metadata">

**Author:** ![tagirijus](https://community.silverbullet.md/user_avatar/community.silverbullet.md/tagirijus/32/1515_2.png) [@tagirijus](https://community.silverbullet.md/u/tagirijus)\
**Post date:** [October 20, 2024, 1:29pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/5 "2024-10-20T13:29:17Z")

</div>

Sorry for bumping this topic again: is there any chance to have the dark mode to be the default, when new users access the site?

E.g. when I want the system to act like a blog and I have a certain instance of silverbullet to be accessible without login etc.? In that case I’d like the page to have a default style set already. _(Well, maybe using Silverbullet as some kind of blogging system is not a good idea after all, even with the instance set to read only? Not sure, … but this is more offtopic here, sorry!)_

---

<div class="post-metadata">

**Author:** ![nighto](https://community.silverbullet.md/user_avatar/community.silverbullet.md/nighto/32/705_2.png) [@nighto](https://community.silverbullet.md/u/nighto)\
**Post date:** [October 24, 2024, 7:10pm UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/6 "2024-10-24T19:10:13Z")

</div>

I would also love a server-side dark mode.

My login doesn’t last across SilverBullet upgrades, so the login screen also blinds me with the white backgrounds sometimes. Additionally, the app also shows a full-white screen immediately on launch for a second before it remembers that it’s supposed to be dark.

Having a server-side dark mode would solve both issues and also remove the need for setting the dark mode on every client I use manually.

---

<div class="post-metadata">

**Author:** ![azzamsa](https://community.silverbullet.md/user_avatar/community.silverbullet.md/azzamsa/32/683_2.png) [@azzamsa](https://community.silverbullet.md/u/azzamsa)\
**Post date:** [October 25, 2024, 2:38am UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/7 "2024-10-25T02:38:07Z")

</div>

Whenever it forgets to switch to dark mode, I use this button to toggle it:

```auto
{[Editor: Toggle Dark Mode]}

```

---

<div class="post-metadata">

**Author:** ![zef](https://community.silverbullet.md/user_avatar/community.silverbullet.md/zef/32/7_2.png) [@zef](https://community.silverbullet.md/u/zef)\
**Post date:** [October 25, 2024, 8:53am UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/8 "2024-10-25T08:53:14Z")

</div>

As a stop gap, this space script will automatically set your client to dark mode if it’s not already (it will still flash though):

````auto
```space-script
silverbullet.registerEventListener({name: "editor:init"}, async () => {
  if(!await clientStore.get("darkMode")) {
    await clientStore.set("darkMode", true);
    await editor.reloadUI();
  }
});
```

````

The login page does not support dark mode at all yet, but this may be added as part of this: [WIP: Refresh visuals of auth page by majjejjam · Pull Request #1124 · silverbulletmd/silverbullet · GitHub](https://github.com/silverbulletmd/silverbullet/pull/1124)

---

<div class="post-metadata">

**Author:** ![ChenZhu-Xie](https://community.silverbullet.md/user_avatar/community.silverbullet.md/chenzhu-xie/32/1476_2.png) [@ChenZhu-Xie](https://community.silverbullet.md/u/ChenZhu-Xie)\
**Post date:** [November 2, 2025, 11:38am UTC](https://community.silverbullet.md/t/permanent-dark-mode/370/9 "2025-11-02T11:38:40Z")

</div>

Below **forced Dark Mode** works properly under v2:

```auto
event.listen {
  -- name = 'system:ready',
  name = 'editor:init',
  run = function(e)
    if clientStore.get("darkMode") then
      editor.flashNotification("Current Theme: Dark")
    else
      editor.flashNotification("Current Theme: Light")
      clientStore.set("darkMode", true)
      editor.reloadUI()
    end
  end
}

```

It functions across browsers on both mobile and PC.

However, **after the first full indexing from scratch on a mobile device, the interface may still remain in light mode**. It usually requires a manual refresh to trigger the `editor:init` event and properly switch to dark mode.

I was therefore searching for a suitable event that would activate dark mode only after `index:complete` (an event not exist).

I first found that the `system:ready` event is roughly equivalent to `editor:init`, but it seemingly occurs before the `index:complete` event, so it doesn’t solve the issue.

Then I tried the `editor:complete` event (found through [event](https://silverbullet.md/API/event#event.listEvents())), but that didn’t work either.

The `editor:pageLoaded` event also fires before `index:complete`, so it’s not a viable solution either. (inspired from [Index Page](https://silverbullet.md/Index%20Page))

At last, I discovered this **dark magic** :

```auto
-- priority: -1 
event.listen {
  -- name = "editor:pageLoaded",
  name = "hooks:renderTopWidgets",
  run = function(e)
    if not clientStore.get("darkMode") then
      clientStore.set("darkMode", true)
      editor.reloadUI()
    end
  end
}

```

it works perfectly after `index:complete`. Now, no matter how the user tinkers with SB, **dark mode is the final destination** (even if there’s no TopWidgets on the page?).
