ディレクトリツリー図 作成ツール（インデント → ├── └──）
スペース・タブ・「- 」の箇条書きで書いたフォルダ構成を、「├──」「└──」「│」のツリー図に変換します。READMEやドキュメントに貼れます。末尾が「/」の名前はフォルダとして扱い、「#」や「//」以降はコメントとして桁を揃えて表示します。表の整形は 罫線表（ASCII・Unicode）作成ツール をご利用ください。
🔒 ブラウザ内で完結・入力データはサーバーに送信されません
使い方
- 「変換方向」で「インデント → ツリー図」を選び、フォルダ構成をインデント付きで入力します。
- 「罫線の種類」「ルートを表示する」「表示する深さ（0 = すべて）」などを調整します。
- 右側に出たツリー図を「コピー」または「ダウンロード」して、READMEに貼ります。
注意事項
- インデントは2・4スペース、タブ、ハイフン（-）やアスタリスク（*）の箇条書きに対応します。「自動判定」では、行頭のスペースが最も少ない行の幅を1段として扱います。
- 階層が飛ぶ行（1段目の次にいきなり3段目など）、幅が割り切れないインデント、名前が空の行はエラーにします。空行は無視します。
- 空白の後ろにある # や // 以降はコメントです。C# のように直前に空白がない記号は名前の一部として扱います。
- 「表示する深さ」を指定すると、それより深い階層を省き、子を持つ項目の下に省略を示す点を表示します。数え方は入力のルートが1です。
- 全角文字は半角2文字分として桁を揃えます。等幅フォントで表示してください。
用語解説
ツリー図
フォルダ構成を「├──」「└──」「│」で枝分かれして描く文字の図です。Linuxの tree コマンドの出力と同じ形式です。
ASCII表記
「|--」「`--」「|」だけで描くツリー図です。罫線文字が崩れる環境でも安全に表示できます。
よくある質問
フォルダとファイルはどう区別されますか？
名前の末尾が「/」ならフォルダの目印としてそのまま表示します。ツリー図そのものには区別がないため、「src/」のように「/」を付けて書いてください。
「階層が2段以上深くなっています」と表示されます。
前の行より2段以上深いインデントの行があります。たとえば「src/」の次の行を、いきなり4スペース（2段分）下げていないか確認してください。1段ずつ下げるとエラーが消えます。
コメントを付けるにはどう書きますか？
名前のあとに空白を入れて「# 説明」または「// 説明」と書きます。出力では全行の桁をそろえ、記号は「コメント記号」で切り替えられます。「C#」のように空白がない場合は名前として扱います。
深い階層を省略して見せたいときは？
「表示する深さ」に数字を入れます。入力のルートを1として数え、それより深い階層を省いて、子を持つ項目の下に「...」を出します。0にすると全部を表示します。
ツリー図からインデントの文章に戻せますか？
はい。「変換方向」を「ツリー図 → インデント」にして、「├──」や「|--」形式のツリー図を貼ると、インデントまたは箇条書きに戻せます。tree コマンドの出力も使えますが、ファイル数などの集計行は削除してください。
このページをシェア