专业图表生成技能：根据需求自动选择合适的图表类型，生成符合设计规范的 PNG 图表。 覆盖 29 种图表：结构图（流程图、泳道图、时序图、架构图、状态图、ER图、类图、思维导图、甘特图、Kanban、Git Graph 等） 和统计图（柱状图、折线图、饼图、雷达图、热力图、散点图、桑基图、漏斗图、瀑布图、矩形树图、柱线混合图等）。 统一工具：HTML/SVG + 内联 JS 布局计算。ER/类图使用 ELKjs 布局引擎。 所有图表遵循统一的设计规范（配色/字体/组件/间距），风格现代简洁。 支持三种输出：PNG（默认）、HTML（富文档嵌入）、DSL（Mermaid 文本，嵌入 MD 文档）。 触发词：画图、画一个、生成图表、流程图、架构图、时序图、柱状图、对比图、关系图。 即使用户没有说"画图"，只要需求中涉及可视化展示（流程、架构、数据对比、关系），都应触发此技能。 被 deep-research 等其他技能调用时，同样遵循本规范生成图表。
How to install diagram?
312362115/claude/diagram
$npx -y skills add 312362115/claude --skill diagramInstalls into the current project.
›Prefer a prompt? Paste this to your agent
Run `npx skills use "https://github.com/312362115/claude" --skill "312362115/claude/diagram"` and follow the generated skill instructions now. Read its complete output, redirecting it to a temporary file first if necessary. Resolve relative paths from the supporting-files directory it provides.
Use the skills in "https://github.com/312362115/claude" that are relevant to the current task. Run `npx skills add "https://github.com/312362115/claude"` and select the relevant skills, then follow their instructions.
Related
6 picksType
- remotion-best-practicesRouter for all Remotion skillsJul 2026
- ai-image-generationGenerate AI images with GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve and 50+ models via inference.sh CLI.Jul 2026
- hyperframes-cliUse the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes,…Jul 2026
- hyperframesMandatory entry point: read this first for any request to make, create, edit, animate, or render a video, animation, or motion graphic, including a promo,…Jul 2026
- remotion-to-hyperframesPort an existing Remotion (React) composition''s source to HyperFrames HTML.Jul 2026
- hyperframes-coreThe HyperFrames composition contract — build one renderable project.Jul 2026
