markdown-viewer/skills

Opinionated skills for AI coding agents to create stunning diagrams and visualizations directly in Markdown. These skills extend agent capabilities across diagram generation, data visualization, and technical documentation.

What it solves

This project provides a set of specialized instructions (skills) that enable AI coding agents to generate professional diagrams, data visualizations, and technical documentation directly within Markdown. It bridges the gap between an agent's ability to write text and its ability to create complex visual representations like cloud architecture, UML diagrams, and data charts.

How it works

The project defines 14 distinct skills following the Agent Skills format. Each skill consists of a SKILL.md file containing YAML frontmatter, syntax rules, and templates. When an AI agent (such as Claude Code, Cursor, or GitHub Copilot) uses these skills, it follows the specific instructions to output the correct code fences (e.g., ```vega-lite or ```plantuml) or raw HTML/CSS. These outputs are then rendered into visuals by a compatible Markdown viewer extension.

Who it’s for

  • AI Agent Users: Developers and architects who use AI coding agents to document their systems.
  • AI Agent Developers: Those looking to integrate standardized visual capabilities into their LLM-based workflows.
  • Technical Writers: People who want to AI-generated diagrams and infographics that are consistent and professional.

Highlights

  • Broad Visual Range: Supports everything from software modeling (UML) and cloud infrastructure (AWS/Azure/GCP) to data analytics pipelines and IoT sensor networks.
  • Multiple Rendering Engines: Integrates with Vega-Lite, PlantUML, JSON Canvas, and direct HTML/CSS.
  • Agent-Compatible: Designed for easy installation into popular agents like Claude Code and VS Code.
  • Extensive Icon Libraries: Includes access to thousands of mxgraph stencil icons for professional-grade architecture diagrams.

Related

  • Project
    kangarooking/kangarooking-skills

    A collection of structured, open-source Agent Skills and workflows for AI agents to automate tasks ranging from content creation and 3D generation to complex software engineering.

  • Project
    breaking-brake/cc-wf-studio

    A visual workflow designer for AI agents that allows users to create orchestrations on a canvas and export them as Markdown skills for tools like Claude Code and Cursor.

  • Project
    coreyhaines31/marketingskills

    A collection of AI agent skills that provide specialized marketing knowledge and workflows for tasks like SEO, copywriting, and conversion optimization.

  • Project
    vibe-motion/skills

    A collection of modular animation and rendering skills for AI agents to generate professional motion graphics, 3D effects, and promotional videos programmatically.

  • Project
    msitarzewski/agency-agents

    A comprehensive library of specialized AI agent personalities and installation tools to transform generic LLMs into domain-specific experts across engineering, design, and marketing.