How to change font?

Possibly?

/* THIS APPEARS TO CHANGE THE SOURCE VIEW FONT IN THE NEW LIVE EDITING */

.markdown-source-view.mod-cm6 .cm-scroller {
  font-family: 'Courier Prime Code', Menlo, 'iA Writer Mono V', 'iA Writer Duo V', Monaco, 'Courier Prime Code', monospace;
}

Angel

The following worked for me:

.markdown-source-view .cm-editor .cm-scroller {
  font-family: 'Cascadia Code', Menlo, Monaco, 'Courier New', monospace !important; 
}
2 Likes

Thank you. This worked for me too

Thank you so much for your help! Now my css snippet works with the stock theme!

Hello there!
I would like to organise with the headings but they are way too big, ant then take way to much space on a note.

So I would like to reduce the size of the headings. Maybe even change the Header one to Center rather than Align left.

Is there an easier way rather than go CSS ? ^^
Even if I get my hands dirty by getting help, is there a project to edit the font in an user friendly way in a future (or even a Plug-in) ?

Thanks!

2 Likes

Excellent fix. Thanks!

My gosh! This is so cryptic! Look how many attempts, failures, and different answers there are here. It’s crazy that I might have to schedule an hour or two of my day to troubleshoot changing fonts in a text dominant program.

Could someone who knows CSS and Obsidian post a standard template that includes every style that Obsidian uses? Where users could simply type in the font next to whatever style they want to change.

1 Like

Here’s the best way to do it.

Internally, Obsidian uses the --default-font variable for the UI font and editor font. And it uses the --font-monospace variable for code blocks in the editor.

So we just override those:

:root { --default-font: ui-sans-serif, system-ui !important; }
:root { --font-monospace: "Hack", ui-monospace, monospace !important; }

This should never break unless Obsidian does some major refactoring to the way their CSS is set up.

Note:

  • system-ui will use your system’s default font. ui-sans-serif is a newer version, currently only supported by Safari which will pick the system default sans font (there’s also ui-serif if you prefer that).
  • There’s no way to get the system default monospace font… monospace picks some random monospaced font for me, not what I have my system configured to. ui-monospace should work in the future, but again it’s currently only supported on Safari. So I explicitly specify there that I want to use the Hack font.

I’m using Comic Sans as my system font, here’s what it looks like:

2 Likes

I really appreciate this @JGXTXW !!!

And also, our font woes may finally be managed in the Obsidian Settings UI

Shiny New Things in v0.14.4

  • You can now assign multiple fonts to each font option, and the first available font will be used.
1 Like

Hello everyone <3
I am trying to change the font on my obsidian too but the issue I am having is that I am using a font that I bought from someone on their website. I have the font installed on my computer. Would any of this css work for me? or is it impossible for me to change the font to the one I Purchased?

Thank You for your help and for reading this. Much Love <3 Flip

@Flipah This thread is from before a new and easier method was implemented. In the Settings (click gear icon :gear: on bottom left of the ui), you can go to the Appearance section, and ever since version 0.14.4 you can just choose any installed font for different purposes within Obsidian (Editing View, Reading View, and the ui). In the release notes, it explains:

You can now assign multiple fonts to each font option, and the first available font will be used.


Good luck!

1 Like

Aww!!! This did the trick <3 Thank you so so much for your reply and I hope you are having a wonderful night! Best Wishes and much love, Flip.

1 Like

Is there a way to to use a different font than what’s offered in the dropdown in the GUI settings? Especially for foreign languages, it would be nice to be able to choose a custom font beyond what is offered in the dropdown.

1 Like

Any font you install on your system will be available in the dropdown. The options are not from Obsidian.

1 Like