Folder Structure Generator
Build a folder structure visually or upload a real folder, then copy the ASCII tree for your README or documentation.
Drag and drop using the grip handle on each row. Drop between items to reorder, or drop onto a folder to move inside it.
Tip: Drag the grip handle to reorder or nest items. Double-click any name to rename. Hover to add children or delete.
ASCII Tree Output
Uses ├──, └──, and │ box characters — renders cleanly in any Markdown renderer.
Visual Editor
Build your tree interactively. Drag to reorder or nest folders, add, rename, and delete nodes.
Folder Upload
Drop in a real folder and get its tree instantly. Processed entirely in your browser.
About the Folder Structure Generator
The Folder Structure Generator creates ASCII folder-structure diagrams directly in your browser — no sign-up, no server, no data ever sent anywhere. It's ideal for documenting GitHub repositories, writing technical specs, or visualising a project layout inside a README.
Common use cases
- GitHub README folder structure diagrams
- Project onboarding and handover documentation
- Technical design documents and architecture overviews
- Visualising existing codebases via folder upload
Pro tip
Wrap the copied output in a fenced code block with the bash language hint for the cleanest render on GitHub and most Markdown renderers.
- 100% free — no account needed
- Runs in your browser
- Nothing is uploaded
Frequently asked questions
Can I reorder or move items in the visual editor?
Yes. Use the grip handle on the left of each row to drag files and folders. Drop between siblings to reorder, or drop onto a folder to move an item inside it.
How do I add the ASCII tree to my GitHub README?
Wrap the copied output in a fenced code block. Use the bash or text language hint — for example, ```bash — for the cleanest rendering on GitHub, GitLab, and most Markdown renderers.
Can I upload a real folder from my computer?
Yes. Switch to the Upload Folder tab and select a directory. The browser reads the file paths locally using the File API — nothing is ever sent to any server.
Is my structure saved between visits?
Yes — your structure is saved automatically to your browser's localStorage after every change. When you return to the page it picks up exactly where you left off. Clicking Clear resets everything including the saved state.
How deep can the folder structure be?
There is no hard limit imposed by the tool. In practice, structures beyond 8–10 levels become difficult to read in ASCII form and may exceed the width of most README renderers.
Can I share my folder structure with someone else?
Yes — click the Share button to generate a URL that encodes your entire structure as a Base64 parameter. Anyone with the link will see the exact same layout when they open it.
More developer tools
.gitignore Generator
Generate merged .gitignore rules for your stack with one click.
JSON to TypeScript Interface
Convert JSON into TypeScript interfaces with inferred nested types.
Text to Slug Converter
Convert titles and phrases into clean SEO-friendly URL slugs.
UTM Builder
Build campaign URLs with UTM parameters for analytics tracking.
JSON Formatter & Validator
Validate, format, and minify JSON directly in your browser.
Regex Tester
Test regular expressions with live matches and flag controls.