Markdown Viewer Agent Skills
Opinionated skills for AI coding agents to create stunning diagrams and visualizations directly in Markdown.
Evidence shows no documentation of permissions, user confirmation, data flow, or sensitive data handling. The install command `npx skills add` executes external code without explaining its permissions or impact. No dependency security or external effects are mentioned. No rollback mechanism is provided. Source attribution is only via author field in README and contributing guide, but not verified. Hence all trust criteria score 0.
Self-consistency: README's skill list, code fences, and descriptions are consistent, and skill structure is clearly explained, scoring 2. Dependency availability: Relies on external rendering engines (e.g., PlantUML, Vega) but no versions or installation instructions are provided, scoring 1. Failure messages: SKILL.md mentions common pitfalls but lacks specific error handling or recovery steps, scoring 1.
Audience and scenarios: README provides a detailed skill selection guide covering many use cases, scoring 2. Capability boundaries: Clearly lists each skill's functionality and best use, scoring 2. Trigger precision: Provides code fence reference but does not specify trigger conditions or priority, scoring 2. Environment fit: Supports multiple AI agents and editors but does not state system requirements or compatibility limitations, scoring 2.
Information architecture: README is well-structured with navigation and skill tables, scoring 2. Install notes: Provides quick and manual installation steps, scoring 2. Naming stability: Skill names and code fences are consistent, scoring 2. Examples and FAQ: Provides examples and common pitfalls but no FAQ, scoring 2. Known limitations: No explicit limitations listed, scoring 1. License: Clearly GPL-3.0, scoring 2. Versioning and changelog: No version number or changelog, scoring 0. Maintenance responsibility: Contributing guide exists but no clear maintainer or update policy, scoring 1.
Output usability: Skills aim to generate diagrams and visualizations directly embeddable in Markdown, with clear output formats, scoring 2. Marginal value: Provides 14 skills covering many scenarios, offering high value, scoring 2. Cost-benefit: Low installation and usage cost, but reliance on external engines may add complexity, scoring 2.
Claim traceability: Claims in README (e.g., number of skills, template counts) lack sources or verification, scoring 1. Cross-source corroboration: No external validation or test results provided, scoring 1. Fact-inference separation: Descriptions and inferences are mixed without clear distinction, scoring 1.
- The repository provides no security or permission documentation; the install command may execute external code, posing potential risks.
- Relies on external rendering engines without version or installation instructions, which may cause environment inconsistencies.
- No version number or changelog is provided, making it difficult to track updates and compatibility.
- Known limitations are not explicitly listed, so users may encounter unforeseen failures.
What does this agent do, and when should you use it?
Markdown Viewer Agent Skills is a collection of 14 skills that extend AI coding agents' capabilities in diagram generation, data visualization, and technical documentation. The skills follow the Agent Skills format and cover 5 rendering engines: PlantUML, Vega-Lite/Vega, HTML/CSS, JSON Canvas, and YAML. They include PlantUML-based skills for UML, cloud architecture, network topology, security, ArchiMate, BPMN, data analytics, and IoT; standalone skills such as vega (data-driven charts), infographic (70+ templates), and canvas (mind maps); and HTML/CSS-embedded skills like architecture (13 layouts × 12 styles) and infocard (13 layouts × 14 styles). The repository provides a quick install command (`npx skills add markdown-viewer/skills`) and manual installation instructions for Claude Code, claude.ai, and GitHub Copilot/VS Code. It is licensed under GPL-3.0.
The repository provides a catalog of skills, each containing a SKILL.md file with instructions, code fences, templates, layouts, and styles. Skills use specific code fences (e.g., ``vega-lite, `plantuml, `canvas) to trigger rendering. The quick install command npx skills add markdown-viewer/skills installs the skills into AI-compatible agents. For Claude Code, users can manually copy skills to ~/.claude/skills/. For GitHub Copilot/VS Code, skills are placed in .github/skills/` and auto-detected. The skills guide the agent to generate diagrams based on user requirements (e.g., a bar chart using the vega-lite fence) and use the syntax rules in the SKILL.md. Output formats are typically SVG or HTML, embedded in Markdown. The architecture and infocard skills generate raw HTML/CSS without a code fence. The collection also includes a skill selection guide and a hierarchy diagram.
- A software developer uses the
umlskill to create sequence diagrams or state machine diagrams in Markdown for API documentation. - A data scientist uses the
vegaskill to generate interactive data charts, such as scatter plots or heatmaps, in a Jupyter notebook. - An enterprise architect uses the
archimateskill to create ArchiMate layered models representing business, application, and technology layers. - A cloud engineer uses the
cloudskill to draw AWS or Azure architecture diagrams for design reviews or presentations. - A technical writer uses the
infocardskill to craft editorial-style information cards for release notes or data summaries. - A business analyst uses the
bpmnskill to model workflows and business processes, including enterprise integration patterns.
What are this agent's strengths and limitations?
- Comprehensive collection of 14 skills covering a wide range of diagram types, from UML to cloud architecture to infographics.
- Standardized skill format (Agent Skills) easy to install into Claude Code, Codex, Cursor, and others.
- Rich templates and icons (e.g., 9500+ mxgraph stencils) enabling professional-quality diagrams.
- Code fence-driven, enabling direct embedding in Markdown, integrated with the Markdown Viewer extension.
- Licensed under GPL-3.0, which may impose copyleft obligations if integrated into proprietary products.
- Dependency on external rendering engines (PlantUML, Vega-Lite) and the Markdown Viewer extension, which may not be universally available.
- HTML/CSS skills (architecture, infocard) may not render in all Markdown viewers, limiting portability.
- The skills are provided as-is without dedicated support or maintenance guarantees.
How do you install or deploy this agent?
Recommended: run npx skills add markdown-viewer/skills in your project directory. This works with multiple AI coding agents (Claude Code, Codex, Cursor, etc.).
Manual installation:
- For Claude Code: copy the skills/<skill-name> directory to ~/.claude/skills/.
- For claude.ai: add skills to project knowledge or paste SKILL.md contents into the conversation.
- For GitHub Copilot / VS Code: place skills in .github/skills/ directory; they are automatically detected.
Requirements: Node.js (for npx). No other explicit dependencies.
How do you use this agent?
- Identify the diagram type from user requirements (e.g., flowchart, bar chart, cloud architecture).
- Read the corresponding skill's SKILL.md file (e.g.,
skills/uml/SKILL.md) for detailed instructions. - Follow the syntax rules carefully to avoid render failures.
- Use the code fence specified by the skill (e.g., ``
plantuml for UML,`vega-lite for Vega-Lite,`infographic for infographics,``canvas for mind maps). - The agent generates the diagram code, which renders as SVG or HTML, embedded in the Markdown.
How does this agent compare with similar options?
The repository does not explicitly compare to alternatives, but it can be compared to other diagram generation tools like Mermaid or PlantUML itself.