Inconsistent Font Behavior on Mobile

Steps to reproduce

  1. Open settings
  2. Select Options->Appearance
  3. Set Theme to “None”
  4. Enable the following CSS snippet
    .markdown-source-view { font-family: 'Menlo', monospace; }

Expected result

  • Font selected through CSS snippet is consistently applied in the editor, regardless of platform

Actual result


  • Operating system: macOS Big Sur 11.5.1, iOS 14.7.1
  • Obsidian version: 0.12.12 on Mac, 1.0.4(21) on iOS

Additional information

  • iPhone and iPad behavior is the same
  • When the Night Owl theme is applied and the following snippet is used instead, headers are accurately reflected on iOS but body text continues to use the default font
    :root {
       --font-family-editor: Menlo, Courier New, IBM Plex Mono, Monaco, Courier New, monospace;
       --font-family-preview: Karla, Avenir Next, Helvetica, Arial, sans-serif;
       --font-family-preview-heading: Rubik, Avenir Next, Helvetica, Arial, sans-serif; }

The editor on desktop and mobile are different. Contact the author of the theme to fix the theme.

Hi @WhiteNoise - I’m having the issue without a theme applied. I also showed it with a theme to demonstrate the inconsistent behavior.

When no theme is applied, custom css works fine on desktop but not on mobile. Does it need to be set differently between the platforms?

Again, I’m just using:

.markdown-source-view { font-family: 'Menlo', monospace; }

yes. The editor is different.

So, what needs to be set differently? Is there a different css tag to use for mobile? Or is changing the font in mobile not possible?


@ShawnL I have your very same question. Have you found an answer, if I may ask?


This has worked for me, YMMV.

.cm-header { 
   font-family: '<FONTNAME>';

@JoelB Thanks. Perfect.