Skip to content

Latest commit

 

History

History
51 lines (34 loc) · 2.14 KB

Customize appearance of Obsidian.md

File metadata and controls

51 lines (34 loc) · 2.14 KB
created modified
2024-12-11 14:29:08 UTC
2024-12-12 11:45:42 UTC

Configure Minimal theme in Obsidian

Reference: Minimal Documentation > Get started

1. Install Minimal theme 

Open in Obsidian or follow the steps below:

  1. Open Obsidian Settings
  2. Go to Appearance and click Manage
  3. Search for Minimal and click Install and use

2. Install the companion plugin 

Open in Obsidian or follow the steps below:

  1. Go to Community Plugins and turn off Safe mode
  2. Search for Minimal Theme Settings and click Install, then Enable

3. Install optional related plugins 

  • Style Settings allows you to create custom Color schemes and tweak Minimal with more fine-grained control.
  • Hider hides UI elements such as window frame, scrollbars, tooltips, etc.

Customize heading colors

One of the issues for me, personally, after applying the Minimal theme in Obsidian is the reduced sizes of headings. This makes it difficult for me to easily distinguish the various levels of headings, as illustrated in the screenshot below:

Obsidian - Heading default colors with Minimal theme

Consequently, I customize the heading colors using CSS snippets. With just a little bit of CSS, the various heading levels now appear in different colors:

body {
    --h1-color: var(--color-purple);
    --h2-color: var(--color-blue);
    --h3-color: var(--color-green);
    --h4-color: var(--color-yellow);
    --h5-color: var(--color-orange);
    --h6-color: var(--color-red);
}

Obsidian - Heading custom colors with Minimal theme

Note: The CSS rules use extended color variables in order to support both light and dark modes.