LibreAI / Design / vscode-drawio
// design · hediet/vscode-drawio

vscode-drawio

This unofficial extension integrates Draw.io (also known as diagrams.net) into VS Code.

★ 9.5k stars⑂ 467 forksGPL-3.0updated 2026-10
▦ visual — this project's README ships no embeddable screenshot,
so here's a placeholder. The guide below is complete regardless.
// project facts

Project facts

vscode-drawio is an open-source design project by hediet (hediet/vscode-drawio on GitHub). It has 9,495 GitHub stars and 467 forks, is released under the GPL-3.0 license, and was last updated on GitHub on 3 October 2026.

GitHub stars
9,495
Forks
467
License
GPL-3.0
Last updated on GitHub
3 October 2026
Category
Design
Listing
Full install guide
Official site
Official site
// how it works

How it works

  1. Pick the surface

    Whiteboard, diagrams-as-code, or component library — match the artifact.

  2. Start from templates

    Community templates and themes skip the blank page.

  3. Collaborate

    Real-time editing and version history included.

  4. Export & ship

    SVG/PNG/code output drops into products and docs.

// features

Why people love it

Self-hostable

Run the whole studio on your own server.

Infinite canvas

Brainstorm without page boundaries.

Component systems

Production-ready UI kits with theming.

Diagrams as code

Version diagrams in git alongside your code.

Real-time collaboration

Multiplayer cursors without the enterprise invoice.

No per-seat fees

The whole team joins free.

Advertisement
// run it

Run it yourself

  1. Step 1 — Clone the repo

    Download the source and move into the project folder.

    git clone https://github.com/hediet/vscode-drawio.git
    cd vscode-drawio
  2. Step 2 — Check the README

    Every project documents its own setup; start with install requirements.

    cat README.md | head -60
  3. Step 3 — Run it

    Follow the project's launch command — Docker, pip, npm, or a binary release.

    # see README for the exact launch command
// use cases

What you can build

Advertisement
// faq

Questions, answered

Who maintains vscode-drawio?

It is an open-source project at hediet/vscode-drawio with 467 forks. Check the repo's contributors and recent commits to see how active maintenance is.

Is vscode-drawio free for commercial use?

GPL-3.0 — free to use, but derivative works must stay open.

Can it replace Figma?

For whiteboarding and diagrams, yes. Deep product design still favors Figma's ecosystem.

What about design handoff?

Export to code and specs that developers can actually use.

Can I self-host?

Most of these offer Docker images for private instances.

// keep exploring

Similar tools

Design

rallly

Rallly is an open-source scheduling and collaboration tool designed to make organizing events and meetings easier.

★ 5.3k starsAGPL-3.0
View guide →
Design

oxdraw

Diagram as Code Tool Written in Rust with Draggable Editing

★ 2.4k starsMIT
View guide →
Design

Checkmate

Checkmate is an open-source, self-hosted tool designed to track and monitor server hardware, uptime, response times, and incidents in real-time with beautifu…

★ 10.9k starsAGPL-3.0
View guide →
Design

draw.io Desktop

draw.io Desktop — the official offline desktop app for diagrams.net: flowcharts, architecture diagrams and wireframes in an Electron app that never sends your diagram data anywhere, GPL-3.0

★ 63.6k starsGPL-3.0
View guide →
Design

diagrams

:art: Diagram as Code for prototyping cloud system architectures

★ 42.7k starsMIT
View guide →
Design

QuickApp

AI-ready Angular + ASP.NET Core starter with hardened auth built in

★ 1.4k starsMIT
View guide →
// alternatives

Alternatives in Design

The most-starred other Design projects in the LibreAI catalogue — the realistic shortlist if vscode-drawio is not the right fit.

Get vscode-drawio

Free and open — grab the source, star the repo, and start creating.