Markdown文書を貼り付けるだけで、見出しからGitHub形式のアンカーリンク付き目次を自動生成。 見出しレベルの選択や番号付きリスト、本文への自動挿入まで対応しています。
目次に含める見出しレベル
リスト形式
インデント幅
選択した見出しレベルに該当する見出しが見つかりません。左のレベル選択を確認してください。
見出し合計
0件
目次の項目数
0件
見出し構成のチェック
見出しレベルの飛び
レベルの飛びは見つかりませんでした
重複した見出し
重複した見出しはありません
ADVICE
目次はH2・H3程度の粒度に絞ると、全体像が把握しやすくなります。見出しを編集した後は、本文入力欄に貼り付け直すだけで目次を最新の状態に保てます。
Markdownの目次（TOC）はなぜ手作業だと崩れやすいのか
READMEや技術記事、社内ドキュメントで目次を手作業で作ると、見出しを追加・削除するたびに目次側の更新を忘れるという問題が起きがちです。さらにアンカーリンク（#見出し名）は、見出しの文字列から機械的なルールで生成される必要があり、日本語やスペース、記号を含む見出しでは手作業での組み立てにミスが起きやすい部分です。
本ツールはMarkdownを貼り付けるだけで見出し構造を自動解析し、GitHub形式のアンカーリンク付き目次を組み立てます。見出しレベルの選択、番号付きリストへの切り替え、コードブロック内の「#」の除外まで対応しており、見出し構成を編集した後も貼り付け直すだけで最新の目次に更新できます。
こんなシーンで便利です
GitHubリポジトリのREADMEを整える時に
セクションが多いREADMEに目次を追加したい場合に。見出しを貼り付けるだけでGitHub形式のリンク付き目次がすぐに手に入ります。
Qiita・Zennなど技術ブログ記事の執筆時に
長文の技術記事の冒頭に目次を置きたい場合に。見出しレベルを選んで、記事の粒度に合った目次だけを抽出できます。
社内Wiki・仕様書などのドキュメント作成時に
章立ての多い仕様書やナレッジベースの記事で、目次の手作業更新をなくしたい場合に。本文への自動挿入機能でマーカーごと更新できます。
見出し構成そのものの見直し・レビュー時に
見出しレベルの飛びや、重複した見出しタイトルがないかを一覧でチェックしたい場合に。目次生成のついでに文書構造の健全性を確認できます。
使い方は簡単 4ステップ
- Markdown文書をテキストエリアに貼り付けます（サンプルボタンから見本を読み込むこともできます）。
- 「目次に含める見出しレベル」で、目次に反映したいH1〜H6を選択します。
- リスト形式（箇条書き／番号付き）やインデント幅などの表示オプションを調整します。
- 生成された目次をコピーするか、「本文に目次を挿入」ボタンで元のMarkdownの先頭にそのまま挿入します。
※見出しの解析から目次の組み立てまで、すべてブラウザ内のJavaScriptで処理され、入力内容が外部に送信されることはありません。
ご利用時の注意点
- 見出しの検出はATX形式（# 見出し）に対応しています。アンダーラインで見出しを表現するSetext形式（見出しの下に===や---を書く記法）は非対応です。
- アンカーリンクのスラッグ生成はGitHubの仕様に準拠した簡易実装です。利用するMarkdownレンダラーによっては、実際のリンク先が本ツールの表示と完全には一致しない場合があります。
- コードフェンス（```や~~~で囲まれた範囲）内の「#」から始まる行は見出しとして扱いません。ただし4スペースインデントによるコードブロックには対応していません。
- 完全無料・安全：入力したMarkdownの内容は一切送信されない、通信が発生しないブラウザ完結型を採用しています。
目次生成でよく使うMarkdown記法とスラッグの対応例
見出しのテキストが、実際にどのようなアンカーリンク（スラッグ）に変換されるかの目安です。
| 見出し（Markdown） | 表示テキスト | 生成されるスラッグ |
|---|---|---|
| ## はじめに | はじめに | #はじめに |
| ## Getting Started | Getting Started | #getting-started |
| ### 1. 環境構築 | 1. 環境構築 | #1-環境構築 |
| ### インストール方法（Mac / Windows） | インストール方法（Mac / Windows） | #インストール方法mac--windows |
| ## `npm install` の使い方 | npm install の使い方 | #npm-install-の使い方 |
読みやすい目次を作るための実務的なポイント
目次を機械的に生成した後、さらに読みやすく整えるための考え方を解説します。
結論：目次は「見出し構成の設計図」として先に整理するのが近道
目次を後から手作業で組み立てるのではなく、見出し（#〜######）の粒度を先に整理し、そこから目次を自動生成するという順番にすることで、目次と本文の食い違いが起きにくくなります。見出しを編集した後は、本ツールに貼り付け直すだけで目次を最新の状態に保てます。
見出しレベルの飛びは「読み手の迷子」につながる
H1の次にいきなりH3が来るなど、見出しレベルが1段階以上飛ぶ構成は、目次上でも階層関係がわかりにくくなり、読み手が文章内の位置を把握しづらくなる原因になります。本ツールの警告表示を参考に、レベルが飛んでいる箇所がないか確認しておくと、目次自体の見通しも良くなります。
目次に含めるレベルは「深すぎない粒度」を意識する
H1からH6まですべてを目次に含めると、かえって目次自体が長くなり全体像を把握しにくくなることがあります。記事の主要なセクション（H2・H3程度）に絞って目次を作ることで、読み手が知りたい情報にすばやくたどり着ける目次になります。
GitHub形式のアンカーリンクの仕組みを理解しておく
GitHubなど多くのMarkdownレンダラーでは、見出しテキストを小文字化し、スペースをハイフンに置き換え、記号を取り除くというルールでアンカーリンクを自動生成しています。見出しに記号や絵文字を多用すると、意図しないスラッグになることがあるため、目次のリンク切れを防ぐ意味でも見出しはシンプルに保つのがおすすめです。
よくある失敗と対策
見出しを追加・削除したのに、目次を更新し忘れてリンク切れになる
本文の見出し構成を変更した後、手作業で管理していた目次側の更新を忘れてしまい、クリックしても該当箇所に飛ばない目次が残ってしまう失敗です。
💡 対策・解決策を見る▼
日本語見出しのアンカーリンクを手作業で組み立てて間違える
日本語の見出しに対して、リンク先のアンカー（#から始まる文字列）を手作業で推測して作成し、実際のスラッグと一致せずリンクが機能しない失敗です。
💡 対策・解決策を見る▼
同じ見出しタイトルを複数回使い、目次のリンクが意図しない場所に飛ぶ
「概要」のような汎用的な見出しを複数のセクションで使い回し、生成されたリンクが想定と違う「概要」セクションに飛んでしまう失敗です。
💡 対策・解決策を見る▼
コードブロック内のコメント行を見出しと誤認識してしまう
独自に正規表現で目次を組んでいた場合など、コードブロック内の「# TODO」のようなコメント行まで見出しとして拾ってしまい、不要な項目が目次に混ざってしまう失敗です。
💡 対策・解決策を見る▼
よくある質問（FAQ）
Q.生成された目次のリンクはGitHubやQiita、Zennでもそのまま使えますか
A. はい。本ツールはGitHubのアンカーリンク生成ルール（小文字化、スペースをハイフンに変換、記号を除去、日本語はそのまま保持）に準拠したスラッグを生成しているため、GitHubのREADME、Qiita、Zennなど主要なMarkdownレンダラーの多くでそのままリンクとして機能します。ただしサービスによって細かいルールが異なる場合があるため、公開後は実際のリンク動作をご確認ください。
Q.見出しの一部だけを目次に含めることはできますか
A. はい。「目次に含める見出しレベル」からH1〜H6を個別に選択できます。たとえば大見出し（H1）を除いてH2・H3だけを目次にする、といった調整が可能です。選択したレベルの中で最も浅い見出しが目次の最上位階層として扱われます。
Q.同じ見出しが複数回出てくる場合はどうなりますか
A. GitHubのルールと同様に、2回目以降に登場した同名の見出しには自動的に「-1」「-2」のような連番がスラッグの末尾に付与されます。本ツールは重複している見出しを一覧で警告表示するため、意図しない重複に気づきやすくなっています。
Q.コードブロック内に書かれた「#」から始まる行は見出しとして認識されますか
A. 認識されません。本ツールはコードフェンス（```や~~~で囲まれた範囲）を検出し、その内部にある「#」から始まる行（コメントなど）は見出しの解析対象から除外しています。
Q.生成した目次を元の文章に自動で挿入できますか
A. はい。「本文に目次を挿入」ボタンを押すと、入力したMarkdownの先頭に目次専用のマーカー（<!-- TOC:START --> 〜 <!-- TOC:END -->）付きで目次が挿入されます。すでにマーカーが存在する場合は、その部分だけが新しい目次に置き換わるため、見出しを編集し直した後の目次更新にも使えます。
Q.入力したMarkdownの内容が外部に送信されることはありませんか
A. ありません。見出しの解析、スラッグの生成、目次の組み立てまで、すべての処理はブラウザ内のJavaScriptだけで完結しています。入力内容が外部サーバーに送信されることは一切なく、下書き段階の記事や社外秘のドキュメントでも安心してご利用いただけます。
あなたの声で、
このツールをより鋭く。
「こんな機能が欲しい」「ここを直してほしい」といったご意見や、新しいツールのリクエストを募集しています。エンジニアが直接目を通し、開発の参考にさせていただきます。