{"product_id":"ai-agent-skill-create-45-types-of-editorial-diagrams","title":"AI Agent Skill: Create 45 Types of Editorial Diagrams","description":"\u003ch3\u003eAI Agent Skill: Create 45 Types of Editorial Diagrams\u003c\/h3\u003e\n\n\u003cp\u003eThis AI Agent Skill allows users to create animated, explorable editorial diagrams across 45 different types. These diagrams can be generated as standalone HTML from a concise JSON specification.\u003c\/p\u003e\n\n\u003ch3\u003eWhat this skill does\u003c\/h3\u003e\n\u003cp\u003eThe skill enables users to:\u003c\/p\u003e\n\u003cul\u003e\n    \u003cli\u003eCreate diagrams such as architecture, flowcharts, sequence charts, state diagrams, ER diagrams, database schemas, UML class diagrams, swimlane diagrams, timelines, Gantt charts, journey maps, decision trees, organization charts, nested diagrams, Venn diagrams, quadrant charts, fishbone diagrams, Wardley maps, bar charts, line charts, scatter plots, Sankey diagrams, treemaps, heatmaps, 3D isometric objects, floor plans, and exploded views.\u003c\/li\u003e\n    \u003cli\u003eConstruct these diagrams from a short JSON specification that drives layout, styling, motion, checks, and exports.\u003c\/li\u003e\n    \u003cli\u003eExport diagrams in various formats such as PNG, JPEG, SVG, GIF, and MP4.\u003c\/li\u003e\n    \u003cli\u003eConvert input from formats like Mermaid, Graphviz\/DOT, PlantUML, D2, draw.io, Excalidraw, SQL, or CSV into clean, visual diagrams.\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003eWho it is for\u003c\/h3\u003e\n\u003cp\u003eThis skill is suited for developers and teams utilizing AI coding agents like Claude Code, Cursor, and Codex. It is ideal for those involved in creating visual representations of systems, codebases, workflows, process maps, API sequences, hierarchies, data models, or physical objects.\u003c\/p\u003e\n\n\u003ch3\u003eUse cases\u003c\/h3\u003e\n\u003cul\u003e\n    \u003cli\u003eVisualizing complex system architectures and workflows.\u003c\/li\u003e\n    \u003cli\u003eConverting source diagrams or data sets into enhanced visual formats.\u003c\/li\u003e\n    \u003cli\u003eCreating diagrams for reports, presentations, and technical documentation.\u003c\/li\u003e\n    \u003cli\u003ePlanning projects, resources, and budgets with timelines, Gantt charts, and other visualization tools.\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003eTechnical details\u003c\/h3\u003e\n\u003cp\u003eThis skill utilizes the SeeCode tool, specifically through commands executed via `node \/scripts\/seecode.mjs`. Users write a compact JSON spec; the system handles all complex aspects of diagram creation. Configuration settings allow for alterations on a global or project scale, supporting default or custom branding.\u003c\/p\u003e\n\u003c!-- mcpcart:static-blocks:start --\u003e\n\u003chr\u003e\n\u003ch3\u003eSource \u0026amp; Licence\u003c\/h3\u003e\n\u003cp\u003eThis package is built on open-source work published by \u003cstrong\u003eAryanutkarsh\u003c\/strong\u003e (\u003ca href=\"https:\/\/github.com\/Aryanutkarsh\/SeeCode\" rel=\"nofollow noopener\" target=\"_blank\"\u003eAryanutkarsh\/SeeCode\u003c\/a\u003e) and distributed under \u003cstrong\u003eMIT\u003c\/strong\u003e. The original licence text and copyright notice are included in your download.\u003c\/p\u003e\n\u003cp\u003ePersonal and commercial use, modification and redistribution are permitted, provided the original copyright and licence notice are retained.\u003c\/p\u003e\n\u003cp\u003eYour purchase covers curation, licence verification, packaging, documentation and instant delivery. It does not grant exclusive rights to the underlying open-source code, which remains available under its original licence.\u003c\/p\u003e\n\u003ch3\u003eDelivery \u0026amp; Support\u003c\/h3\u003e\n\u003cul\u003e\n\u003cli\u003e\n\u003cstrong\u003eDelivery:\u003c\/strong\u003e instant — a secure download link is emailed to you as soon as payment is confirmed.\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eFormat:\u003c\/strong\u003e ZIP archive containing the skill files, documentation and the original licence.\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eSupport:\u003c\/strong\u003e \u003ca href=\"mailto:support@mcpcart.com\"\u003esupport@mcpcart.com\u003c\/a\u003e — we aim to reply within 2 business days.\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eUpdates:\u003c\/strong\u003e updates are included only where stated on this page.\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003ch3\u003eRefunds\u003c\/h3\u003e\n\u003cp\u003eThis is a digital product delivered immediately after purchase. By completing your order you request immediate delivery and acknowledge that, once the download has been accessed, the statutory right to cancel no longer applies to the extent permitted by law. Refund requests are handled in accordance with our published Refund Policy.\u003c\/p\u003e\n\u003cp style=\"font-size:0.85em;color:#666;\"\u003eClaude, Codex, Gemini and Cursor are trademarks of their respective owners. MCP Cart is an independent marketplace and is not affiliated with, endorsed by, or sponsored by any of them. Compatibility references describe interoperability only.\u003c\/p\u003e\n\u003c!-- mcpcart:static-blocks:end --\u003e","brand":"MCP Cart","offers":[{"title":"Default Title","offer_id":53127708475703,"sku":"MCP-ARYANUTKARSH-SEECODE-SEECODE","price":31.99,"currency_code":"GBP","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0981\/3950\/4951\/files\/fx9gHHtc6amp4OJwlJ2Ux_3f4c934a52df43b28b8e18be47d9f9d0.jpg?v=1791543698","url":"https:\/\/mcpcart.com\/products\/ai-agent-skill-create-45-types-of-editorial-diagrams","provider":"SPF PRO","version":"1.0","type":"link"}