@tank/markdown-renderer

Name: @tank/markdown-renderer
Availability: InStock
Author: tankpkg

Convert extended markdown into verified HTML and SVG output.

1|1|Updated Feb 20, 2026

Search Tags:#markdown #html #mermaid #sanitization #playwright #graphviz #katex

Ready to run

npx skills add https://github.com/tankpkg/packages --skill tank-markdown-renderer

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: @tank/markdown-renderer
Source: https://github.com/tankpkg/packages/tree/main/skills/markdown-renderer
Command: npx skills add https://github.com/tankpkg/packages --skill tank-markdown-renderer

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @viz-js/viz, katex, mermaid, playwright, rehype-katex, rehype-parse, rehype-raw, rehype-sanitize, rehype-stringify, remark-gfm, remark-math, remark-parse, remark-rehype, unified, unist-util-visit, @playwright/test, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

It removes the complexity of turning extended markdown into safe, accurate, production-ready HTML and SVG when documents mix prose, diagrams, math, and raw markup.

Core Features & Use Cases

Renders CommonMark and GFM content with a unified markdown pipeline.
Supports Mermaid diagrams, KaTeX math, trusted SVG, and controlled custom HTML.
Adds Graphviz and other diagram adapters through fenced-language handling.
Uses sanitization and browser-based verification to keep static exports trustworthy.
Useful for documentation systems, markdown preview engines, technical publishing, and internal tooling that needs consistent client and export output.

Quick Start

Ask the skill to render your markdown document into a safe HTML export with Mermaid, KaTeX, SVG, and Graphviz support.

Frequently Asked Questions about @tank/markdown-renderer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I convert markdown with Mermaid diagrams and KaTeX math into HTML?▼

To convert markdown with Mermaid and KaTeX into HTML, use a unified pipeline that parses CommonMark and GFM, renders diagrams, compiles math, and sanitizes the final output. This ensures mixed documents are accurately transformed into safe HTML.

What is the best way to render Graphviz DOT fences in markdown documents?▼

Rendering Graphviz DOT fences in markdown is best handled by a unified pipeline using viz-js adapters, which parse fenced DOT language blocks and convert them directly into verified SVG output within your final HTML export.

Why does my markdown preview output differ from the exported HTML?▼

Markdown preview and exported HTML differ due to inconsistent rendering environments. Applying real browser-executed rendering via Playwright during compile time ensures both the client preview and static export output remain perfectly consistent.

How do I sanitize custom HTML and trusted SVG in markdown exports?▼

To sanitize custom HTML and trusted SVG in markdown exports, apply a rehype-sanitize step within your unified pipeline. This removes unsafe markup while preserving controlled trusted elements for secure production-ready HTML.

Does markdown to HTML conversion require a browser to render Mermaid diagrams?▼

Markdown to HTML conversion for Mermaid diagrams requires real browser execution via Playwright to verify rendering. This browser-based verification guarantees diagrams are accurately drawn and consistent in static exports.

Can I use GFM and raw HTML in the same markdown to HTML pipeline?▼

Yes, you can process GFM and raw HTML in the same pipeline by using remark-gfm for GitHub Flavored Markdown and rehype-raw for custom markup. A unified pipeline parses these formats together before sanitization.