Font files in vault

Hello~

(this is a rework of this post in which I explain everything I’ve already tried)

Would it be possible to add support for custom fonts? I have a font file in my vault, but there doesn’t seem to be a way to refer to it in CSS (e.g. in obsidian.css), all the methods I’ve tried raise some type of error.

Essentially, allowing this follows the same logic as .md and image files being accessible by Obsidian when they are placed in the vault. (therefore, the implementation could be more generic than just for fonts, I guess).

Thanks.

9 Likes

I just wanted to add my +1 to this issue as I spent all of last night and some of today trying to get this to work, as well.

A few other things I tried:

  • Using an @import URL to an external font file resource hosted by Google Fonts. This is denied because of a CSP violation.
  • Converting a font file to a data-URL, then trying to set up my own @font-face definition with it. This is also denied because of a CSP violation.

While it would be amazing to be able to read font files from the local vault, it seems that relaxing the Content Security Policy for fonts also gives us enough of a workaround to achieve what we need, in case loading files from the local file system is too difficult to do in the short term. (I suppose I don’t know what dangers there are in relaxing the CSP for fonts?)

One more thing that I wanted to say, to support something @vermillon said in their other post, the reason why I wanted to use font files in my vault and not install fonts system-wide is because I host my notes on my Dropbox, which are accessed by two different computers. I would like to be able to have the same styling whenever I move the vault itself around, rather than have to remember to install system fonts. This would also be great for theming because it means theme authors can bundle fonts into themes, rather than include separate installation instructions.

Thanks!

4 Likes

Also want to +1 this request, and have it applied to Publish. I’ve built a custom theme for my own Obsidian Publish site, and since Obsidian doesn’t see woff/woff2 files it is unable to upload those files to Publish. I need to host the fonts since they’re not on Google Fonts.

Thanks!

I would also like to be able to @font-face fonts from within the vault. I switch between my Mac and iPad pretty frequently, and some fonts that I want to use are not accessible through @import.

While pondering over this, I just figured a possible way to have custom fonts in the Vault.
Similar to how we have plugins, themes, and snippets folders, we could have a fonts folder. We could drop an otf/ttf/woff font in their, and then choose the font from Obsidian’s new custom font option in settings/Minimal Theme Settings.

I’m currently using Inconsolata in my Obsidian vault. I did so by converting the font file to Base64 and then embedding it in my custom CSS file as an @font-face. I used Font-Face and Base64 Data-URI as a guide for doing this, but this is not exactly the sort of thing a non-technical user would normally be able to do.

2 Likes

Bumping this as fonts still can’t be @font-face’d from the vault

I would like this too, please! I would favour the solution of a /.obsidian/fonts directory that is prioritised when the renderer looks for fonts.

1 Like

Bumping this again, as fonts still can’t be used from vault; at least not that I’ve seen.