Directory Tree Generator
Generate ASCII directory tree structures for documentation.
Document & Markup Converter
About Directory Tree Generator
The ASCII Directory Tree & Project Structure Generator creates beautiful ASCII and Unicode tree diagrams (`├──`, `└──`, `│`) from pasted file paths or local folder selections for GitHub READMEs, technical documentation, and architecture diagrams.
How to Use Directory Tree Generator
Step 1
Paste a list of file paths (or click "Select Local Folder").
Step 2
Select tree styling format (Box Drawing Unicode or Classic ASCII).
Step 3
Toggle hidden files and `node_modules` filters.
Step 4
Click "Copy Tree Diagram".
Practical Use Cases for Directory Tree Generator
GitHub README & Project Architecture Documentation
Generate clean visual ASCII directory trees to display project layout structures inside GitHub README code blocks.
Technical Book & Course Syllabus Diagrams
Illustrate file hierarchies and folder structures for developer tutorials and coding documentation.
Input & Output Examples
Generating Tree from 3 File Paths
`src/index.ts\nsrc/components/Button.tsx\npackage.json`
`.\n├── package.json\n└── src/\n ├── index.ts\n └── components/\n └── Button.tsx`
Key Features & Performance
- ✓Styles: Modern Box Drawing (`├──`, `└──`), Classic ASCII (`|--`, `\--`), or Indented Emoji Folders (📁/📄).
- ✓Input modes: Paste raw file path lists or select a local folder directly via File System API.
- ✓Filters: Ignore `node_modules`, `.git`, `.DS_Store`, and hidden dotfiles automatically.
- ✓100% Client-Side memory execution.
- ✓1-Click Copy ASCII tree.
Key Terminology & Definitions
Box Drawing Characters
A Unicode block (`U+2500–U+257F`) containing line and corner glyphs (such as `├──` and `└──`) used to draw visual hierarchy trees in monospaced text.
ASCII Tree
A text-based visual representation of a hierarchical tree structure using standard monospaced characters.