Skip to content
| Marketplace
Sign in
Visual Studio Code>Visualization>Markdown BoardNew to Visual Studio Code? Get it now.
Markdown Board

Markdown Board

Ike Chang

|
5 installs
| (0) | Free
Visualize a folder of Markdown files as a Kanban board powered by frontmatter.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Markdown Board

Visualize a folder of Markdown files as a Kanban board in VS Code:.

Files in subdirectories become cards in columns named after those directories; root-level files go to Inbox.

Board View

More Screenshots

Move Card

Move Card

Card Preview

Card Preview

Edit Card

Edit Card

Quick Start

  1. Create a folder for your board
  2. Create subdirectories for each column (e.g., Todo, Doing, Done)
  3. Add markdown files:
    • Root level .md files appear in Inbox
    • Files in subdirectories appear in columns named after those directories
  4. Right-click the folder in VS Code: Explorer → Open Folder as Kanban Board
  5. Click cards to preview, drag to move, or use ••• for actions

Example Structure

my-board/
├── inbox-item.md          # Appears in "Inbox" column
├── Todo/
│   └── task-to-do.md      # Appears in "Todo" column
├── Doing/
│   └── in-progress.md     # Appears in "Doing" column
└── Done/
    └── completed.md       # Appears in "Done" column

Features

  • Cards: Click to preview, drag to move, ••• for Edit/Move/Delete
  • Columns: Drag headers to reorder (Inbox stays first)
  • Create: Click Create in any column header
  • Auto-refresh: Watches files and directories for external changes

Managing Columns

Columns are based on directories in your board folder:

  • To add a column: Create a new directory in the board folder (e.g., mkdir Todo)
  • To remove a column: Delete the directory (e.g., rm -rf Todo)
  • To rename a column: Rename the directory

The board updates automatically when directories change.

Card Format

Frontmatter is now optional. The filename becomes the card title (with an optional frontmatter override):

---
title: "Optional Custom Title"  # Overrides filename
summary: "Some text..."         # Optional, shown on card
---

# Your Content Here

Without frontmatter, the filename becomes the title (first letter capitalized):

  • my-task.md → "My task"
  • implement-auth.md → "Implement auth"

Development

npm install
npm run compile  # or npm run watch

Press F5 to launch the Extension Development Host.

License

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft