Render Mermaid diagrams without a browser
Ultra-lightweight, zero-dependency Mermaid rendering engine. Parse, lay out, and render Mermaid diagrams in 30.5KB min+gzip, with no headless browser required.
@crafter/mermaid is a Mermaid rendering engine built from scratch: it parses, lays out, and renders Mermaid diagrams in 30.5KB (min+gzip) with zero dependencies and a synchronous API. No headless browser, no 2MB bundle.
| mermaid.js | @crafter/mermaid | |
|---|---|---|
| Bundle | ~2MB | 30.5KB gzipped |
| Dependencies | 50+ | Zero |
| API | Async | Sync |
Install
bun add @crafter/mermaidQuick start
import { render } from "@crafter/mermaid"
const svg = render(`
graph TD
A[Start] --> B{Decision}
B -->|Yes| C[Success]
B -->|No| D[Failure]
`)
document.getElementById("diagram").innerHTML = svgThe suite
The umbrella package re-exports a set of small, focused packages. Use them individually when you only need one stage of the pipeline:
| Package | Size | What it does |
|---|---|---|
@crafter/mermaid | <1KB | Umbrella package |
@crafter/mermaid-parser | ~8KB | Mermaid text to AST |
@crafter/mermaid-layout | ~14KB | AST to positioned graph |
@crafter/mermaid-renderer | ~17KB | Positioned graph to SVG |
@crafter/mermaid-themes | ~2KB | 30 theme presets |
@crafter/mermaid-cli | <1KB | Terminal renderer |
@crafter/mermaid-player | ~3KB | Step-through animation |
Render from the terminal
npx @crafter/mermaid-cli diagram.mmdLinks
trx: transcribe audio and video from the CLI
Agent-first CLI for audio and video transcription with local Whisper. Download, clean, and transcribe media from URLs or local files with machine-readable output.
neon-cli: Neon usage and billing from the terminal
Agent-friendly CLI for Neon Postgres. Per-project consumption history, billing, and invoice reconciliation in the terminal, with JSON output for agents and CI. The usage data neonctl doesn't expose.