How to Use JetBrains Mono as Web Editor Font?

The typst.app web editor has a “Font family in the editor” setting. I want to add the font JetBrains Mono and use it but have been unable to get it to work. I have tried “JetBrains Mono”, “JetBrainsMono”, and “JetBrainsMono NF”, to no avail.

Edited after the comment by @laurmaedje I had another look at my solution.

It was wrong, thus deleted here. The correct solution is this post How to Use JetBrains Mono as Web Editor Font? - #3 by laurmaedje

There is no need to upload the font. The editor uses the normal browser font handling rather than Typst’s font handling, so the font just needs to be installed on your system.

2 Likes

I’ve installed JetBrainsMono Nerd Font on both Windows 11 and macOS 18. The editor only picked up the font on Chrome on Windows and not Safari on macOS.

1 Like

Sorry for resurrecting this thread lately.

There may be Issues with Firefox (i faced it with the Version 139.0 at the time of writing):

  • Firefox may have activated enhanced Fingerprinting protection, which disables the “fallback” to local Files for webpages. This can be disabled by disabling the “tracking protection”: you can add “https://typst.app” to the exception list.
  • when having installed Firefox (or another browser) using a sandboxing mechanism like Snap on Ubuntu, you might need to enable access to font directories explicitly. How this works depends on the given technology used.

Don’t forget to restart Firefox after these changes. :vulcan_salute:

1 Like