Directory Tree Generator — Folder Structure & File Tree Tool

Free online folder structure generator. Create ASCII directory trees for README files, documentation, and project planning. Supports standard and emoji icon styles. No sign-up needed.

Directory Structure Input

Use indentation (spaces or tabs) to define nesting. Each indent level = one folder deeper.

How to Use

Type your folder and file names, using indentation (spaces or tabs) to show nesting.

Set the root folder name and choose standard or fancy (with emoji icons) style.

Click Generate. Copy the tree to paste into READMEs, docs, or code comments.

What is a Directory Structure Generator?

A directory structure generator creates an ASCII art representation of a folder hierarchy — the kind you see in project README files and documentation. Instead of manually typing ├── and └── characters, you simply list your folders and files with indentation, and the tool generates the correctly formatted tree. It supports standard ASCII style and a fancy style with folder/file emoji icons.

Use Cases & Examples

README File Trees

Type your folder names with indentation, generate the tree, copy it straight into your README.md. No manual ├── typing.

Project Documentation

Explain your project structure to teammates or contributors. Works for any stack — React, Node.js, Python, or anything else.

Standard or Emoji Style

Choose plain ASCII tree characters or switch to emoji mode — 📁 for folders, 📄 for files. Pick whatever fits your doc.

No Install Required

Runs in the browser. No VS Code extension, no pip install, no account. Open it, use it, done.

Frequently Asked Questions

How do I define nested folders?
Use indentation (spaces or tabs) to define nesting. Each level of indentation becomes a child of the line above it. For example, indent "styles.css" under "css/" to make it a child.
What characters are used for the tree?
The standard ASCII tree uses ├── for middle items and └── for the last item in a group, with │ for vertical lines connecting parent folders.
Can I use this for documentation?
Yes. The output is plain text that you can paste into README files, documentation, code comments, Slack messages, or any monospaced context.
Does it detect files vs folders?
Names ending with / are shown as folders. Names with file extensions (like .js, .php) are shown as files. Everything else is treated as a folder.
What is the fancy style?
Fancy style adds folder and file emoji icons (📁 and 📄) before each name for a more visual representation.

Share This Tool

Found it useful? Share it with your friends, classmates, or colleagues.

WhatsApp Facebook X Telegram LinkedIn