はじめに

Obsidianでノートを書いていると、「この見出しはH2？ H3？」とわからなくなってきます。
ちなみにデフォルトでは以下のような表示です。

この問題を解決するために使える方法を調べたので、まとめます。

この記事では、Lapel、CSSスニペット、formatForgeの3つを紹介します。

1. Lapel

Lapel は、エディタの左側に h1、h2、h3 などの目印を表示するプラグインです。目印をクリックすると、見出しレベルを切り替えるメニューも開けます。
反映するとこんな感じ

インストールは 設定 → コミュニティプラグイン → 閲覧 で Lapel を検索し、インストール後に有効化します。コミュニティプラグインの利用がオフになっている場合は、先にオンにします。

2. CSSスニペット

プラグインを増やさずに調整するなら、Obsidian標準のCSSスニペットが使えます。
以下の例では、H1〜H3に軽く色を付けたうえで、サイズも調整します。明るいテーマと暗いテーマの両方に色を指定できます。

設定 → 外観 → CSSスニペット → スニペットフォルダを開くを選ぶ
フォルダ内に headings.css を作り、以下を貼り付けて保存する

body {
  --h1-size: 2em;
  --h2-size: 1.6em;
  --h3-size: 1.3em;
}

.theme-light {
  --h1-color: #52758a; /* くすんだ青 */
  --h2-color: #687c5d; /* セージグリーン */
  --h3-color: #806b82; /* くすみ紫 */
}

.theme-dark {
  --h1-color: #a2bdcb;
  --h2-color: #b2c3a5;
  --h3-color: #c8b2ca;
}

反映すると以下のようにカラフルになります。

3. formatForge

formatForge は、H1〜H6の色、文字サイズ、太さ、フォント、区切り線などを設定画面で調整できるプラグインです。
コミュニティプラグインから formatForge を検索して導入します。

先ほどのCSSを設定画面から調整できるという感じです。
自分はCSSで調整する方が好みだったため、あまり使用していません。

参考

Obsidian公式ヘルプ：コミュニティプラグイン
Obsidian公式ヘルプ：CSS snippets
Lapel：Obsidianコミュニティプラグイン
formatForge：Obsidianコミュニティプラグイン