はじめに
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で調整する方が好みだったため、あまり使用していません。