skillfed

moai-domain-svg-infographic

Build static technical diagrams—architecture, flows, hierarchies—where layout is determined by arithmetic rather than manual positioning, then render to both hand-editable SVG and high-resolution PNG. Designed for slides, email, and offline use, with native support for Korean, Japanese, and Chinese text that wraps at exact, verified widths.

moai-domain-svg-infographic creates static technical diagrams with numerically computed layout and native CJK text support, rendering to both editable SVG and 2x PNG.

AI-generated summary based on this skill's SKILL.md

1,143 211 Apache-2.0 updated by modu-ai

Install

modu-ai/moai-adk/moai-domain-svg-infographic · repository language: Go

CLI (skillfed)coming soon
git clone https://github.com/modu-ai/moai-adk
cp -r moai-adk/.claude/skills/moai-domain-svg-infographic ~/.claude/skills/moai-domain-svg-infographic

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

How do I create SVG diagram for architecture slides with moai-domain-svg-infographic?

moai-domain-svg-infographic builds static technical diagrams where layout is computed arithmetically rather than manually positioned. You define your architecture structure, text, and spacing rules; the tool calculates exact coordinates, renders to hand-editable SVG, and exports high-resolution 2x PNG ready for slides. This ensures pixel-perfect geometry and consistent spacing across all diagram elements.

What makes moai-domain-svg-infographic's PNG export suitable for presentations?

moai-domain-svg-infographic renders diagrams through headless Chromium to produce verified, high-quality 2x PNG files optimized for slides and offline use. The 2x resolution ensures crisp display on modern screens, while deterministic rendering guarantees that every export matches your SVG source exactly—no manual tweaking needed between formats.

Does moai-domain-svg-infographic support CJK font support diagram generator needs?

Yes. moai-domain-svg-infographic includes native support for Korean, Japanese, and Chinese text with precise wrapping at verified widths. Text positioning is deterministic and exact, so CJK characters flow correctly within your architecture diagrams, flow charts, and comparison matrices without manual adjustment.

Can moai-domain-svg-infographic validate and render SVG source code?

moai-domain-svg-infographic validates SVG source through headless Chromium verification before rendering. This catches layout errors and font issues early, ensuring your hand-editable SVG is both correct and reproducible. You can then convert the validated SVG to PNG or edit it further with confidence.

What diagram types can moai-domain-svg-infographic build with computed layout?

moai-domain-svg-infographic excels at pixel-perfect architecture diagrams, flow charts, hierarchy trees, and comparison matrices. Its computed-layout engine handles precise text positioning, exact spacing, and deterministic geometry—ideal for technical infographics where manual positioning would be error-prone or time-consuming.

Is moai-domain-svg-infographic a mermaid alternative for custom diagrams?

moai-domain-svg-infographic routes diagram requests intelligently: use it for custom, pixel-perfect technical diagrams where you need exact control over layout and CJK text. For simpler flowcharts, mermaid may be faster. moai-domain-svg-infographic shines when deterministic geometry and offline PNG export are essential.

SKILL.md

rendered from the published skill — quoted content, verbatim

SVG Technical Infographic

Produce a hand-editable SVG

(truncated - see the full file via the links below)

Read as markdown · JSON record · Browse the source repository

File tree — 6 files
.claude/skills/moai-domain-svg-infographic/SKILL.md
.claude/skills/moai-domain-svg-infographic/references/archetypes.md
.claude/skills/moai-domain-svg-infographic/references/authoring.md
.claude/skills/moai-domain-svg-infographic/references/sketch.md
.claude/skills/moai-domain-svg-infographic/scripts/check-svg.mjs
.claude/skills/moai-domain-svg-infographic/scripts/render.mjs

Related skills

Tags

layout-computation cjk-typography pixel-precision static-rendering diagram-validation headless-browser multi-language-support architecture-visualization source-linting