Vizdown-MCP
The Vizdown-MCP server converts Markdown files containing diagram definitions into various visual formats using Mermaid.js and custom SVG renderers.
Render a single diagram (
render_diagram): Convert the first diagram block found in a.mdfile or raw text into SVG, PNG, JPEG, or PDF, with options for light/dark theme, default/hand-drawn style, and resolution scaling.Render all diagrams (
render_all_diagrams): Process every diagram block in a Markdown file or raw text at once, optionally saving outputs to a specified directory with auto-generated filenames.List diagrams without rendering (
list_diagrams): Scan a Markdown file or raw text and return metadata (type, start/end line) for every detected diagram block — useful for inspection before rendering.20+ diagram types supported: Flowcharts, sequence, class, ER, state, Gantt, git graphs, pie charts, timelines, user journeys, mind maps, architecture/service diagrams, kanban boards, C4 diagrams, quadrant charts, sankey, xychart, block diagrams, and more.
Flexible output & theming: Export as SVG (default), PNG, JPEG, or PDF with configurable resolution scaling; choose between light/dark themes and default/hand-drawn visual styles.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Vizdown-MCPrender the flowchart in auth_flow.md as a PNG"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Clarity-beta
Clarity-beta is an MCP server that converts Markdown files into beautiful diagrams — flowcharts, mind maps, architecture diagrams, ER diagrams, Gantt charts, sequence diagrams, and more. Built with Apple HIG design language.
Installation
git clone https://github.com/rutika196/clarity-beta.git
cd clarity-beta
python3 -m venv .venv
source .venv/bin/activate # macOS / Linux
# .venv\Scripts\activate # Windows
pip install -e .
playwright install chromiumRelated MCP server: DiagramMCP
IDE Setup
Cursor
Create or edit .cursor/mcp.json in your project root:
{
"mcpServers": {
"clarity-beta": {
"command": "/absolute/path/to/clarity-beta/.venv/bin/python",
"args": ["-m", "src.server"],
"cwd": "/absolute/path/to/clarity-beta"
}
}
}Replace
/absolute/path/to/clarity-betawith your actual project path.
VS Code
Create .vscode/mcp.json in your project root:
{
"servers": {
"clarity-beta": {
"command": "/absolute/path/to/clarity-beta/.venv/bin/python",
"args": ["-m", "src.server"],
"cwd": "/absolute/path/to/clarity-beta"
}
}
}VS Code reads MCP config from
.vscode/mcp.json— no need to touchsettings.json.
IntelliJ IDEA / WebStorm / PyCharm (JetBrains)
JetBrains IDEs (2025.1+) support MCP via the AI Assistant plugin.
Go to Settings → Tools → AI Assistant → MCP Servers.
Click + Add and fill in:
Field | Value |
Name |
|
Command |
|
Arguments |
|
Working Directory |
|
Or edit the MCP config file directly at ~/.config/jetbrains/mcp.json:
{
"mcpServers": {
"clarity-beta": {
"command": "/absolute/path/to/clarity-beta/.venv/bin/python",
"args": ["-m", "src.server"],
"cwd": "/absolute/path/to/clarity-beta"
}
}
}Windows users: replace
.venv/bin/pythonwith.venv\\Scripts\\python.exeand use\\in paths.
Claude Desktop
Edit ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows):
{
"mcpServers": {
"clarity-beta": {
"command": "/absolute/path/to/clarity-beta/.venv/bin/python",
"args": ["-m", "src.server"],
"cwd": "/absolute/path/to/clarity-beta"
}
}
}Usage
As a standalone server (stdio transport)
source .venv/bin/activate
clarity-beta
# or
python -m src.serverMCP Tools
render_diagram
Render the first diagram found in a Markdown file or raw text.
Parameter | Type | Default | Description |
| string | — | Path to a |
| string | — | Raw markdown with a diagram block |
| string |
|
|
| string |
|
|
| string |
|
|
| int |
| Resolution multiplier for PNG/JPEG |
render_all_diagrams
Render every diagram block in a file. Same parameters plus output_dir to save files.
list_diagrams
List detected diagram blocks with types and line numbers, without rendering.
Supported Diagram Types
Via Mermaid.js (Playwright)
flowchart, sequence, class, ER, state, gantt, gitGraph, pie, timeline, quadrant, sankey, xychart, block-beta, architecture-beta, kanban, journey, C4
Custom SVG Renderers
Mind maps — balanced horizontal tree with organic Bézier connectors
Architecture / service diagrams — Miro-style auto-layout with icons, step badges, groups
Examples
See the examples/ folder — 13 ready-to-render Markdown files:
File | Diagram Type |
| Flowchart (OAuth 2.0 + MFA) |
| Sequence diagram |
| State diagram |
| ER diagram |
| Class diagram |
| Gantt chart |
| Pie chart |
| Git graph |
| Timeline |
| User journey |
| Mind map (custom SVG) |
| Architecture (17 services + groups) |
| Architecture (CI/CD pipeline) |
Running Tests
python tests/test_all.pyDependencies
mcp[cli]— MCP Python SDKplaywright— Headless Chromium for Mermaid rendering and PNG/JPEG exportcairosvg— SVG to PDF conversionPillow— Image processing (optional, for JPEG)
Available Tools
3 toolslist_diagramsA
List all detected diagram blocks without rendering them.
Args: file_path: Path to a .md file. raw_markdown: Raw markdown string.
Returns: List of dicts with diagram_type, line_start, and line_end for each block.
| Name | Required | Description | Default |
|---|---|---|---|
| file_path | No | ||
| raw_markdown | No |
Output Schema
| Name | Required | Description |
|---|---|---|
| result | Yes |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states what the tool does (detection without rendering) and describes the return format, but doesn't mention error conditions, performance characteristics, or whether both parameters can be used simultaneously. It provides basic behavioral context but lacks depth for a tool with two parameters.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is perfectly structured and concise: a clear purpose statement followed by separate Args and Returns sections. Every sentence earns its place, with no redundant information. The three-part structure (purpose, parameters, returns) is efficient and well-organized.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool has an output schema (implied by 'Returns' section), the description doesn't need to fully document return values. However, with no annotations and 0% schema description coverage for inputs, the description should do more to explain parameter usage and constraints. It provides adequate context for a detection tool but could better address the two alternative input parameters.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 0%, so the schema provides no parameter documentation. The description mentions both parameters in the Args section but only provides their names without explaining their purpose, relationship, or constraints. While it acknowledges the parameters exist, it doesn't add meaningful semantic information beyond what's already visible in the schema structure.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the specific action ('List all detected diagram blocks') and resource ('diagram blocks'), distinguishing it from sibling tools like 'render_all_diagrams' and 'render_diagram' by specifying 'without rendering them'. This provides immediate differentiation and clarity about what the tool does versus its alternatives.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description implies usage context by stating 'List all detected diagram blocks without rendering them', which suggests this tool is for detection/analysis rather than visualization. However, it doesn't explicitly state when to use this versus the rendering siblings or provide exclusion criteria. The context is clear but lacks explicit alternatives guidance.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
render_all_diagramsA
Render ALL diagram blocks found in a Markdown file.
Parses the entire document, finds every diagram block, renders each separately, and optionally saves output files.
Args: file_path: Path to a .md file. raw_markdown: Raw markdown string. output_format: "svg", "png", "jpeg", or "pdf". theme: "light" or "dark". look: "default" or "handDrawn". scale: Resolution multiplier for raster output. output_dir: Directory to save rendered files. Files are named {stem}{type}{index}.{format}.
Returns: List of result dicts, each with diagram_type, index, and base64 output.
| Name | Required | Description | Default |
|---|---|---|---|
| file_path | No | ||
| raw_markdown | No | ||
| output_format | No | svg | |
| theme | No | light | |
| look | No | default | |
| scale | No | ||
| output_dir | No |
Output Schema
| Name | Required | Description |
|---|---|---|
| result | Yes |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries full burden and does well by disclosing key behavioral traits: it parses the entire document, finds every diagram block, renders each separately, optionally saves output files with specific naming conventions, and returns a list of result dicts. It doesn't mention performance implications, error handling, or file system permissions, but provides substantial operational context.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is perfectly structured and appropriately sized: a clear purpose statement, followed by detailed behavioral context, then organized parameter documentation, and finally return value information. Every sentence earns its place with zero waste, and the information is front-loaded with the core functionality stated first.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (7 parameters, batch processing), no annotations, and the presence of an output schema, the description is remarkably complete. It covers purpose, behavior, detailed parameter semantics, and return structure. The output schema handles return values, so the description appropriately focuses on operational context and parameter guidance.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
With 0% schema description coverage for 7 parameters, the description compensates excellently by providing detailed parameter semantics in the Args section. It explains each parameter's purpose, acceptable values (e.g., output_format options, theme options), defaults, and even file naming conventions for output_dir. This adds substantial meaning beyond the bare schema.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Render ALL diagram blocks found in a Markdown file' with specific details about parsing the entire document, finding every diagram block, and rendering each separately. It distinguishes from sibling tools 'list_diagrams' and 'render_diagram' by emphasizing processing ALL diagrams rather than listing or rendering individual ones.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides clear context about when to use this tool: for processing all diagrams in a Markdown file. It doesn't explicitly state when NOT to use it or name alternatives, but the context implies this is for batch processing versus the sibling 'render_diagram' for single diagrams. The guidance is clear but lacks explicit exclusions or named alternatives.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
render_diagramA
Render the first diagram found in a Markdown file or raw text.
Args: file_path: Path to a .md file containing a diagram block. raw_markdown: Raw markdown string with a diagram code block. output_format: "svg" (default), "png", "jpeg", or "pdf". theme: "light" (default) or "dark". look: "default" or "handDrawn" (Mermaid sketch mode). scale: Resolution multiplier for PNG/JPEG (default 2).
Returns: Dict with diagram_type, output_format, and base64-encoded output.
| Name | Required | Description | Default |
|---|---|---|---|
| file_path | No | ||
| raw_markdown | No | ||
| output_format | No | svg | |
| theme | No | light | |
| look | No | default | |
| scale | No |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It effectively describes key behaviors: it renders only the first diagram found (not all), supports multiple input sources (file or raw text), and returns a specific dictionary structure. However, it doesn't mention error handling, performance characteristics, or authentication requirements.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is perfectly structured and front-loaded with the core purpose first, followed by organized parameter details and return information. Every sentence earns its place with no wasted words, making it easy for an AI agent to parse and understand.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's moderate complexity (6 parameters, no annotations, no output schema), the description provides excellent coverage of inputs and basic behavior. However, without an output schema, it could benefit from more detail about the return dictionary structure beyond just listing the keys. The description adequately covers the core functionality but leaves some implementation details unspecified.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
With 0% schema description coverage, the description fully compensates by providing clear semantic information for all 6 parameters. It explains what each parameter does, their default values, and valid options (e.g., output_format can be 'svg', 'png', 'jpeg', or 'pdf'), going well beyond what the bare schema provides.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with specific verbs ('Render the first diagram found') and resources ('Markdown file or raw text'), distinguishing it from sibling tools like 'list_diagrams' (which lists diagrams) and 'render_all_diagrams' (which renders all diagrams rather than just the first).
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides clear context about when to use this tool (to render the first diagram from a Markdown source), but it doesn't explicitly state when NOT to use it or mention alternatives like using 'render_all_diagrams' for multiple diagrams. The sibling tool names provide some implicit guidance.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections. Dates show when Glama detected each change.
3 tool updates
v0.1.0- First observed
list_diagrams - First observed
render_all_diagrams - First observed
render_diagram
TDQS
The three tools have overlapping purposes that could cause confusion: 'render_all_diagrams' and 'render_diagram' both render diagrams with similar parameters, differing only in whether they process all diagrams or just the first one. 'list_diagrams' is distinct for listing without rendering, but the two render tools have unclear boundaries that might lead to misselection.
All tool names follow a consistent snake_case pattern with clear verb_noun structure: 'list_diagrams', 'render_all_diagrams', and 'render_diagram'. The naming is predictable and readable throughout the set.
Three tools is a reasonable count for a diagram rendering server, allowing for listing and rendering operations. It's slightly thin but covers core functionality without being excessive for the apparent scope.
The tool set covers listing and rendering diagrams with various output options, but there are notable gaps: no tools for updating, deleting, or managing diagram content directly (e.g., editing or validating diagrams), which limits lifecycle coverage for the domain.
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Generate dynamic Mermaid diagrams and charts with AI assistance. Customize styles and export diagr…
Render, verify, describe, and safely edit Mermaid diagrams through MCP.
Publish markdown documents as public share links with mermaid diagrams. Built by AutEng.ai
Publish markdown documents as public share links with mermaid diagram support. Built by AutEng.ai
Related MCP Servers
- AlicenseBqualityDmaintenanceGenerates SVG diagram files from Mermaid syntax with support for multiple themes and customizable backgrounds, using Puppeteer for reliable rendering.121MIT
- FlicenseNot gradedqualityDmaintenanceEnables the dynamic generation of various software development diagrams, such as flowcharts, sequence diagrams, and architecture diagrams, using Mermaid syntax. It includes tools for diagram validation and provides instructions for exporting results to multiple formats including SVG and PNG.-
- FlicenseNot gradedqualityDmaintenanceConverts Markdown files and standalone Mermaid diagrams into high-quality PDF or PNG documents using Puppeteer and SVG rendering. It supports custom CSS styling and provides tools for professional document generation from markdown-based content.4-
- AlicenseNot gradedqualityDmaintenanceEnables creating, manipulating, and managing Mermaid diagrams with automatic saving and multi-format conversion from JSON, CSV, Python, Markdown, and plain text.7MIT
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/rutika196/clarity-beta'
If you have feedback or need assistance with the MCP directory API, please join our Discord server