Making Obsidian look and feel native on macOS

Posted by:

  • Avatar of Konstantin

    Konstantin

This is my Obsidian setup and the plugins and settings I use to make it feel more at home on macOS

As some of you know, Obsidian is my preferred writing app on both macOS and iOS. I use it for all kinds of writing tasks during the day - taking quick notes during calls, creating short to-dos and organising my thoughts at the start of a day, drafts for blogposts, scribbling app ideas etc.

If this is the first time you're hearing about the app then I should probably stress that Obsidian, while it looks like a simple text writing app on the surface, is packed with features. Things like "link to everywhere", link and page previews, a graph visualisation showing relationships between notes, the canvas which works like a mini-Miro board and of course the hundreds of community plugins available to install. After years of using the app, there are still a number of features I haven't even began to take advantage of.

Astute macOS users (and developers 😉) will be quick to notice that Obsidian is not a native macOS app, but it is in fact a hybrid web application running inside an Electron runtime. This means that the UI look and feel is non-standard on macOS - it doesn't work like other apps for the Mac.

Configure Obsidian to follow the HIG

To address this, I use a combination of a theme and several plugins to make the app closer to the HIG we all expect.

The theme I'm using is called Minimal which was specifically designed to reduce clutter and make Obsidian look more, well, "native". In addition, I'm also using the Hider and Minimal Theme Settings plugins (these are all listed in the Get started guide) with the following settings.

Hider

Hide app ribbon

Obsidian Hider extension hide the app ribbon toggle
Obsidian Hider extension hide the app ribbon toggle -

Minimal Theme Settings

I apply several changes to the Minimal theme:

  • Light and Dark mode themes set to macOS
  • Colourful window frame
  • Colourful active states
  • Minimum status bar
Obsidian Minimal Theme Settings toggles
-

If you're really interested, here is an export of each plugin settings.

Hider:

{
  "hideRibbon": true,
  "hideStatus": false,
  "hideTabs": false,
  "hideScroll": false,
  "hideSidebarButtons": false,
  "hideTooltips": false,
  "hideFileNavButtons": false,
  "hideSearchSuggestions": false,
  "hideSearchCounts": false,
  "hideInstructions": false,
  "hidePropertiesReading": false,
  "hideVault": false
}

Minimal Theme Settings

{
  "lightStyle": "minimal-light",
  "darkStyle": "minimal-dark",
  "lightScheme": "minimal-macos-light",
  "darkScheme": "minimal-macos-dark",
  "editorFont": "",
  "lineHeight": 1.5,
  "lineWidth": 40,
  "lineWidthWide": 50,
  "maxWidth": 88,
  "textNormal": 20,
  "textSmall": 13,
  "imgGrid": false,
  "imgWidth": "img-default-width",
  "tableWidth": "table-default-width",
  "iframeWidth": "iframe-default-width",
  "mapWidth": "map-default-width",
  "chartWidth": "chart-default-width",
  "colorfulHeadings": false,
  "colorfulFrame": true,
  "colorfulActiveStates": true,
  "trimNames": true,
  "labeledNav": false,
  "fullWidthMedia": true,
  "bordersToggle": true,
  "minimalStatus": true,
  "focusMode": false,
  "underlineInternal": true,
  "underlineExternal": true,
  "folding": true,
  "lineNumbers": false,
  "readableLineLength": true,
  "devBlockWidth": false
}

Resources

Obsidian Minimal Theme Settings toggles

Tags