Skip to main content

​
Quick Start

Draw Folder Structure makes it incredibly easy to generate markdown representations of your project structure. Follow these simple steps to get started.
1

Navigate to File Explorer

Open the file explorer in VS Code (View > Explorer or Cmd/Ctrl+Shift+E)
2

Right-click on a Folder or File

In the file explorer, right-click on any folder or file you want to generate a structure for.
You can select any folder at any level - the root project folder, a subdirectory, or even a single file.
3

Select 'Generate Markdown structure'

From the context menu, click on “Generate Markdown structure”The extension will:
  • Generate the markdown structure
  • Automatically copy it to your clipboard
  • Open a new document showing the generated structure
4

Use the Generated Structure

You’ll see a success notification: “Markdown structure copied to clipboard!”Now you can paste the structure anywhere you need it - README files, documentation, issues, or pull requests.

​
What Gets Generated

When you run the command, the extension creates a markdown-formatted text representation of your folder and file structure. The output is automatically wrapped in markdown code blocks for proper formatting.

​
Example Output

For a typical VS Code extension project, the generated structure looks like this:

​
Clipboard Integration

One of the most convenient features is the automatic clipboard integration:
Every time you generate a structure, it’s automatically copied to your clipboard. No need to manually select and copy the text!

​
How It Works

  1. Automatic Copy: When the command completes, the markdown structure is written to your system clipboard
  2. Visual Confirmation: You’ll see a notification message confirming the copy
  3. Ready to Paste: Simply use Cmd/Ctrl+V to paste the structure anywhere

​
Usage Examples

# Project Structure

Here's an overview of our project organization:
└── 📁 my-app ├── index.js ├── 📁 components └── 📁 utils

​
Quick Tips

Keyboard Shortcut

While there’s no default keyboard shortcut, you can add one in VS Code:
  1. Open Keyboard Shortcuts (Cmd/Ctrl+K Cmd/Ctrl+S)
  2. Search for “Generate Markdown structure”
  3. Assign your preferred shortcut

Command Palette

You can also run the command from the Command Palette:
  1. Press Cmd/Ctrl+Shift+P
  2. Type “Generate Markdown structure”
  3. Press Enter
Note: Make sure a file or folder is selected in the explorer first.

Multiple Structures

Need to document multiple folders?
  • Generate each structure separately
  • Each generation overwrites the clipboard
  • Paste each one before generating the next

Large Folders

For folders with many files:

​
Next Steps

Customize Styles

Explore 20+ different visual styles for your folder structures

Configure Settings

Learn about all available configuration options

Exclude Patterns

Set up patterns to exclude specific files and folders

Build docs developers (and LLMs) love

Get started for freeTalk to us