System design, reimagined

Draw your stack.
Ship it as a spec.

Draw your stack visually — services, databases, queues, data flows — and ship it as a living spec your whole team can read. Connect your AI agent via MCP and let it write and query the diagram directly while you design.

Start designing — it's free See how it works

No account required to try. Saves locally in your browser.

Features

Everything your architecture doc needs

A canvas that thinks at the level of systems — not pixels — so you spend time on the design, not the tool.

22 archetypes, 370+ tools

Every component shape maps to a real architectural concept — load balancer, queue, database, cache. Real-mode flips abstract symbols to actual vendor logos without moving a thing.

Dual view: symbol ↔ logo

Hit M to toggle every node between engineering archetype symbols and real vendor logos. Perfect for presentations to both technical and non-technical audiences.

Sequence + DB schema views

Switch to the Sequence tab to map interactions between participants. The DB Schema tab auto-generates entity cards from any database node in your architecture diagram.

Boundary grouping

Draw a boundary region and any nodes inside it are automatically grouped. Use it to mark VPCs, teams, services, or any logical partition of your architecture.

Instant share links

Copy a compressed share URL — entire diagram serialized into the hash, no account needed. Your audience opens the link and gets a read-only live canvas.

Mermaid import

Paste any Mermaid flowchart and it becomes an editable canvas instantly. Great for migrating existing architecture docs or bootstrapping from an AI-generated diagram.

Notes tab

A full-screen Markdown editor lives alongside every diagram. Write ADRs, runbooks, meeting notes, or sprint plans — and let your AI agent fill them in via set_notes or append_to_notes.

Configurable tab templates

Start each diagram from a preset — Developer, Architect, Data Engineer — or create your own. Show only the tabs that matter for your role; hide the rest. Your AI agent can also add or remove tabs via MCP.

MCP — Model Context Protocol

Let your AI agent draw the diagram

Connect Claude, Cursor, or any MCP-compatible client to Modudraft. Your agent can read the current architecture, add nodes and edges, write notes, manage which tabs are visible, and lay out the diagram — all via natural language. You stay in the loop; it does the grunt work.

Connect your agent