Possible to toggle font using CSS

I like to switch between a theme’s font and a monospace font fairly frequently. It’s a bit of a pain to open settings and then type in a font (and then open settings ansd delete it later) when I would like to switch.

I was hoping there would be a way to override a theme’s font using CSS. I found the approach in How to change font? works well (example below), but

  1. It overrides the GUI font, which I wasn’t intending to do
  2. Although it is quicker than typing in a font, it still requires me to toggle the CSS.
:root {
--default-font: Consolas !Important;
}

Is there a way to either override the editor font (and not GUI) using CSS, or find some other way to create a hotkey to change everything to monospace temporarily?

Sorry the question is probably a bit confused!

Either of these snippets should be sufficient for changing the body/note font in Source mode, Live Preview, and Reading view:

body {
    --font-text: "SFMono-Regular";
}

or

:is(.markdown-source-view.mod-cm6 .cm-scroller, .markdown-preview-view) {
    font-family: "SFMono-Regular";
}

As far as toggling the snippet file on/off easily, I use GitHub - chetachiezikeuzor/MySnippets-Plugin: MySnippets is a plugin that adds a status bar menu allowing the user to quickly manage their snippets within the comfort of their workspace 🖌.

GitHub - deathau/snippet-commands-obsidian: Registers custom css snippets as commands (which you can bind hotkeys to) is also an option and works fine.

1 Like

Love it thanks!

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.