{"enrichment":{"faq":[{"a":"mermaid-graph-renderer supports SVG export through multiple paths. For web pages, use client-side rendering with lazy loading to defer diagram processing until needed. For CLI workflows, mermaid-cli provides direct SVG output. For CI/CD pipelines, the native Rust renderer handles high-volume batch conversion to SVG with optimized performance.","q":"How do I render mermaid diagrams to SVG?"},{"a":"mermaid-graph-renderer offers PNG export via mermaid-cli for small batches, Puppeteer for headless browser rendering, or Kroki for multi-format output including PNG. Choose based on your context: CLI for one-off conversions, Puppeteer for web automation, or Kroki when you need simultaneous PNG and other formats from the same diagram source.","q":"What are the best ways to export mermaid to PNG?"},{"a":"mermaid-graph-renderer recommends lazy loading mermaid.js to defer rendering until diagrams enter the viewport, reducing initial page load time. Consider server-side rendering trade-offs for static sites, or split large diagrams into smaller components. Theme customization and rendering options tuning also improve perceived performance.","q":"How can I optimize mermaid diagram performance on web pages?"},{"a":"mermaid-graph-renderer helps you choose: use lazy-loaded client-side rendering for documentation sites, mermaid-cli for small batches, the native Rust renderer for high-volume CI/CD pipelines, or Kroki when you need multi-format output. Each balances performance, ease of setup, and scalability differently.","q":"What's the best tool to render mermaid diagrams for my use case?"},{"a":"mermaid-graph-renderer supports automated diagram generation via mermaid-cli in Docker containers or the native Rust renderer for batch processing. Define pipeline stages to convert diagram source files to SVG/PNG/PDF on commit, store artifacts, and deploy. This approach ensures diagrams stay synchronized with documentation.","q":"How do I set up a mermaid diagram CI/CD pipeline?"},{"a":"Yes, mermaid-graph-renderer exports to PDF through mermaid-cli with Puppeteer backend or via Kroki's multi-format rendering. PDF export works well for static documentation, reports, and archival. Choose mermaid-cli for simplicity or Kroki when combining PDF with other formats in a single workflow.","q":"Can mermaid-graph-renderer convert mermaid to PDF?"}],"shadow_tags":["diagram-export","svg-generation","batch-processing","performance-optimization","ci-cd-automation","headless-rendering","format-conversion","rust-native","web-optimization"],"summary_rewrite":"Convert Mermaid diagrams to production-ready SVG, PNG, or PDF across web and offline contexts. Choose lazy-loaded client-side rendering for documentation sites, mermaid-cli for small batches, or the native Rust renderer for high-volume CI/CD pipelines. Handles performance optimization, theme customization, and multi-format output."},"files":[{"bytes":10092,"path":".claude/skills/mermaid-graph-renderer/SKILL.md","sha256":"9a03b2c66919b4106634b6969c0bebf47b3712ff48fc67b44e4e786e1e5fb8cb","url":"https://skillfed.io/files/curiositech/some_claude_skills/mermaid-graph-renderer/487cffd2/SKILL.md"}],"id":"curiositech/some_claude_skills/mermaid-graph-renderer","links":{"html":"https://skillfed.io/curiositech/some_claude_skills/mermaid-graph-renderer","md":"https://skillfed.io/curiositech/some_claude_skills/mermaid-graph-renderer.md","repo":"https://github.com/curiositech/some_claude_skills"},"meta":{"agents_supported":["claude-code"],"first_seen":"2026-07-28","forks":27,"language":"TypeScript","last_updated":"2026-07-14","license":"MIT","name":"mermaid-graph-renderer","publisher":"curiositech","stars":164},"relations":{"similar":[{"id":"mrgoonie/claudekit-skills/mermaidjs-v11"},{"id":"Agents365-ai/365-skills/mermaid-skill"},{"id":"spencerpauly/awesome-cursor-skills/exporting-to-png"},{"id":"Mathews-Tom/armory/md-to-pdf"},{"id":"shep-ai/shep/mermaid-diagrams"},{"id":"softaworks/agent-toolkit/mermaid-diagrams"},{"id":"jjmartres/opencode/mermaid-diagrams"},{"id":"pedronauck/skills/mermaid-diagrams"},{"id":"daymade/claude-code-skills/mermaid-tools"},{"id":"nicepkg/ai-workflow/mermaid-tools"}]},"slug":{"owner":"curiositech","repo":"some_claude_skills","skill":"mermaid-graph-renderer"},"version":"487cffd2"}