Xpersona

Crawler Summary

beautiful-mermaid answer-first brief

Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code color schemes, (5) Embedding diagrams in documentation or web UIs. Supports SVG output with live theme switching and ASCII/Unicode output for plain text contexts. --- name: beautiful-mermaid description: | Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code c Capability contract not published. No trust telemetry is available yet. 1 GitHub stars reported by the source. Last updated 4/15/2026.

Freshness

Last checked 4/15/2026

Best For

beautiful-mermaid is best for general automation workflows where OpenClaw compatibility matters.

Not Ideal For

Contract metadata is missing or unavailable for deterministic execution.

Evidence Sources Checked

editorial-content, GITHUB OPENCLEW, runtime-metrics, public facts pack

CardFactsSnapshotContractTrust
Claim this agent
Agent DossierGitHubSafety: 94/100

beautiful-mermaid

Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code color schemes, (5) Embedding diagrams in documentation or web UIs. Supports SVG output with live theme switching and ASCII/Unicode output for plain text contexts. --- name: beautiful-mermaid description: | Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code c

OpenClawself-declared

Public facts

5

Change events

1

Artifacts

0

Freshness

Apr 15, 2026

Verifiededitorial-contentNo verified compatibility signals1 GitHub stars

Capability contract not published. No trust telemetry is available yet. 1 GitHub stars reported by the source. Last updated 4/15/2026.

1 GitHub starsTrust evidence available

Trust score

Unknown

Compatibility

OpenClaw

Freshness

Apr 15, 2026

Vendor

Alexmikhalev

Artifacts

0

Benchmarks

0

Last release

Unpublished

Executive Summary

Key links, install path, and a quick operational read before the deeper crawl record.

Verifiededitorial-content

Summary

Capability contract not published. No trust telemetry is available yet. 1 GitHub stars reported by the source. Last updated 4/15/2026.

View Source

Setup snapshot

git clone https://github.com/AlexMikhalev/beautiful-mermaid.git
  1. 1

    Setup complexity is LOW. This package is likely designed for quick installation with minimal external side-effects.

  2. 2

    Final validation: Expose the agent to a mock request payload inside a sandbox and trace the network egress before allowing access to real customer data.

Evidence Ledger

Everything public we have scraped or crawled about this agent, grouped by evidence type with provenance.

Verifiededitorial-content
Vendor (1)

Vendor

Alexmikhalev

profilemedium
Observed Apr 15, 2026Source linkProvenance
Compatibility (1)

Protocol compatibility

OpenClaw

contractmedium
Observed Apr 15, 2026Source linkProvenance
Adoption (1)

Adoption signal

1 GitHub stars

profilemedium
Observed Apr 15, 2026Source linkProvenance
Security (1)

Handshake status

UNKNOWN

trustmedium
Observed unknownSource linkProvenance
Integration (1)

Crawlable docs

6 indexed pages on the official domain

search_documentmedium
Observed Apr 15, 2026Source linkProvenance

Release & Crawl Timeline

Merged public release, docs, artifact, benchmark, pricing, and trust refresh events.

Self-declaredagent-index

Docs Update

Docs refreshed: Sign in to GitHub · GitHub

search_documentmedium

Fresh crawlable documentation was indexed for the official domain.

Observed Apr 15, 2026

Artifacts Archive

Extracted files, examples, snippets, parameters, dependencies, permissions, and artifact metadata.

Self-declaredGITHUB OPENCLEW

Extracted files

0

Examples

6

Snippets

0

Languages

typescript

Parameters

Executable Examples

bash

npm install beautiful-mermaid

bash

bash scripts/setup.sh

typescript

import { renderMermaid } from 'beautiful-mermaid'

const svg = await renderMermaid(`
  graph LR
    A[Start] --> B{Decision}
    B -->|Yes| C[Action]
    B -->|No| D[End]
`)

typescript

import { renderMermaidAscii } from 'beautiful-mermaid'

const ascii = renderMermaidAscii(`graph LR; A --> B --> C`)
// Output:
// +---+     +---+     +---+
// | A |---->| B |---->| C |
// +---+     +---+     +---+

typescript

const svg = await renderMermaid(diagram, {
  bg: '#1a1b26',
  fg: '#a9b1d6'
})

typescript

import { renderMermaid, THEMES } from 'beautiful-mermaid'

const svg = await renderMermaid(diagram, THEMES['tokyo-night'])

Docs & README

Full documentation captured from public sources, including the complete README when available.

Self-declaredGITHUB OPENCLEW

Docs source

GITHUB OPENCLEW

Editorial quality

ready

Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code color schemes, (5) Embedding diagrams in documentation or web UIs. Supports SVG output with live theme switching and ASCII/Unicode output for plain text contexts. --- name: beautiful-mermaid description: | Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code c

Full README

name: beautiful-mermaid description: | Render Mermaid diagrams as SVG or ASCII art using the beautiful-mermaid library. Ultra-fast rendering with 15 built-in themes and Shiki VS Code theme support. Use when: (1) Creating diagrams from Mermaid syntax, (2) Rendering flowcharts, state, sequence, class, or ER diagrams, (3) Generating ASCII diagrams for terminal/markdown output, (4) Theming diagrams to match VS Code color schemes, (5) Embedding diagrams in documentation or web UIs. Supports SVG output with live theme switching and ASCII/Unicode output for plain text contexts. license: MIT compatibility: Requires Node.js 18+ and npm. Works with Claude Code, Cursor, and other skills-compatible agents. metadata: author: alex version: "1.0.0" source: https://github.com/lukilabs/beautiful-mermaid keywords: mermaid diagrams svg ascii flowchart sequence state class er

Beautiful Mermaid Diagram Rendering

Render Mermaid diagrams as SVG (for UIs) or ASCII/Unicode (for terminals and markdown).

Quick Start

1. Install Dependencies

npm install beautiful-mermaid

Or run the setup script:

bash scripts/setup.sh

2. Render SVG

import { renderMermaid } from 'beautiful-mermaid'

const svg = await renderMermaid(`
  graph LR
    A[Start] --> B{Decision}
    B -->|Yes| C[Action]
    B -->|No| D[End]
`)

3. Render ASCII

import { renderMermaidAscii } from 'beautiful-mermaid'

const ascii = renderMermaidAscii(`graph LR; A --> B --> C`)
// Output:
// +---+     +---+     +---+
// | A |---->| B |---->| C |
// +---+     +---+     +---+

Core API

renderMermaid(text, options?): Promise<string>

Returns SVG string. Options:

| Option | Type | Default | Description | |--------|------|---------|-------------| | bg | string | "#FFFFFF" | Background color | | fg | string | "#27272A" | Foreground color | | font | string | "Inter" | Font family | | transparent | boolean | false | Transparent background | | line | string | auto | Edge/connector color | | accent | string | auto | Arrow heads, highlights | | muted | string | auto | Secondary text, labels | | surface | string | auto | Node fill tint | | border | string | auto | Node stroke |

renderMermaidAscii(text, options?): string

Returns ASCII/Unicode string. Synchronous. Options:

| Option | Type | Default | Description | |--------|------|---------|-------------| | useAscii | boolean | false | Use ASCII chars instead of Unicode | | paddingX | number | 5 | Horizontal node spacing | | paddingY | number | 5 | Vertical node spacing | | boxBorderPadding | number | 1 | Inner box padding |

Theming

Mono Mode (Two Colors)

Provide only bg and fg. All other colors are derived automatically:

const svg = await renderMermaid(diagram, {
  bg: '#1a1b26',
  fg: '#a9b1d6'
})

Built-in Themes

import { renderMermaid, THEMES } from 'beautiful-mermaid'

const svg = await renderMermaid(diagram, THEMES['tokyo-night'])

Available themes: 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.

Shiki Theme Integration

import { getSingletonHighlighter } from 'shiki'
import { renderMermaid, fromShikiTheme } from 'beautiful-mermaid'

const highlighter = await getSingletonHighlighter({
  themes: ['vitesse-dark']
})
const colors = fromShikiTheme(highlighter.getTheme('vitesse-dark'))
const svg = await renderMermaid(diagram, colors)

See themes.md for complete theming reference.

Supported Diagrams

| Type | Syntax | Example | |------|--------|---------| | Flowchart | graph TD/LR/BT/RL | graph LR; A --> B | | State | stateDiagram-v2 | stateDiagram-v2\n[*] --> Active | | Sequence | sequenceDiagram | sequenceDiagram\nAlice->>Bob: Hello | | Class | classDiagram | classDiagram\nAnimal <|-- Dog | | ER | erDiagram | erDiagram\nCUSTOMER ||--o{ ORDER : places |

Common Patterns

Save SVG to File

import { renderMermaid, THEMES } from 'beautiful-mermaid'
import { writeFile } from 'fs/promises'

const svg = await renderMermaid(diagram, THEMES['github-dark'])
await writeFile('diagram.svg', svg)

Generate ASCII for Markdown

import { renderMermaidAscii } from 'beautiful-mermaid'

const ascii = renderMermaidAscii(diagram, { useAscii: true })
const markdown = `## Architecture\n\n\`\`\`\n${ascii}\n\`\`\``

Live Theme Switching (Browser)

SVG output uses CSS custom properties. Switch themes without re-rendering:

svgElement.style.setProperty('--bg', '#282a36')
svgElement.style.setProperty('--fg', '#f8f8f2')

Reference Files

| File | Contents | |------|----------| | themes.md | Complete theming guide, color derivation, custom themes | | ascii-rendering.md | ASCII mode options, Unicode vs ASCII, formatting |

Troubleshooting

"Cannot find module 'beautiful-mermaid'": Run npm install beautiful-mermaid

Empty SVG output: Verify Mermaid syntax is valid. Test at mermaid.live first.

Fonts not rendering: Ensure the font is available. Use web-safe fonts or embed font CSS.

Contract & API

Machine endpoints, protocol fit, contract coverage, invocation examples, and guardrails for agent-to-agent use.

MissingGITHUB OPENCLEW

Endpoints

Dossier APISnapshot APIContract APITrust API

Contract coverage

Status

missing

Auth

None

Streaming

No

Data region

Unspecified

Protocol support

OpenClaw: self-declared

Requires: none

Forbidden: none

Guardrails

Operational confidence: low

No positive guardrails captured.
Invocation examples
curl -s "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/snapshot"
curl -s "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/contract"
curl -s "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/trust"

Reliability & Benchmarks

Trust and runtime signals, benchmark suites, failure patterns, and practical risk constraints.

Missingruntime-metrics

Trust signals

Handshake

UNKNOWN

Confidence

unknown

Attempts 30d

unknown

Fallback rate

unknown

Runtime metrics

Observed P50

unknown

Observed P95

unknown

Rate limit

unknown

Estimated cost

unknown

Do not use if

Contract metadata is missing or unavailable for deterministic execution.
No benchmark suites or observed failure patterns are available.

Media & Demo

Every public screenshot, visual asset, demo link, and owner-provided destination tied to this agent.

Missingno-media
No screenshots, media assets, or demo links are available.

Related Agents

Neighboring agents from the same protocol and source ecosystem for comparison and shortlist building.

Self-declaredprotocol-neighbors
GITHUB_REPOSactivepieces

Rank

70

AI Agents & MCPs & AI Workflow Automation • (~400 MCP servers for AI agents) • AI Automation / AI Agent with MCPs • AI Workflows & AI Agents • MCPs for AI Agents

Traction

No public download signal

Freshness

Updated 2d ago

OPENCLAW
GITHUB_REPOScherry-studio

Rank

70

AI productivity studio with smart chat, autonomous agents, and 300+ assistants. Unified access to frontier LLMs

Traction

No public download signal

Freshness

Updated 6d ago

MCPOPENCLAW
GITHUB_REPOSAionUi

Rank

70

Free, local, open-source 24/7 Cowork app and OpenClaw for Gemini CLI, Claude Code, Codex, OpenCode, Qwen Code, Goose CLI, Auggie, and more | 🌟 Star if you like it!

Traction

No public download signal

Freshness

Updated 6d ago

MCPOPENCLAW
GITHUB_REPOSCopilotKit

Rank

70

The Frontend for Agents & Generative UI. React + Angular

Traction

No public download signal

Freshness

Updated 23d ago

OPENCLAW
Agent hubMore from this sourceOpenClaw agents
Machine Appendix

Contract JSON

{
  "contractStatus": "missing",
  "authModes": [],
  "requires": [],
  "forbidden": [],
  "supportsMcp": false,
  "supportsA2a": false,
  "supportsStreaming": false,
  "inputSchemaRef": null,
  "outputSchemaRef": null,
  "dataRegion": null,
  "contractUpdatedAt": null,
  "sourceUpdatedAt": null,
  "freshnessSeconds": null
}

Invocation Guide

{
  "preferredApi": {
    "snapshotUrl": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/snapshot",
    "contractUrl": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/contract",
    "trustUrl": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/trust"
  },
  "curlExamples": [
    "curl -s \"https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/snapshot\"",
    "curl -s \"https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/contract\"",
    "curl -s \"https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/trust\""
  ],
  "jsonRequestTemplate": {
    "query": "summarize this repo",
    "constraints": {
      "maxLatencyMs": 2000,
      "protocolPreference": [
        "OPENCLEW"
      ]
    }
  },
  "jsonResponseTemplate": {
    "ok": true,
    "result": {
      "summary": "...",
      "confidence": 0.9
    },
    "meta": {
      "source": "GITHUB_OPENCLEW",
      "generatedAt": "2026-04-17T05:20:51.694Z"
    }
  },
  "retryPolicy": {
    "maxAttempts": 3,
    "backoffMs": [
      500,
      1500,
      3500
    ],
    "retryableConditions": [
      "HTTP_429",
      "HTTP_503",
      "NETWORK_TIMEOUT"
    ]
  }
}

Trust JSON

{
  "status": "unavailable",
  "handshakeStatus": "UNKNOWN",
  "verificationFreshnessHours": null,
  "reputationScore": null,
  "p95LatencyMs": null,
  "successRate30d": null,
  "fallbackRate": null,
  "attempts30d": null,
  "trustUpdatedAt": null,
  "trustConfidence": "unknown",
  "sourceUpdatedAt": null,
  "freshnessSeconds": null
}

Capability Matrix

{
  "rows": [
    {
      "key": "OPENCLEW",
      "type": "protocol",
      "support": "unknown",
      "confidenceSource": "profile",
      "notes": "Listed on profile"
    }
  ],
  "flattenedTokens": "protocol:OPENCLEW|unknown|profile"
}

Facts JSON

[
  {
    "factKey": "docs_crawl",
    "category": "integration",
    "label": "Crawlable docs",
    "value": "6 indexed pages on the official domain",
    "href": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceUrl": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceType": "search_document",
    "confidence": "medium",
    "observedAt": "2026-04-15T05:03:46.393Z",
    "isPublic": true
  },
  {
    "factKey": "vendor",
    "category": "vendor",
    "label": "Vendor",
    "value": "Alexmikhalev",
    "href": "https://github.com/AlexMikhalev/beautiful-mermaid",
    "sourceUrl": "https://github.com/AlexMikhalev/beautiful-mermaid",
    "sourceType": "profile",
    "confidence": "medium",
    "observedAt": "2026-04-15T03:13:12.100Z",
    "isPublic": true
  },
  {
    "factKey": "protocols",
    "category": "compatibility",
    "label": "Protocol compatibility",
    "value": "OpenClaw",
    "href": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/contract",
    "sourceUrl": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/contract",
    "sourceType": "contract",
    "confidence": "medium",
    "observedAt": "2026-04-15T03:13:12.100Z",
    "isPublic": true
  },
  {
    "factKey": "traction",
    "category": "adoption",
    "label": "Adoption signal",
    "value": "1 GitHub stars",
    "href": "https://github.com/AlexMikhalev/beautiful-mermaid",
    "sourceUrl": "https://github.com/AlexMikhalev/beautiful-mermaid",
    "sourceType": "profile",
    "confidence": "medium",
    "observedAt": "2026-04-15T03:13:12.100Z",
    "isPublic": true
  },
  {
    "factKey": "handshake_status",
    "category": "security",
    "label": "Handshake status",
    "value": "UNKNOWN",
    "href": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/trust",
    "sourceUrl": "https://xpersona.co/api/v1/agents/alexmikhalev-beautiful-mermaid/trust",
    "sourceType": "trust",
    "confidence": "medium",
    "observedAt": null,
    "isPublic": true
  }
]

Change Events JSON

[
  {
    "eventType": "docs_update",
    "title": "Docs refreshed: Sign in to GitHub · GitHub",
    "description": "Fresh crawlable documentation was indexed for the official domain.",
    "href": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceUrl": "https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2Fopenclaw%2Fskills%2Ftree%2Fmain%2Fskills%2Fasleep123%2Fcaldav-calendar",
    "sourceType": "search_document",
    "confidence": "medium",
    "observedAt": "2026-04-15T05:03:46.393Z",
    "isPublic": true
  }
]

Sponsored

Ads related to beautiful-mermaid and adjacent AI workflows.