Agentic Mermaid

Measured conclusion: Deep-tested. L2 outcome: tools_ok.

Render, verify, describe, and safely edit Mermaid diagrams through MCP.

Add to your agent

Copy this into your MCP client config:

{
  "mcpServers": {
    "Agentic Mermaid": {
      "url": "https://agentic-mermaid.dev/mcp",
      "transport": "streamable-http"
    }
  }
}

Measured tools (9)

• execute read-only

  Run JavaScript in an isolated sandbox; return a value. One call composes edits. Submit JavaScript; declaration types are guidance. No promises, async/await, dynamic import, or type annotations. Hosted note: execute runs in an on-demand isolate and costs more than the direct render_svg/render_ascii/render_png/verify/describe tools — prefer those for plain render/verify calls. For straightforward structured edits, prefer the declarative mutate/build tools; reserve execute for logic the ops don't express. Hosted mermaid.renderMermaidSVG*, renderMermaidASCII*, and layoutMermaidWithReceipt calls force security:'strict' and embedFontImport:false; caller code cannot weaken that host policy. SDK declaration: type DiagramKind = 'flowchart' | 'state' | 'sequence' | 'timeline' | 'class' | 'er' | 'journey' | 'architecture' | 'xychart' | 'pie' | 'quadrant' | 'gantt' | 'mindmap' | 'gitgraph' | 'radar' type MutationOp = { kind: string; [field: string]: unknown } type Result<T, E = { code: string; message: string }> = { ok: true; value: T } | { ok: false; error: E } interface SourceLocation { readonly line: number; readonly col: number } interface SourceMapSpans { readonly preserved: PreservedSourceSpans; readonly nodes: ReadonlyMap<string, SourceSpan>; readonly edges: ReadonlyMap<string, SourceSpan>; readonly groups: ReadonlyMap<string, SourceSpan>; readonly labels: ReadonlyMap<string, SourceSpan> } interface SourceMap { readonly nodes: ReadonlyMap<string, SourceLocation>; readonly edges: ReadonlyMap<string, SourceLocation>; readonly groups: ReadonlyMap<string, SourceLocation>; readonly labels: ReadonlyMap<string, SourceLocation>; readonly spans?: SourceMapSpans } interface ValidDiagram { readonly kind: DiagramKind; readonly source: SourceMap } type ExternalFamilyId = `family:${string}` interface ExtensionCompatibility { readonly [contract: string]: string | undefined readonly core?: string readonly scene?: string } interface ExtensionProvenance { readonly owner: string; readonly source: string; readonly reference?: string } interface ExtensionIdentity<Kind extends string = string> { readonly id: `${Kind}:${string}` readonly kind: Kind readonly version: string readonly compatibility: ExtensionCompatibility readonly provenance: ExtensionProvenance } interface SourceSpanPoint { readonly offset: number; readonly line: number; readonly col: number } interface SourceSpan { readonly start: SourceSpanPoint; readonly end: SourceSpanPoint } interface PreservedSourceSpans { readonly source: SourceSpan readonly wrapper?: SourceSpan readonly frontmatter?: SourceSpan readonly initDirectives?: readonly SourceSpan[] readonly accessibilityDirectives?: readonly SourceSpan[] readonly header: SourceSpan readonly body: SourceSpan } interface SourcePreservationReceipt { readonly version: 1 readonly classification: 'unsupported' | 'inventory-only' | 'unknown' readonly source: string readonly header: string readonly upstreamFamilyId?: string readonly mermaidVersion: string readonly spans?: PreservedSourceSpans } interface ParseError { readonly code: string readonly message: string readonly line?: number readonly col?: number readonly preservation?: SourcePreservationReceipt readonly help?: string } interface ExtensionValidDiagram { readonly kind: ExternalFamilyId readonly descriptorIdentity: ExtensionIdentity<'family'> readonly source: SourceMap } interface PreservedValidDiagram { readonly kind: ExternalFamilyId readonly source: SourceMap readonly body: { readonly kind: 'preserved' readonly representation: 'opaque' | 'unknown' readonly source: string readonly preservation: SourcePreservationReceipt readonly spans: PreservedSourceSpans readonly diagnostic: { readonly code: 'UNSUPPORTED_FAMILY' | 'UNKNOWN_HEADER' | 'FAMILY_DESCRIPTOR_MISMATCH' readonly message: string readonly help: string } } } type ParsedDiagram = ValidDiagram | ExtensionValidDiagram | PreservedValidDiagram type RenderedRegionKind='node'|'edge'|'label'|'canvas'|'group'|'cluster'|'lane'|'band'|'compartment'|'plot'|'ring' type DiagramActionSecurity='safe'|'unsafe'|'source-only'|'unsupported' interface RenderedRegion { id:string;kind:RenderedRegionKind;elementId?:string;parentId?:string;bounds:{x:number;y:number;w:number;h:number};sourceLine?:number } interface DiagramActionRecord { id?:string;regionId?:string;family:DiagramKind;target:string;action:'href'|'call'|'callback';raw:string;line?:number;href?:string;security:DiagramActionSecurity;executable:false;message?:string } interface RenderedLayout { version: 1; kind: DiagramKind | ExternalFamilyId; bounds: { w: number; h: number }; nodes: unknown[]; edges: unknown[]; groups: unknown[]; regions?: RenderedRegion[]; actions?: DiagramActionRecord[] } interface VerifyResult { ok: boolean; warnings: unknown[]; layout: RenderedLayout } type CheckMermaidSpec = string[] | { include?: string[]; exclude?: string[]; exact?: boolean } interface CheckMermaidResult { ok: boolean; missing: string[]; unexpected: string[]; facts: string[] } type MermaidConfigScalar = string | number | boolean | null type MermaidConfigValue = MermaidConfigScalar | MermaidConfigValue[] | { [key: string]: MermaidConfigValue | undefined } type MermaidRuntimeConfig = { [key: string]: MermaidConfigValue | undefined } interface StyleColors {bg?:string;fg?:string;line?:string;accent?:string;muted?:string;surface?:string;border?:string} type SceneStyleRole="node"|"edge"|"edge-label"|"group"|"group-header"|"label"|"actor"|"lifeline"|"activation"|"message"|"block"|"note"|"class-box"|"member"|"entity"|"attribute"|"relationship"|"cardinality"|"pie-slice"|"legend"|"bar"|"series"|"point"|"axis"|"grid"|"plate"|"section"|"task"|"milestone"|"marker-line"|"rail"|"period"|"event"|"score"|"actor-pill"|"service"|"junction"|"icon"|"title"|"defs"|"prelude"|"chrome" type ExactSceneStyleRole="node"|"edge"|"group"|"group-header"|"label"|"actor"|"relationship"|"pie-slice"|"legend"|"bar"|"series"|"point"|"task"|"milestone" type BindableSceneStyleRole="group-header"|"actor"|"relationship"|"pie-slice"|"legend"|"bar"|"series"|"point"|"task"|"milestone" type RoleStyleSpec={"fontFamily"?:string;"fontSize"?:number;"fontWeight"?:number;"letterSpacing"?:number;"textTransform"?:"uppercase"|"lowercase"|"capitalize";"textColor"?:string;"paddingX"?:number;"paddingY"?:number;"cornerRadius"?:number;"lineWidth"?:number;"bendRadius"?:number;"fillColor"?:string;"borderColor"?:string;"strokeColor"?:string;"headerFillColor"?:string;"cue"?:"none"|"outline"|"double-line"|"pattern"} type RoleStyleFor<R extends ExactSceneStyleRole>=R extends "node"|"actor"?Pick<RoleStyleSpec,"borderColor"|"cornerRadius"|"fillColor"|"fontSize"|"fontWeight"|"letterSpacing"|"lineWidth"|"paddingX"|"paddingY"|"textColor"|"textTransform">:R extends "edge"|"relationship"?Pick<RoleStyleSpec,"bendRadius"|"fontSize"|"fontWeight"|"letterSpacing"|"lineWidth"|"strokeColor"|"textColor"|"textTransform">:R extends "group"?Pick<RoleStyleSpec,"borderColor"|"cornerRadius"|"fillColor"|"fontFamily"|"fontSize"|"fontWeight"|"headerFillColor"|"letterSpacing"|"lineWidth"|"paddingX"|"paddingY"|"textColor"|"textTransform">:R extends "group-header"?Pick<RoleStyleSpec,"borderColor"|"cue"|"fillColor"|"fontFamily"|"fontSize"|"fontWeight"|"letterSpacing"|"lineWidth"|"strokeColor"|"textColor"|"textTransform">:R extends "label"?Pick<RoleStyleSpec,"fontSize"|"fontWeight"|"letterSpacing"|"textColor"|"textTransform">:R extends "pie-slice"|"task"|"milestone"?Pick<RoleStyleSpec,"borderColor"|"cue"|"fillColor"|"lineWidth"|"strokeColor">:R extends "legend"?Pick<RoleStyleSpec,"borderColor"|"fillColor"|"lineWidth"|"strokeColor"|"textColor">:R extends "bar"|"point"?Pick<RoleStyleSpec,"borderColor"|"fillColor"|"lineWidth"|"strokeColor">:R extends "series"?Pick<RoleStyleSpec,"borderColor"|"lineWidth"|"strokeColor">:never type RoleStyles={[R in ExactSceneStyleRole]?:Readonly<RoleStyleFor<R>>} type SemanticBindingChannel="category" interface SemanticBinding {channel:SemanticBindingChannel;value:string;slot:string;role?:BindableSceneStyleRole} type BrandConstraint={kind:"contrast";action:'warn'|'error';role?:SceneStyleRole;minimum?:number}|{kind:"accent-area";action:'warn'|'error';maxFraction:number}|{kind:"mono-role";action:'warn'|'error';role:SceneStyleRole} interface StyleSpec {"formatVersion"?:1;"$schema"?:string;"name"?:string;"blurb"?:string;"colors"?:StyleColors;"font"?:string;"roles"?:RoleStyles;"semanticSlots"?:Readonly<Record<string,Readonly<RoleStyleSpec>>>;"bindings"?:readonly SemanticBinding[];"constraints"?:readonly BrandConstraint[];"stroke"?:"crisp"|"jittered"|"freehand";"roughness"?:number;"bowing"?:number;"passes"?:number;"strokeWidth"?:number;"fill"?:"none"|"hachure"|"solid"|"wash";"hachureAngle"?:number;"hachureGap"?:number;"fillWeight"?:number;"washOpacity"?:number;"washEdge"?:number;"backdrop"?:"plain"|"paper-ruled"|"grid";"intent"?:"premium"|"draft"|"lofi";"mono"?:boolean} type StyleInput=string|StyleSpec type ArchitectureVisualOverrides = Readonly<Record<string, unknown>> interface SharedRenderOptions { bg?:string;fg?:string;line?:string;accent?:string;muted?:string;surface?:string;border?:string;font?:string;style?:StyleInput | StyleInput[];padding?:number;nodeSpacing?:number;layerSpacing?:number;wrappingWidth?:number;componentSpacing?:number;transparent?:boolean;interactive?:boolean;shadow?:boolean;class?:{ hierarchicalNamespaces?:boolean };architecture?:{ visual?:ArchitectureVisualOverrides };timeline?:{ maxWidth?:number };journey?:{ experienceCurve?:boolean };gantt?:{ dependencyArrows?:boolean; criticalPath?:boolean };mermaidConfig?:MermaidRuntimeConfig;embedFontImport?:boolean;compact?:boolean;idPrefix?:string;security?:'default' | 'strict';ganttToday?:string;seed?:number;} interface ConfigDiagnostic { code: 'INEFFECTIVE_CONFIG'; field: string; message: string } interface TerminalProjectionDiagnostic { code: string; feature: string; message: string } interface SvgRenderOptions extends SharedRenderOptions { onConfigDiagnostic?:(diagnostic: ConfigDiagnostic) => void;} interface AsciiRenderOptions extends SharedRenderOptions { useAscii?:boolean;paddingX?:number;paddingY?:number;boxBorderPadding?:number;colorMode?:'auto' | 'none' | 'ansi16' | 'ansi256' | 'truecolor' | 'html';theme?:{ fg?:string; border?:string; line?:string; arrow?:string; accent?:string; bg?:string; corner?:string; junction?:string };maxWidth?:number;targetWidth?:number;onConfigDiagnostic?:(diagnostic: ConfigDiagnostic) => void;onProjectionDiagnostic?:(diagnostic: TerminalProjectionDiagnostic) => void;} interface LayoutRenderOptions extends SharedRenderOptions { debug?:boolean;regions?:boolean;actions?:boolean;onConfigDiagnostic?:(diagnostic: ConfigDiagnostic) => void;} interface RenderArtifactDiagnostic { code: string; message?: string; reference?: string; feature?: string; input?: string; canonicalId?: string; removal?: { release: string; date: string } } interface CapabilityResolution { readonly id: `${string}:${string}`; readonly range: string; readonly level: 'required' | 'preferred' | 'optional'; readonly status: 'selected' | 'unsupported' | 'incompatible'; readonly version?: string } interface CapabilityDecision { readonly version: 1; readonly accepted: boolean; readonly resolutions: readonly CapabilityResolution[] } interface RenderExecutionDecision { readonly family: { readonly id: string; readonly version: string };readonly backend: { readonly mode: 'scene'; readonly requestedId: string; readonly selectedId: string; readonly version: string; readonly hostPolicy: boolean } | { readonly mode: 'family-svg' };readonly digest: string;} interface RenderRequestReceipt { version: 2; output: 'svg' | 'png' | 'ascii' | 'unicode' | 'html' | 'layout'; sharedRequestDigest: string; requestDigest: string; appearanceDigest: string; capabilityDecision: CapabilityDecision; diagnostics?: readonly RenderArtifactDiagnostic[]; graphicalProjectionDigest?: string; executionDecision?: RenderExecutionDecision } interface RenderedSvg { svg: string; receipt: RenderRequestReceipt } interface RenderedAscii { text: string; receipt: RenderRequestReceipt; terminalStyle: Record<string, unknown>; outputPolicy: Record<string, unknown> } interface RenderedLayoutArtifact { layout: VerifyResult['layout']; receipt: RenderRequestReceipt } declare const mermaid: { parseRegisteredMermaid(source: string): Result<ParsedDiagram, ParseError[]> createMermaid(kind: DiagramKind, opts?: { direction?: 'TD' | 'TB' | 'LR' | 'BT' | 'RL' }): ValidDiagram buildMermaid(kind: DiagramKind, ops: MutationOp[], opts?: { direction?: 'TD' | 'TB' | 'LR' | 'BT' | 'RL' }): Result<ValidDiagram, { code: string; message: string; opIndex: number }> asFlowchart(diagram: ValidDiagram): ValidDiagram | null asState(diagram: ValidDiagram): ValidDiagram | null asSequence(diagram: ValidDiagram): ValidDiagram | null asTimeline(diagram: ValidDiagram): ValidDiagram | null asClass(diagram: ValidDiagram): ValidDiagram | null asEr(diagram: ValidDiagram): ValidDiagram | null asJourney(diagram: ValidDiagram): ValidDiagram | null asArchitecture(diagram: ValidDiagram): ValidDiagram | null asXyChart(diagram: ValidDiagram): ValidDiagram | null asPie(diagram: ValidDiagram): ValidDiagram | null asQuadrant(diagram: ValidDiagram): ValidDiagram | null asGantt(diagram: ValidDiagram): ValidDiagram | null asMindmap(diagram: ValidDiagram): ValidDiagram | null asGitGraph(diagram: ValidDiagram): ValidDiagram | null asRadar(diagram: ValidDiagram): ValidDiagram | null mutate(diagram: ValidDiagram, op: MutationOp): Result<ValidDiagram> verifyMermaid(input: ParsedDiagram | string, opts?: { suppress?: string[]; labelCharCap?: number; renderOptions?: SharedRenderOptions }): VerifyResult analyzeMermaid(diagram: ValidDiagram): Record<string, unknown> analyzeMermaidSource(source: string): Result<Record<string, unknown>> describeMermaidFacts(diagram: ValidDiagram): string[] describeMermaidFactsSource(source: string): Result<string[]> checkMermaid(diagram: ValidDiagram, spec: CheckMermaidSpec): CheckMermaidResult checkMermaidSource(source: string, spec: CheckMermaidSpec): Result<CheckMermaidResult> serializeMermaid(diagram: ParsedDiagram): string renderMermaidSVG(input: ParsedDiagram | string, opts?: SvgRenderOptions): string renderMermaidSVGWithReceipt(input: ParsedDiagram | string, opts?: SvgRenderOptions): RenderedSvg renderMermaidASCII(input: ParsedDiagram | string, opts?: AsciiRenderOptions): string renderMermaidASCIIWithReceipt(input: ParsedDiagram | string, opts?: AsciiRenderOptions): RenderedAscii layoutMermaidWithReceipt(input: ParsedDiagram | string, opts?: LayoutRenderOptions): RenderedLayoutArtifact describeOps(family: DiagramKind): Record<string, { name: string; required: boolean; type: string; note?: string }[]> opSignatures(family: DiagramKind): string[] }

  Parameters:

  • code (required) — string — JavaScript to execute; mermaid.* SDK is global.
  • timeoutMs — integer — Optional CPU-time budget (default 5000ms, max 30000ms).

  Hints: read-only yes · destructive no · idempotent no · open-world no

• describe_sdk read-only

  Return version-matched mutation operations for one diagram family. Use detail=signatures for the compact op menu or detail=fields (default) for exact field types, required flags, enum values, defaults, and constraints. Call this before build, mutate, or execute when the family schema is not already known.

  Parameters:

  • family (required) — string — Diagram family whose mutation operations are needed.
  • detail — string — signatures for a compact menu; fields for the complete schema (default).

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• render_svg read-only

  Render a Mermaid source string to themeable SVG. Returns { ok, svg }. Layout is deterministic: identical input produces identical geometry. The hosted boundary forces security:'strict' and embedFontImport:false.

  Parameters:

  • source (required) — string — Mermaid source.
  • options — object — Shared advanced RenderOptions object. Styles accept a registered Look (crisp, hand-drawn, excalidraw, pen-and-ink, freehand, watercolor, blueprint, look:tufte, accessible-high-contrast, patent-drawing, status-dashboard, ops-schematic, chalkboard, risograph, architectural-plan, publication-figure), Palette (paper, dusk, zinc-light, zinc-dark, tokyo-night, tokyo-night-storm, tokyo-night-light, catppuccin-mocha, catppuccin-latte, nord, nord-light, dracula, github-light, github-dark, solarized-light, solarized-dark, one-dark, salmon, salmon-dark, tufte-dark), inline record, or left-to-right stack.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• render_ascii read-only

  Render a Mermaid source string to text. Returns { ok, text }. useAscii true → plain ASCII (+,-,|); false/absent → Unicode box drawing (┌,─,│). targetWidth sets a hard terminal display-cell bound; impossible bounds return a typed error.

  Parameters:

  • source (required) — string — Mermaid source.
  • options — object — Shared advanced RenderOptions object, including style/palette/config/security.
  • useAscii — boolean — true = ASCII characters, false = Unicode (default).
  • targetWidth — integer — Hard maximum line width in terminal display cells.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• render_png read-only

  Rasterize a Mermaid source string to PNG. Returns { ok, png_base64 }. Hosted rendering uses resvg-wasm with bundled fonts; bytes may differ from the local napi renderer, so hosted PNG is a convenience surface, not part of the byte-determinism contract. For file/URL artifacts use the local stdio server.

  Parameters:

  • source (required) — string — Mermaid source.
  • fitTo — object — Exactly one output width or height constraint.
  • scale — number — Positive output scale used when no fitTo constraint is supplied.
  • options — object — Shared advanced RenderOptions object.
  • background — string — Portable basic color or hex color painted behind the raster artifact.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• verify read-only

  Parse and verify a Mermaid diagram without rendering it. Returns { ok, family, summary, warnings, layout: { bounds, nodes, edges } } for valid diagrams and { ok: false, errors } for parse failures. `family` is the detected diagram family and `summary` a one-line description — check them: ok:true only means the diagram is structurally valid, not that it is the kind you intended. Warnings use the layout-rubric codes.

  Parameters:

  • source (required) — string — Mermaid source.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• describe read-only

  Describe a Mermaid diagram. format=text returns { ok, text } with one or two summary sentences; format=json returns { ok, tree } with the AX tree; format=facts returns { ok, facts } with deterministic semantic fact lines for machine checking (for example edge A -> B : label, member Duck +quack()).

  Parameters:

  • source (required) — string — Mermaid source.
  • format — string — text (default), json AX tree, or facts semantic read-back.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• mutate read-only

  Apply a list of structured edit ops to an existing Mermaid `source` and return the edited diagram. This is the declarative counterpart to `execute`: plain JSON in, plain JSON out, no sandbox. Prefer it for straightforward edits; reserve `execute` for logic the ops don't express. Returns { ok, family, source, verify:{ ok, warnings } } on success, or { ok:false, family, opIndex, error } — where `error` names the offending field and lists the valid ones — when an op is malformed or cannot apply. Ops apply in order and are all-or-nothing: the first failing op stops the batch (its position is `opIndex`) and the input is left untouched. Each op is { "kind": <op>, …fields }. Call `describe_sdk` for the detected family before authoring unfamiliar ops; it returns compact signatures or exact field types, enum values, defaults, and constraints.

  Parameters:

  • source (required) — string — Mermaid source to edit.
  • ops (required) — array — Non-empty ordered list of edit ops; each is { kind, ...fields }.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

• build read-only

  Author a new Mermaid diagram from blank by folding a list of structured ops over an empty diagram of `family`. The declarative counterpart to hand-writing source. Returns the same envelope as `mutate`: { ok, family, source, verify } or { ok:false, family, opIndex, error }. Call `describe_sdk` for the family before authoring unfamiliar ops.

  Parameters:

  • family (required) — string — Diagram family to author (one of: flowchart, state, sequence, timeline, class, er, journey, architecture, xychart, pie, quadrant, gantt, mindmap, gitgraph, radar).
  • ops (required) — array — Non-empty ordered list of ops; each is { kind, ...fields }.

  Hints: read-only yes · destructive no · idempotent yes · open-world no

Publisher website Repository

Measured by MCPYP probing. Untested fields are omitted, never estimated. Listing is always free; MCPYP never proxies calls or stores user tokens.