Which MCP server should I use?

Loginless Web MCP for quick browser-based use with Claude.ai or ChatGPT. Desktop App MCP for the most powerful experience with visuals rendered directly on your canvas. CLI Web MCP for developers using Claude Code, Cursor, or VS Code Copilot.

Do I need a MockFlow account?

Loginless Web MCP requires no account. Desktop App and CLI MCP require a MockFlow account for saving boards to your workspace.

What is IdeaBoard vs WireframePro?

IdeaBoard is MockFlow's visual brainstorming tool with 16 MCP tools for flowcharts, mind maps, kanban boards, and more. WireframePro is the design tool that converts AI-generated HTML into wireframes and exports wireframes to AI for code generation.

Which AI tools are supported?

MockFlow MCP works with Claude.ai, Claude Code, Cursor, VS Code Copilot, ChatGPT, Codex, and any MCP-compatible AI tool.

AI Skills are pre-built prompts that teach Claude Code how to use MockFlow MCP tools for specific tasks automatically. They are available in the GitHub repo and the MockFlow Recipe Library.

Are there rate limits?

Yes. Only visualization tool calls are counted. IdeaBoard Loginless Web MCP: 5 per 30 minutes + 20 per day per session. CLI MCP Basic: 10 per 30 minutes per user. CLI MCP Paid: 30 per 30 minutes per user. Desktop Basic: 10 per 30 minutes. Desktop Paid/App Store: 30 per minute. Every response includes RateLimit headers.

Bring MockFlow to your AI workflow with MCP

Create wireframes, flowcharts, mind maps, and more — directly from Claude, Cursor, or VS Code.

connect to MCP

Choose Your Setup

Three ways to connect

Easiest — No install, no login

Loginless Web MCP

Add MockFlow as a connector in Claude.ai or ChatGPT. No installation, no account required. A new board is created and you get a shareable URL.

How it works:

Step 1: Open Claude.ai → Settings → Connectors

Step 2: Paste: https://app.mockflow.com/ideaboard/mcp

Step 3: Ask Claude to create a flowchart — done!

Best for: Managers, marketers, anyone who uses Claude.ai or ChatGPT in the browser. No technical knowledge needed.

Setup Guide →

Most powerful — Direct on canvas

Desktop App MCP

Built into the MockFlow Desktop App. AI creates visuals directly on your open canvas — no URLs, no waiting.

Step 1: Open Desktop App → open an IdeaBoard project

Step 2: In Claude Code / Cursor, run:
claude mcp add --transport http -s user mockflow-ideaboard http://localhost:21193/mcp

Step 3: Ask: "Create a flowchart for..."

16 tools + layout_board (bento grid layout)

Step 1: Open Desktop App → open a WireframePro project

Step 2: In Claude Code / Cursor, run:
claude mcp add --transport http -s user mockflow-wireframepro http://localhost:21194/mcp

Step 3: Ask: "Create a wireframe for..."

3 tools + read_wireframe (export wireframe to code)

Best for: Designers, product teams, daily MockFlow users. Works with offline/file-mode projects.

Download App →

For developers — Saved to your account

CLI Web MCP

Install from npm, log in via browser (OAuth), and boards are saved to your MockFlow account.

Step 1: npm install -g @mockflow/ideaboard-mcp

Step 2: mockflow-ideaboard-mcp login

Step 3: mockflow-ideaboard-mcp

Step 1: npm install -g @mockflow/wireframepro-mcp

Step 2: mockflow-wireframepro-mcp login

Step 3: mockflow-wireframepro-mcp

Best for: Developers using Claude Code, Cursor, or VS Code Copilot.

npm Package →

Works With

Connect your favorite AI tools

Codex (OpenAI)

Coming soon

ChatGPT

Coming soon

Products

Two products — choose your tool

IdeaBoard — Visual Brainstorming

16 Tools

16 AI tools: flowcharts, mind maps, kanban boards, architecture diagrams, customer journeys, storyboards, and more.

IdeaBoard MCP →

WireframePro — Design

3 Tools + Export

Convert HTML to wireframes. Export wireframes to code. Create flowcharts and architecture diagrams.

WireframePro MCP →

How It Works

Three steps to visual

Describe your project

Tell your AI what you need: a flowchart, a wireframe, a kanban board.

Generate with AI

Your AI calls MockFlow MCP and the visualization is created automatically.

Refine

Open in MockFlow to edit, collaborate, and share with your team.

Use Cases

For every team, not just developers

Product manager using AI to create kanban boards and roadmaps

Product Management

Plan sprints with AI-generated kanban boards. Map user journeys. Create roadmap Gantt charts.

Engineer using AI to create architecture diagrams and flowcharts

Software Engineering

Generate architecture diagrams. Create ER diagrams. Draw flowcharts for complex logic.

Designer converting wireframes to code with AI

Design & UX

Convert wireframes to code and code to wireframes. Iterate between design and development seamlessly.

Marketer using AI to create campaign calendars and journey maps

Marketing & Strategy

Create customer journey maps. Build campaign calendars. Generate competitive analysis charts.

Film director using AI to create storyboards and production schedules

Film & Media

Generate storyboards with cinematic descriptions. Create shot lists. Plan production schedules.

Educator using AI to create mind maps and lesson plan visuals

Education & Research

Create mind maps for lesson plans. Generate flowcharts for processes. Design whiteboards for collaboration.

Open Source

Built in the open

# IdeaBoard MCP Server
npm install -g @mockflow/ideaboard-mcp

# WireframePro MCP Server
npm install -g @mockflow/wireframepro-mcp

mockflow/ideaboard-mcp mockflow/wireframepro-mcp

MIT License

FAQ

Frequently asked questions

MCP (Model Context Protocol) is an open standard created by Anthropic that lets AI assistants like Claude, Cursor, and VS Code Copilot connect to external tools. Think of it as a universal plug that lets your AI talk to other software. With MockFlow's MCP servers, your AI can create flowcharts, wireframes, mind maps, and more — without you having to draw anything.

Mida AI is MockFlow's built-in AI assistant that lives inside the IdeaBoard and WireframePro editors. It generates, modifies, and transforms content directly on your canvas with full context of your project.

MCP servers let you use MockFlow's visualization tools from external AI tools like Claude Code, Cursor, or VS Code Copilot. MCP is ideal when you're already working in your IDE or AI chat and want to create visuals without switching to MockFlow.

In short: Mida AI is the full experience inside MockFlow. MCP brings MockFlow's tools to wherever your AI already is.

Loginless Web MCP — If you use Claude.ai or ChatGPT in the browser and just want quick visualizations. No installation, no login. Boards are created as shareable links.

Desktop App MCP — If you use the MockFlow Desktop App daily. Most powerful option — AI creates visuals directly on your open canvas. Includes exclusive tools like layout_board and read_wireframe.

CLI Web MCP — If you're a developer using Claude Code, Cursor, or VS Code Copilot. Boards are saved to your MockFlow account with OAuth login.

Loginless Web MCP: No account needed. Boards are created as anonymous shareable links.

Desktop App MCP: Yes, you need to be logged into the MockFlow Desktop App.

CLI Web MCP: Yes, you log in via browser (OAuth) when you run mockflow-ideaboard-mcp login. Boards are saved to your account.

IdeaBoard is MockFlow's visual brainstorming tool — an infinite canvas for flowcharts, mind maps, kanban boards, architecture diagrams, customer journey maps, storyboards, calendars, charts, and more. It has 16 MCP tools.

WireframePro is MockFlow's design tool for wireframing and UI design. Its MCP server can convert AI-generated HTML into editable wireframe components, and export wireframes back to AI for code generation. It has 3 MCP tools plus the read_wireframe export tool.

MockFlow MCP works with any MCP-compatible AI tool, including:

• Claude.ai (browser connector)
• Claude Code (terminal)
• Cursor (IDE)
• VS Code Copilot
• ChatGPT (via connector)
• Codex (OpenAI)
• Any tool that supports the Model Context Protocol

The Loginless Web MCP is completely free — no account. The CLI and Desktop App MCP use your MockFlow account, which has a free tier. The MCP npm packages are open source (MIT license) and free to use.

AI Skills are pre-built prompts that teach Claude Code how to use MockFlow MCP tools for specific tasks. For example, the "decision flowchart" skill automatically creates a yes/no decision tree when you ask "Should I use React or Vue?" Skills are available in the GitHub repo and the MockFlow Recipe Library.

Yes. The Desktop App MCP works with both cloud projects and local file-mode projects (.board and .wire files). Components are rendered directly on the canvas and saved to the file automatically.

Yes. Rate limits depend on how you connect and your plan. Only visualization tool calls are counted — protocol messages (initialize, tools/list, ping) are unlimited.

IdeaBoard:
• Loginless Web MCP: 5 visualizations per 30 minutes + 20 per day (per session)
• CLI MCP (Basic): 10 tool calls per 30 minutes (per user)
• CLI MCP (Paid): 30 tool calls per 30 minutes (per user)
• Desktop App (Basic): 10 tool calls per 30 minutes
• Desktop App (Paid / App Store): 30 tool calls per minute

WireframePro:
• CLI MCP (Basic): 10 tool calls per 30 minutes (per user)
• CLI MCP (Paid): 30 tool calls per 30 minutes (per user)
• Desktop App (Basic): 10 tool calls per 30 minutes
• Desktop App (Paid / App Store): 30 tool calls per minute