Obsidianカスタマイズ完全ガイド｜テーマ・外観設定・CSSスニペット【1.14対応】

Obsidian（オブシディアン）の見た目は、設定画面で切り替えられる部分と、CSSを書かないと変わらない部分にはっきり分かれています。代表が行間で、外観設定に項目がなく、テーマかCSSスニペットでしか変えられません。この記事では外観設定・コミュニティテーマ・CSSスニペットの3段階に分けて、どの要望をどの手段で叶えるかを公式の仕様に沿って示します。前提の版は2026年10月5日に一般公開された1.14です。1.13で設定画面と色の仕組みが変わったため、それ以前の解説記事のCSSがそのまま動かない箇所も扱います。

まとめ：Obsidianカスタマイズの全体像

• 外観設定（設定 > 外観）で変えられるのは、ベーステーマ（ライト／ダーク／システムテーマを適用）、アクセントカラー、フォント3種、フォントサイズ、ズームレベル、テーマとCSSスニペットの管理など。行間の項目は無い。
• コミュニティテーマは公式レジストリに863件（2026年10月12日時点）。設定 > 外観 > テーマの「管理」から入れる。自動更新されないので、GitHubの最終更新日を見て更新が続くものを選ぶ。
• CSSスニペットで行間・本文幅・背景色・文字色・見出し色を変えられる（テーマに打ち消されたときは後述の切り分けへ）。置き場所は .obsidian/snippets/、公式のCSS変数（--line-height-normal、--background-primary、--h1-color など）を上書きする。
• テーマの細かい配色や幅をGUIで詰めるなら Style Settings。自分のスニペットに @settings を書けば、行間をスライダーで動かすこともできる。
• 目次はコアプラグインのアウトラインでサイドバーに常時表示できる。本文に埋め込むなら Automatic Table Of Contents。
• 1.13以降は色の書き方が変わった。--callout-color にRGBの数値3つを書く古いスニペットは効かないので、#ff0000 のような通常の色指定に直す。

Obsidianカスタマイズの3段階（外観設定・テーマ・CSSスニペット）

見た目の要望は、外観設定 → テーマ → CSSスニペットの順に降りていけばほぼ解決します。上の段ほど手間が小さく、下の段ほど自由度が高くなります。

標準の外観設定でできること・できないこと

公式ヘルプの設定ページによると、外観で触れるのは配色・フォント・テーマ・スニペットの管理と、リボンやウィンドウフレームの表示です。行間、本文の横幅、見出しごとの色やサイズ、段落間の余白には項目がありません。設定画面で行間の項目を探しても見つからないのはこのためで、テーマかCSSスニペットの担当です。

着手順序：外観設定→テーマ→スニペット

CSSスニペットは、テーマを入れてもなお残った不満（行間が詰まりすぎる、見出しの色が本文と紛らわしい等）だけに使います。テーマを決めないままスニペットを書くと、テーマを変えた時点で書き直しになります。

1. 外観設定でベーステーマ（ライト／ダーク）とフォントサイズを決める
2. コミュニティテーマを1本だけ入れる（複数の見た目を混ぜない）
3. そのテーマがStyle Settingsに対応していれば入れ、微調整はGUIで済ませる
4. それでも足りない部分だけをCSSスニペットで上書きする

1.13・1.14で変わった見た目まわりの仕様

2026年に入って見た目に関わる変更が2回ありました。1.13（2026年7月30日一般公開）と1.14（2026年10月5日一般公開）です。古い解説記事の手順やCSSが合わないときは、まずここを疑ってください。

設定画面の刷新と項目の探し方（1.13）

1.13で設定画面が作り直され、デスクトップ版では設定が既定で別ウィンドウに開くようになりました。項目の名前や説明文で検索でき、一部の設定は新設の「インターフェース」ページへ移っています。外観にあったはずの項目が見当たらないときは、設定画面の検索欄に「リボン」「タブタイトルバー」などと打つと最短で見つかります。別ウィンドウが邪魔なら、設定 > インターフェースの「設定を新しいウィンドウで開く」をオフにすれば従来どおりアプリ内に開きます。検索の対象はコアの設定とコアプラグインで、コミュニティプラグインは新しい設定APIに移行したものだけが出ます。

色の仕組みのOKLCH移行と古いスニペットへの影響（1.13）

1.13でベースカラーがOKLCH色空間へ移行し、changelogは --callout-color の変更を「breaking change」と明記しています。以前は 255,0,0 のようなRGBの数値3つを書く形式でしたが、今は通常のCSSの色（#ff0000 や rgb(255,0,0)）を書きます。独自のコールアウトを定義している古いスニペットは、ここを直さないと色が付きません。

/* 1.12以前の書き方（1.13以降は効かない） */
.callout[data-callout="memo"] {
  --callout-color: 74, 144, 217;
}

/* 1.13以降の書き方 */
.callout[data-callout="memo"] {
  --callout-color: #4a90d9;
  --callout-icon: lucide-pencil;
}

あわせて、--color-red-rgb などの -rgb 系と --color-accent-hsl などの -hsl 系の変数は非推奨になりました。開発者向けドキュメントの色の変数のページでは、テーマの互換性のためだけに残していると説明し、rgba(var(--color-red-rgb), 0.2) の代わりに color-mix(in oklch, var(--color-red) 20%, transparent) を使うよう案内しています。半透明の色を自作スニペットで作っているなら、この形に書き換えておくと次の変更で壊れにくくなります。

ハイライト6色とフォントサイズの端末別保存（1.14）

1.14で、ハイライト（==テキスト==）に色を付けられるようになりました。公式の書式ヘルプによると、開始の == の直後に赤・橙・黄・緑・青・紫の丸い絵文字を1つ置くと、その色のハイライトになります。絵文字を置かなければテーマ既定のハイライト色です。書式メニューから色を選ぶこともでき、編集中に == と打つと色の候補が出ます。文中の一部だけ色を変えたい用途は、CSSを書かずにこれで足ります。

フォントサイズは端末ごとに保存されるようになり、Obsidian Syncでは同期されなくなりました。PCとスマホで別の文字サイズを使えるかわりに、新しい端末では改めて設定が要ります。コマンドパレットに「文字サイズを大きくする」「文字サイズを小さくする」も加わったので、よく使うならホットキーを割り当てると、キー1つで切り替えられます。

外観設定で変えられる項目

ベーステーマ・ダークモード・アクセントカラー

ベーステーマはライト、ダーク、システムテーマを適用の3択です。OSのダークモードに追従させるなら「システムテーマを適用」を選びます。アクセントカラーは、リンク、チェックボックス、主要なボタンなどアプリ全体の強調色を一括で変える項目です。テーマを変えずに印象だけ変えたいときはここから触ります。

フォント・フォントサイズ・ズーム

フォントはインターフェースフォント（Obsidian全体）、テキストフォント（編集ビューとリーディングビュー）、モノスペースフォント（コードブロックとフロントマター）の3系統を別々に指定します。本文だけ游ゴシックにしたいならテキストフォントだけを変えれば十分です。

フォントサイズはピクセル単位で、編集ビューとリーディングビューに効きます。「フォントサイズのクイック調整」を使うと、Ctrl（macOSはCmd）＋スクロールかトラックパッドのピンチで拡大縮小できます。サイドバーや設定画面まで含めてアプリ全体を大きくしたい場合は、フォントサイズではなくズームレベルを使います。

リボン・タブタイトルバー・ウィンドウフレーム

画面を広く使いたいなら、左端の縦のアイコン列（リボン）とタブタイトルバーを非表示にします。リボンに並べるコマンドは「リボンメニュー」で選べます。ウィンドウフレームのスタイルは「非表示（デフォルト）」「Obsidianフレーム」「ネイティブフレーム」の3つで、変更後は再起動が必要です。半透明ウィンドウはmacOSだけの機能です。

コミュニティテーマの導入と選び方

インストール手順と更新の注意

設定 > 外観 > テーマの「管理」を開くと一覧が表示され、選んで「インストールして使用」を押した時点で適用されます。元に戻すときは「このテーマの使用を停止」です。テーマはブラウザから community.obsidian.md でも探せます。

更新にも注意が要ります。公式ヘルプが明記するとおり、テーマは自動更新されません。設定 > 外観の「現在のコミュニティテーマ」で「更新を確認」→「すべてをアップデート」を定期的に実行しないと、本体の変更に追従した修正が入りません。Minimalは1.14が一般公開された当日（2026年10月5日）に1.14向けの修正版9.1.2を出し、翌日（UTC）までに9.1.4まで更新しています。更新を怠ると、こうした修正を取りこぼします。

テーマの選び方：最終更新日とScorecardで見る

見た目の好みより先に確かめたいのは、更新が続いているかどうかです。1.13のOKLCH移行のように色の前提が変わると、更新の止まったテーマは配色が崩れたまま直りません。判断の材料は2つあります。

• GitHubの最終更新日：1.13の公開（2026年7月30日）より後に更新があるかを見る。無ければ候補から外す。
• コミュニティディレクトリのScorecard：公式の説明によると、community.obsidian.md の各テーマのページには、READMEやライセンスの有無、直近のコミットとリリース、Issueへの対応状況、インストール数をまとめた健全性の評価が出る。

日本語の見出しを太字で正しく出したい場合は、和文フォントの指定順も見ます。たとえばYosuke GlassはREADMEで、Hiragino Sans（macOS／iOS）→ Yu Gothic（Windows）→ Noto Sans CJK（Android）の順に指定していると説明しています。

2026年10月時点で更新が続く代表的なテーマ

公式レジストリ（community-css-themes.json）の863件から、Style Settingsへの対応や知名度を考慮し、1.13の公開後も更新が入っているものを選びました。日付は各リポジトリの最終更新（UTC、2026年10月12日に取得）です。

日本語の紹介記事で定番のAnuPpuccinは、GitHubの最終更新が2024年12月1日で止まっており、1.13以降の変更に合わせた更新は入っていません。今から入れるなら上の表から選んでください。

Style Settingsの使い方（テーマの細部をGUIで調整）

Style Settings（community-archive/obsidian-style-settings）は、テーマやスニペットのCSSに書かれた設定定義を読み取り、設定画面のスライダーやカラーピッカーとして出すプラグインです。公式の統計では累計約276万ダウンロード（2026年10月12日時点）。最新版は2024年8月の1.0.9です。リポジトリはコミュニティ有志が保守を引き継ぐ community-archive に移り、2026年7月にも修正が入っていますが、新しいリリースはまだ出ていません。設定画面の表記は英語のままで、日本語訳はありません。

導入と設定画面での操作

1. 設定 > コミュニティプラグインで「コミュニティプラグインを許可」を押し、制限モードを終了する
2. 「Style Settings」を検索してインストールし、有効化する
3. 設定の左側に「Style Settings」が増えるので開く
4. 使っているテーマ名の見出しを開き、色・幅・トグルを変える

テーマが設定定義を持っていなければ、何も表示されません。対応しているかはテーマのREADMEで確かめます。BorderやITS ThemeはREADMEでStyle Settingsとの併用を勧めています。変えた値は body.css-settings-manager を対象にしたスタイルとして書き出されるため、同じ変数をスニペットで指定していても、Style Settings側の値が優先されやすい点に注意してください。

Minimal Theme Settingsとの役割分担

Minimalには専用のMinimal Theme Settings（kepano/obsidian-minimal-settings）があり、Style Settingsとは別物です。配色の組み合わせ、行幅、フォントなどの基本はMinimal Theme Settings、細部の色や要素の表示はStyle Settingsで調整します。Minimal Theme Settingsは2026年7月31日の9.0.0で1.13の新しい設定方式に移行し、「Editor font」の設定を廃止しました。エディタだけ別のフォントにしたい場合、作者はスニペットで --font-editor-override を指定するよう案内しています。

自作スニペットへのスライダー追加（@settings）

Style Settingsはテーマ専用ではありません。自分のスニペットの先頭に @settings で始まるコメントを書くと、その項目が設定画面に出ます。READMEの書式に沿って、行間と本文幅をスライダーで動かす例です。id がそのまま変数名になるので、Obsidianの変数名（先頭の -- を除いたもの）を書けば標準の値を上書きできます。

/* @settings

name: 本文の読みやすさ
id: my-readability
settings:
  -
    id: line-height-normal
    title: 行間
    type: variable-number-slider
    default: 1.5
    min: 1.2
    max: 2.2
    step: 0.05
  -
    id: file-line-width
    title: 本文の幅
    type: variable-number-slider
    default: 700
    min: 500
    max: 1200
    step: 20
    format: px

*/

READMEが挙げる設定の種類は、見出し（heading）、クラスの切り替え（class-toggle、class-select）、文字・数値・スライダー・選択肢・色の変数（variable-text、variable-number、variable-number-slider、variable-select、variable-color）などです。値をCSSで何度も書き換えるより、スライダーを動かして決めるほうが手早く済みます。

CSSスニペットによる行間・背景色・見出し色の調整

スニペットの置き場所と有効化

スニペットはVaultの設定フォルダ内の .obsidian/snippets/ に .css ファイルとして置きます。デスクトップなら設定 > 外観 > CSSスニペットの「スニペットフォルダを開く」でフォルダが開くので、ファイルを作って「スニペットをリロード」を押し、トグルをオンにします。公式ヘルプによると、有効化した後はファイルを保存するだけで自動的に反映され、再起動は要りません。

モバイルにはフォルダを開くボタンがないため、ファイルマネージャーでVault内の設定フォルダに snippets フォルダを作り、.css を置いてからリロードします。SyncやiCloudでVaultを同期していれば、デスクトップで作ったスニペットがそのまま届きます。

行間・段落間・本文幅を変える

本文の行間は --line-height-normal（既定1.5）で決まっており、スニペットで上書きします。段落と段落の間隔は --p-spacing、エディタ設定の「読みやすい行の長さ」をオンにしたときの1行の幅は --file-line-width です。変数の一覧は開発者向けドキュメントの文字の変数とファイルの変数のページにあります。

body {
  --line-height-normal: 1.8;
  --p-spacing: 1.2em;
  --file-line-width: 800px;
}

数値を大きくしすぎると1画面に入る量が減り、スクロールが増えます。長文を書くVaultなら1.7〜1.8、コードや短いメモ中心なら既定の1.5のままで足ります。和文と英数字が混ざって行の高さがそろわない場合は、コミュニティプラグインの Dynamic Line Height for CJK（ryotaushio）が、和文を含む行の行間を調整します（最終更新は2023年12月のため、1.14での表示を確かめてから使ってください）。

背景色・文字色・見出し色を変える

配色は色の変数を上書きします。エディタの背景は --background-primary、サイドバーなどの背景は --background-secondary、本文の文字色は --text-normal、補助的な文字は --text-muted、ハイライトの既定色は --text-highlight-bg です。見出しは --h1-color から --h6-color まで個別に指定でき、サイズは --h1-size、行間は --h1-line-height と分かれています。

body.theme-dark {
  --background-primary: #1e1f24;
  --text-normal: #dcddde;
  --h1-color: #7aa2f7;
  --h2-color: #9ece6a;
}

body.theme-light {
  --h1-color: #1f4e9c;
  --h2-color: #2f7d32;
}

ダーク側だけ変えたいときは body.theme-dark、ライト側だけなら body.theme-light で囲みます。body だけで書くと両方に同じ色が入り、ライトで背景が暗くなるといった事故が起きます。

ノート単位でスタイルを切り替える

特定のノートだけ見た目を変えたい場合は、プロパティの cssclasses にクラス名を書き、スニペット側でそのクラスを対象にします。議事録は行間を詰める、日報だけ幅を広くする、といった使い分けができます。

---
cssclasses:
  - wide-note
---

.wide-note {
  --file-line-width: 1100px;
}

画面レイアウトと目次の表示

サイドバーにアウトライン（目次）を出す

サイドバーに目次を出す機能は、コアプラグインのアウトラインです。設定 > コアプラグインでアウトラインを有効にすると、開いているノートの見出しがサイドバーに一覧表示され、クリックで該当箇所へ移動できます。アウトライン上で見出しをドラッグすると、本文のセクションごと並べ替えられます。1.14でアウトラインの検索が改良され、- を付けた語で一致する見出しとその配下を隠せるようになりました。表示されないときは、コマンドパレットで「アウトライン」と打って開くコマンドを実行します。

ペイン分割とワークスペースの保存

中央のタブは縦にも横にも分割でき、左右のサイドバーはそれぞれ折りたためます。この並びを丸ごと保存するのがコアプラグインのワークスペースです。公式ヘルプによると、開いているファイルとタブ、各サイドバーの幅と開閉状態を名前を付けて保存でき、日記用・執筆用といった作業ごとに切り替えられます。

本文に目次を埋め込む

ノート本文に目次を出したい場合はコミュニティプラグインを使います。公式一覧に掲載され保守されているのは Automatic Table Of Contents（johansatge/obsidian-automatic-table-of-contents、最新版1.8.0は2026年2月）で、次のコードブロックを1つ置くと見出しから目次が自動で作られます。

```table-of-contents
```

日本語の解説記事でよく紹介される Dynamic Table of Contents は、2022年8月の更新を最後に作者が保守終了を告知し、現在はリポジトリがアーカイブされ、公式のプラグイン一覧から「Archived repository」として外されています。新しく入れる対象にはしないでください。

カスタマイズが効かないときの切り分け

テーマによるスニペットの打ち消し

よくある原因の1つです。テーマ側が同じ変数をより強いセレクタで指定していると、スニペットの body { ... } は負けます。いったん !important を付けて反映されるか確かめ、反映されるならセレクタの強さの問題なので、body.theme-dark のように対象を絞って書き直します。Style Settings対応テーマなら、同じ項目をStyle Settings側で上書きできることが多く、CSSを書く前にそちらを探すほうが手早く済みます。CSSに構文エラーがあると以降の指定がまとめて無視されるので、波かっこの閉じ忘れも確認します。

本体アップデート後のテーマ・色指定の崩れ

テーマは自動更新されないため、本体だけが新しくなると差が出ます。まず「現在のコミュニティテーマ」から「更新を確認」→「すべてをアップデート」を実行し、直らなければ一度テーマの使用を停止してスニペットもすべてオフにし、どちらが原因かを切り分けます。自作のスニペットで --callout-color にRGBの数値3つを書いている、-rgb 系の変数で半透明色を作っている、といった場合は1.13の変更が原因なので、前の章の書き方に直します。

Vaultを開いた直後・モバイルでの未反映

1.14では、信頼していないVaultを開いたとき、「この保管庫の作成者を信頼しますか？」という確認が表示されている間はテーマとスニペットが一時的に無効になります。人から受け取ったVaultで見た目が素の状態になっていても、確認に答えれば戻ります。デスクトップで作ったスニペットは、Vaultを同期していなければモバイルには存在しません。同期していても、同期の設定によってはモバイル側のトグルがオフのままなので、設定 > 外観 > CSSスニペットで確認します。

基本操作とMarkdown記法（カスタマイズ前の最低限）

見た目を整える前提として、Obsidianの基本を押さえておきます。ノートはすべてローカルのMarkdownファイルで、Vault（保管庫）と呼ぶフォルダに保存されます。他のエディタやツールからもそのまま読めます。

• Markdown記法：見出しは #、箇条書きは -、強調は **太字**、ハイライトは ==テキスト==。編集中に整形結果が見えるライブプレビューが既定です。
• 双方向リンク：[[ノート名]] で他のノートへリンクし、リンクされた側にはバックリンクが自動でたまります。グラフビューはこの関係を図にしたものです。
• コマンドパレット：Ctrl（macOSはCmd）＋Pでほぼ全機能を呼び出せます。スニペットのリロードやワークスペースの読み込みもここから実行できます。
• 料金：本体は個人・業務とも無料です。公式の料金ページでは、Syncが月4ドル（年払い）から、Publishが月8ドル（年払い）から、組織での業務利用者に購入が推奨される任意の商用ライセンスが1ユーザー年50ドルです。

図表を多用するなら、Obsidianが標準で対応するMermaid記法の使い方を完全ガイド｜無料のLive Editorでフローチャート・シーケンス図を作成で解説している記法が、ノート内でそのまま使えます。PDFやWordをMarkdownにして取り込みたい場合はMarkItDown（マークイットダウン）とは｜各種ファイルをMarkdownに変換するMicrosoft製Pythonツールで紹介している変換ツールが使えます。

よくある質問

行間は設定画面から変えられますか？

変えられません。設定 > 外観に行間の項目は無いため、CSSスニペットで --line-height-normal を上書きするか、行間を設定できるテーマとStyle Settingsの組み合わせを使います。

Style Settingsを入れたのに何も表示されないのはなぜですか？

使っているテーマやスニペットが設定定義（@settings のコメント）を持っていないと、Style Settingsの画面には何も出ません。テーマのREADMEで対応を確かめるか、自分のスニペットに @settings を書いて項目を作ります。

Obsidianのおすすめテーマはどれですか？

見た目の好みより、更新が続いているかで選んでください。2026年10月時点では、Minimal、Border、Cupertino、Catppuccin、ITS Theme などが1.13の公開後も更新されています。迷ったら、専用の設定プラグインがあり1.14への対応も早かったMinimalが無難です。

文字色や見出しの色を変えるには？

本文全体の文字色は --text-normal、見出しは --h1-color から --h6-color をCSSスニペットで上書きします。文中の一部だけ色を付けたいなら、1.14で加わった色付きハイライト（== の直後に色の丸い絵文字を置く）が手軽です。

目次をサイドバーに常時表示するには？

設定 > コアプラグインでアウトラインを有効にし、サイドバーに表示します。見出しをクリックすると該当箇所へ移動します。

CSSスニペットを書いたのに反映されないのはなぜですか？

設定 > 外観 > CSSスニペットでトグルがオンになっているかをまず確認します。オンなのに効かない場合は、テーマの指定に打ち消されているか、CSSの記述ミスです。!important を一時的に付けて反映されるなら、セレクタを具体的にします。1.12以前の解説からコピーした色指定なら、1.13の書き方に直す必要があります。

関連記事

• Claude CodeとObsidianの連携方法｜Vault直結・内蔵MCP・公式CLIの実装手順【2026年9月】
• CursorとObsidianを連携する方法｜Vault直開き・MCP・CLIの設定手順【2026年9月】
• Logseqとは？料金・使い方・Obsidianとの違いを解説【2026年・DB版対応】
• Mermaid記法の使い方を完全ガイド｜無料のLive Editorでフローチャート・シーケンス図を作成
• Markdown Live Editorの選び方｜VS Code拡張と無料ツールを比較