Back to Directory/Developer Tools

io.github.flowzap-xyz/flowzap

Create workflow, sequence, architecture, and mind map diagrams via AI assistants.

Developer ToolsTypeScriptv2.1.0

FlowZap MCP Server

npm version MCP

Create workflow, sequence, architecture, and mind map diagrams using AI assistants like Claude, Cursor, Windsurf, and 8 other MCP-compatible tools.

FlowZap is a visual workflow diagramming tool with a text-based DSL called FlowZap Code. This MCP server lets AI assistants create diagrams for you.

What is FlowZap?

FlowZap turns text prompts into quad-view diagrams (Workflow, Sequence, Architecture & Mind Map) using FlowZap Code DSL. It is NOT Mermaid, NOT PlantUML - it is a unique domain-specific language designed for simplicity and AI generation.

Key Facts:

  • Only 4 shapes: circle, rectangle, diamond, taskbox
  • Node attributes use colon: label:"Text"
  • Edge labels use equals: [label="Text"]
  • Handles required: n1.handle(right) -> n2.handle(left)
  • Lane display label must be on the same line as the opening brace: laneName { # Label
  • Sequence diagram quality: every cross-lane request needs a matching response edge before the next major request; define edges in chronological order; keep a strict request → response → next request rhythm; no orphaned nodes

Installation

The FlowZap MCP Server works with any tool that supports the Model Context Protocol (MCP):

All Compatible Coding Tools

ToolHow to Configure
Claude DesktopAdd to claude_desktop_config.json:
macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
Windows: %APPDATA%\Claude\claude_desktop_config.json
Claude CodeRun: claude mcp add --transport stdio flowzap -- npx -y flowzap-mcp
Or add to .mcp.json in your project root.
CursorOpen Settings → Features → MCP Servers → Add Server. Use the same JSON config.
Windsurf IDEAdd to ~/.codeium/windsurf/mcp_config.json
OpenAI CodexAdd to ~/.codex/config.toml:
[mcp_servers.flowzap]
command = "npx"
args = ["-y", "flowzap-mcp"]
Or run: codex mcp add flowzap -- npx -y flowzap-mcp
Warp TerminalSettings → MCP Servers → Click "+ Add" → Paste the JSON config.
Zed EditorAdd to settings.json:
{"context_servers": {"flowzap": {"command": "npx", "args": ["-y", "flowzap-mcp"]}}}
Cline (VS Code)Open Cline sidebar → MCP Servers icon → Edit cline_mcp_settings.json
Roo Code (VS Code)Add to .roo/mcp.json in project or global settings.
Continue.devCreate .continue/mcpServers/flowzap.yaml with:
name: FlowZap
mcpServers:
- name: flowzap
command: npx
args: ["-y", "flowzap-mcp"]
Sourcegraph CodyAdd to VS Code settings.json via openctx.providers configuration.

Not Compatible: Replit and Lovable.dev only support remote MCP servers via URL. Use the Public API instead.

JSON Configuration

All tools use the same JSON configuration format:

{
  "mcpServers": {
    "flowzap": {
      "command": "npx",
      "args": ["-y", "flowzap-mcp"]
    }
  }
}

Windows Users: If tools don't appear, use the absolute path:

"command": "C:\\Program Files\\nodejs\\npx.cmd"

Find your npx path with: where.exe npx

Available Tools

Core Tools

ToolDescription
flowzap_validateValidate FlowZap Code syntax
flowzap_fixDeterministically repair mechanical FlowZap Code errors (numbering, inferred handles, label syntax, missing lane labels, emoji/control chars) and return the repaired code plus the corrections applied
flowzap_create_playgroundCreate a shareable diagram URL
flowzap_get_syntaxGet FlowZap Code syntax documentation

Agent-Focused Tools

ToolDescription
flowzap_export_graphExport FlowZap Code as structured JSON graph (lanes, nodes, edges) for reasoning
flowzap_artifact_to_diagramParse HTTP logs, OpenAPI specs, or code into FlowZap diagrams
flowzap_diffCompare two versions of FlowZap Code and get structured diff
flowzap_apply_changeApply structured patch operations (insert/remove/update nodes/edges)

Compliance Tool

ToolDescription
flowzap_compliance_checkRun automated SOC2, GDPR, and PIPL compliance analysis on a FlowZap Code data-flow diagram. Backed by Deepseek LLM with strict rate limits (3/day per IP, 1/hour burst, global 5-min circuit breaker). Returns a shareable ephemeral result URL (60-min TTL).

Mind Map Tools

ToolDescription
flowzap_mindmap_validateValidate FlowZap Code syntax and mind-map readiness
flowzap_mindmap_approveCheck if code is suitable for Mind Map rendering (diamonds/taskboxes = ERROR)
flowzap_mindmap_templateGenerate a ready-to-extend Mind Map tree skeleton
flowzap_mindmap_create_playgroundCreate a playground URL with ?view=mindmap

Usage Examples

Basic Diagram Creation

Ask your AI assistant:

  • "Generate a Sequence diagram of the current Sign In flow implemented in this App"
  • "Create a workflow diagram for an order processing system"
  • "Create an architecture diagram for a microservices API gateway"
  • "Make a flowchart showing user registration flow"
  • "Diagram a CI/CD pipeline with build, test, and deploy stages"

Agent-Focused Workflows

Parse HTTP Logs into Diagrams:

"Here are my nginx access logs. Create a sequence diagram showing the request flow."

The agent uses flowzap_artifact_to_diagram with artifactType: "http_logs".

Analyze Diagram Structure:

"Which steps in this workflow touch the database?"

The agent uses flowzap_export_graph to get a JSON graph, then queries it.

Show What Changed:

"I updated the workflow. What's different from the previous version?"

The agent uses flowzap_diff to compare old and new code.

Safe Incremental Updates:

"Add a logging step after the API call in this diagram."

The agent uses flowzap_apply_change with a structured patch instead of regenerating.

Repair Invalid Code:

"My FlowZap Code fails validation. Fix the mechanical errors for me."

The agent uses flowzap_fix to deterministically repair numbering, inferred handles, label syntax, lane labels, emoji and control characters, then validates the repaired code. Anything the repairer cannot fix is reported as-is — it never invents content.

Compliance Audit:

"Check my data flow diagram for SOC2, GDPR, and PIPL compliance."

The agent uses flowzap_compliance_check to run an automated audit and returns a shareable result page.

Mind Map Creation:

"Create a mind map about AI agent architecture"

The agent uses flowzap_mindmap_template to generate a skeleton, then validates and creates a playground with ?view=mindmap.

The assistant will:

  1. Generate FlowZap Code based on your description
  2. Validate the code
  3. Create a playground URL with the appropriate view (workflow, sequence, or architecture) to view and share

FlowZap Code Example

sales { # Sales Team
  n1: circle label:"Order Received"
  n2: rectangle label:"Submit Order"
  n5: rectangle label:"Receive decision"
  n1.handle(right) -> n2.handle(left)
  n2.handle(bottom) -> fulfillment.n3.handle(top) [label="Submit"]
}

fulfillment { # Fulfillment
  n3: rectangle label:"Review Order"
  n4: rectangle label:"Return decision"
  n3.handle(right) -> n4.handle(left)
  n4.handle(top) -> sales.n5.handle(bottom) [label="Approved"]
}

Public API Endpoints

These endpoints are available for external integrations (no authentication required):

EndpointMethodRate LimitDescription
/api/validatePOST30/minValidate FlowZap Code syntax
/api/fixPOST30/minDeterministically repair mechanical FlowZap Code errors and return the repaired code + applied corrections
/api/playground/createPOST5/min, 50/dayCreate ephemeral playground URL (15-min TTL)
/api/compliance-checkPOST5/min, 30/dayRun SOC2/GDPR/PIPL compliance analysis on FlowZap Code. Returns frameworks + shareable result URL (60-min TTL). Backed by Deepseek LLM.

Security

  • No authentication required - Uses only public FlowZap APIs
  • No user data access - Cannot read your diagrams or account
  • Runs locally - The MCP server runs on your machine
  • SSRF protected - Only connects to flowzap.xyz
  • Rate limited - 30 requests/minute client-side
  • Input validation - 50KB max code size

Agent Skill (skills.sh)

Install the FlowZap skill for 40+ compatible coding agents via skills.sh:

npx skills add flowzap-xyz/flowzap-mcp

Public MCP Adoption Signals

Official Listings

Links

License

MIT

Installation

Source-derived launch command. Check the maintainer’s required arguments and credentials before running:

bash
npx -y flowzap-mcp

Set up in your AI client

Merge this template into ~/Library/Application Support/Claude/claude_desktop_config.json. Keep existing servers. Add any arguments, credentials, and permissions required by the maintainer; this template has not been install-tested.

json
{
  "mcpServers": {
    "io-github-flowzap-xyz-flowzap": {
      "command": "npx",
      "args": [
        "-y",
        "flowzap-mcp"
      ]
    }
  }
}

Restart Claude Desktop completely for changes to take effect. Confirm the server appears connected in the client’s tool list, then try a read-only example from its documentation.

Claude Desktop setup reference

Package

flowzap-mcpnpm

Compatible MCP Clients

io.github.flowzap-xyz/flowzap works with any MCP-compatible client. Copy the config snippet from the Configuration section above and add it to the file shown for your client, then restart the application.

  • Claude Desktop~/Library/Application Support/Claude/claude_desktop_config.jsonRestart Claude Desktop completely for changes to take effect.
  • Cursor~/.cursor/mcp.jsonRestart Cursor for changes to take effect.
  • VS Code.vscode/mcp.jsonReload VS Code window for changes to take effect.
  • Windsurf~/.codeium/windsurf/mcp_config.jsonRestart Windsurf for changes to take effect.
  • Claude Code.mcp.jsonSave at the project root, then start Claude Code in that project and review the MCP server approval prompt. Keep real credentials out of shared files.

Learn More