Happy slice of mcp pizzaMCP.pizza

agentic-mermaid

MCP.Pizza Chef: adewale

Agentic Mermaid lets you describe diagrams in plain language and get back polished, ready-to-use images like SVG and PNG without needing design skills. It works with VS Code and other MCP-compatible apps, allowing your AI assistant to generate, edit, and customize diagrams easily. You can preview diagrams as text art and apply brand colors and styles. Setup is simple with copy-paste config or running commands via npx, no accounts or keys required.

Coding
Images/Design
Other

Use This MCP server To

Generate professional-looking diagrams from plain text descriptions Convert AI-generated diagram code into SVG or PNG images Edit existing diagrams safely with AI-assisted commands Preview diagrams as ASCII or Unicode art for quick review Customize diagram styles to match brand colors and fonts Integrate diagram creation into VS Code with AI assistance Export diagrams for reports, presentations, or websites

README

Agentic Mermaid

Beautiful diagrams, made with your agent.

Agentic Mermaid is an open-source Mermaid toolkit for people who want AI agents to create diagrams that look finished: SVG and PNG renders, ASCII and Unicode for review, deterministic layout, and Style + Palette controls for brand colors, typography, strokes, fills, and backdrops.

It is forked from lukilabs/beautiful-mermaid. Published on npm as agentic-mermaid; the GitHub repository is adewale/agentic-mermaid; the canonical live site is agentic-mermaid.dev, a Cloudflare Workers deployment.

Agentic Mermaid: Mermaid source plus typed edit ops on the left, the verified SVG render in the middle, and the same diagram as ASCII on the right

Live Demo & Samples · Live Editor

Docs: docs index · getting started · agent guide · agent API cookbook · design system · skills · fork differences · vs Mermaid & Beautiful Mermaid · changelog

Why Agentic Mermaid

Use it when you want to describe a diagram in plain language and get back something you can publish without a design cleanup pass.

You want Agentic Mermaid gives you
An agent to draft the diagram Mermaid source plus a verified render path
Beautiful defaults Built-in looks such as watercolor, blueprint, hand-drawn, and publication-figure
Brand fit Style + Palette stacks and custom JSON palettes you can keep in your repo
Safe edits later parseRegisteredMermaid → family narrower → mutate → verifyMermaid → serializeMermaid
Reviewable artifacts SVG, PNG, ASCII, Unicode, and JSON layout from the same source

The agent workflow is the guardrail behind the polish: agents should not guess from pixels, concatenate strings, or regenerate whole diagrams when a structured edit is available.

Highlights

agentic-mermaid FAQ

Can I use this to create and edit diagrams with my AI assistant?
Yes — agentic-mermaid lets your AI generate, render, and safely edit diagrams in VS Code and other MCP-compatible apps.
Does it work in VS Code?
Yes — it supports VS Code and any app that can connect to MCP servers.
Do I need an API key or account to use agentic-mermaid?
No — it is open-source and runs locally or self-hosted without accounts or keys.
How hard is it to set up agentic-mermaid?
Setup is easy — just copy-paste a small config snippet or run a simple command with npx.
Can I get diagrams in formats like SVG or PNG?
Yes — it outputs polished diagrams as SVG, PNG, ASCII, and Unicode for review and publishing.
Can I customize the style and colors to match my brand?
Yes — it supports custom palettes and style controls to fit your brand colors and typography.