🌳 Directory Tree Generator

What can Directory Tree Generator do?

Directory Tree Generator is a free online tool that converts project directory structures into ASCII tree diagrams. It supports two input methods: uploading a folder for auto-reading or manually entering path lists. You can customize connector styles, indentation, filter rules, and output formats. The generated tree can be used directly in README documents, project descriptions, and code reviews. All processing happens locally in your browser — your file data is never uploaded to any server.

Core Features

• Multiple input methods: Drag-and-drop folder upload, manual path entry, or paste existing file lists
• Flexible filtering: Exclude node_modules/.git/dist directories and specific file extensions, with built-in presets
• Multiple output formats: Plain text, Markdown code block, or HTML — one-click copy to README
• Customizable styles: Unicode, ASCII, or simple connector styles with adjustable indent spaces
• Smart sorting: Alphabetical sorting, directories-first, max depth limits for clear tree structures
• File information: Optional file size display, directory and file count statistics

How to Use

1. Choose an input method: drag a folder to the upload area, or manually enter file paths in the text box (one per line)

2. Set filter rules: enter directory or file names to exclude, separated by commas

3. Adjust display options: choose connector style, indent spaces, file size display, sorting method, etc.

4. Click "Generate Tree" to see the result in the output area

5. Click "Copy Result" to copy the tree to your clipboard, or select Markdown format to paste directly into README.md

Use Cases

Case 1: Writing Project READMEs

Display project directory structure in GitHub README.md files, helping new contributors quickly understand code organization. Use Markdown code block output for direct pasting.

Case 2: Code Review Documentation

Reference project structure in code reviews or technical docs, paired with explanatory text about architecture design — clearer and searchable compared to screenshots.

Case 3: Project Migration Planning

Generate current directory tree before refactoring or migration, compare old and new structures to ensure no files are missed.

Case 4: Teaching Demonstrations

Show standard project structures in programming courses, helping students understand MVC, layered architecture, and other organizational patterns.

Technical Background

ASCII directory trees follow the output format of the Unix/Linux tree command, which has become the de facto standard for displaying project structures. The standard format uses Unicode box-drawing characters (├──, └──, │) or ASCII characters (|--, +--, |) to represent hierarchy. In Markdown, directory trees are displayed in triple-backtick code blocks to maintain monospace font alignment. Common filter rules include excluding version control directories (.git/.svn), dependency directories (node_modules/vendor), build outputs (dist/build), and system files (.DS_Store/Thumbs.db).