How do I install the Markdown Canvas skill?

Run npx skillmds@latest add dvcrn/markdown-canvas in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Markdown Canvas safe to use?

This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. Capability flags: executes scripts, reads secrets. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Markdown Canvas?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Markdown Canvas free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Markdown Canvas?

dvcrn (@dvcrn) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Markdown Canvas by dvcrn — Agent Skill

Name: Markdown Canvas
Rating: 4.2 (5 reviews)
Author: dvcrn

Markdown Canvas

Convert markdown files to beautiful HTML pages suitable for Canvas display or browser viewing. Use when user asks to render, visualize, display, or share markdown files (.md) in a visual format. Triggers include phrases like "render xxx.md", "canvas display xxx.md", "visualize markdown", "make xxx.md pretty", "share xxx.md as HTML".

dvcrn Updated Sep 8, 2026 32 repo stars

File contents

Markdown Canvas Renderer

Convert markdown files into beautiful, shareable HTML pages with zero external dependencies.

Quick Start

When a user wants to render a markdown file:

Run the conversion script:

python3 scripts/convert.py <path/to/file.md>

Open in browser (if no Canvas node available):
```
open <output.html>
```
Or push to Canvas (if node paired):
```
canvas present file://<output.html>
```

Usage Examples

Basic conversion

# Converts ai-landscape-2026.md → ai-landscape-2026.html
python3 scripts/convert.py ai-landscape-2026.md

Custom output path

python3 scripts/convert.py input.md -o /path/to/output.html

Custom page title

python3 scripts/convert.py notes.md -t "My Research Notes"

Supported Markdown Features

The converter handles:

Headers (# through ######)
Bold (**text** or __text__)
Italic (*text* or _text_)
Code blocks (language ... )
Inline code (code)
Links ([text](url))
Lists (unordered: - , * , + )
Horizontal rules (---, ***, ___)

Design Philosophy

Token efficiency: Template is pre-built; only markdown content flows through the context window.

Zero dependencies: Pure Python + self-contained HTML template with embedded CSS.

Progressive enhancement: Works offline, no CDN required, renders instantly.

Workflow

User requests markdown rendering
Run scripts/convert.py on their file
Script reads assets/template.html
Script converts markdown → HTML
Script injects HTML into template
Output saved alongside source (or custom path)
Open in browser OR push to Canvas

Token Cost Analysis

Per conversion:

Read SKILL.md: ~500 tokens (first time only)
Execute script: ~100 tokens
Report result: ~50 tokens

Total: ~650 tokens vs ~8000 tokens for generating full HTML each time.

Output Location

By default, output is saved next to the input file:

notes.md → notes.html
/path/to/doc.md → /path/to/doc.html

Use -o flag to specify custom location.

---name: markdown-canvasdescription: Convert markdown files to beautiful HTML pages suitable for Canvas display or browser viewing. Use when user asks to render, visualize, display, or share markdown files (.md) in a visual format. Triggers include phrases like "render xxx.md", "canvas display xxx.md", "visualize markdown", "make xxx.md pretty", "share xxx.md as HTML".---# Markdown Canvas RendererConvert markdown files into beautiful, shareable HTML pages with zero external dependencies.## Quick StartWhen a user wants to render a markdown file:1. **Run the conversion script**: ```bash python3 scripts/convert.py <path/to/file.md> ```2. **Open in browser** (if no Canvas node available): ```bash open <output.html> ```3. **Or push to Canvas** (if node paired): ```bash canvas present file://<output.html> ```## Usage Examples### Basic conversion```bash# Converts ai-landscape-2026.md → ai-landscape-2026.htmlpython3 scripts/convert.py ai-landscape-2026.md```### Custom output path```bashpython3 scripts/convert.py input.md -o /path/to/output.html```### Custom page title```bashpython3 scripts/convert.py notes.md -t "My Research Notes"```## Supported Markdown FeaturesThe converter handles:- **Headers** (# through ######)- **Bold** (`**text**` or `__text__`)- **Italic** (`*text*` or `_text_`)- **Code blocks** (```language ... ```)- **Inline code** (`code`)- **Links** (`[text](url)`)- **Lists** (unordered: `- `, `* `, `+ `)- **Horizontal rules** (`---`, `***`, `___`)## Design Philosophy**Token efficiency**: Template is pre-built; only markdown content flows through the context window.**Zero dependencies**: Pure Python + self-contained HTML template with embedded CSS.**Progressive enhancement**: Works offline, no CDN required, renders instantly.## Workflow1. User requests markdown rendering2. Run `scripts/convert.py` on their file3. Script reads `assets/template.html`4. Script converts markdown → HTML5. Script injects HTML into template6. Output saved alongside source (or custom path)7. Open in browser OR push to Canvas## Token Cost AnalysisPer conversion:- Read SKILL.md: ~500 tokens (first time only)- Execute script: ~100 tokens- Report result: ~50 tokens**Total: ~650 tokens** vs ~8000 tokens for generating full HTML each time.## Output LocationBy default, output is saved next to the input file:- `notes.md` → `notes.html`- `/path/to/doc.md` → `/path/to/doc.html`Use `-o` flag to specify custom location.

Frequently asked questions