A high-efficiency tool to convert markdown files into visually appealing HTML pages for browser viewing or Canvas display.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install markdown-canvas
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install markdown-canvas using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Markdown Canvas Renderer?
The Markdown Canvas Renderer is a specialized tool designed to transform static markdown files into stylized, shareable HTML documents. By utilizing a pre-built template with embedded CSS, it ensures that your technical documentation, research notes, and project READMEs look professional without requiring external dependencies or CDNs.
This skill is a vital addition to your collection of Openclaw Skills, prioritizing token efficiency and offline accessibility. Because it uses a local conversion script rather than generating raw HTML strings within the LLM context, it significantly reduces operational costs while maintaining high-fidelity output.
Markdown Canvas Renderer Use Cases
- Visualizing complex markdown reports in a clean, readable browser format.
- Sharing formatted research notes with team members as standalone HTML files.
- Pushing markdown-based content to a Canvas display node for live presentations.
- Creating aesthetic versions of project documentation for local review without a markdown editor.
How Markdown Canvas Renderer Works
- The user provides a command or trigger phrase to render a specific markdown file.
- The AI agent identifies the target file and executes the Python conversion script.
- The script reads the source markdown content and the included assets/template.html file.
- Markdown elements (headers, lists, code blocks) are parsed and converted into semantic HTML.
- The generated HTML is injected into the stylized template and saved as a new file.
- The final output is opened in a web browser or pushed to a paired Canvas node for immediate viewing.
Markdown Canvas Renderer Setup
To get started with this component of your Openclaw Skills, ensure you have Python 3 installed on your system.
# Navigate to the skill directory
# No external pip dependencies are required
# Basic conversion command
python3 scripts/convert.py path/to/your_file.md
Markdown Canvas Renderer Data Schema & Taxonomy
The skill organizes data through a simple input-output relationship, ensuring your workspace remains clean.
| Component | Type | Description |
|---|---|---|
| Input | .md file | The source markdown document containing your content. |
| Output | .html file | The rendered, self-contained HTML page generated by the skill. |
| Template | .html file | Located in assets/, this defines the visual styling and layout. |
| Script | .py file | The logic core that handles parsing and file generation. |
Markdown Canvas Renderer Advanced Features
- High Token Efficiency: Reduces token consumption by approximately 90% compared to direct HTML generation.
- Custom Output Paths: Specify exactly where your rendered file should be saved using the -o flag.
- Dynamic Titling: Set custom HTML page titles during the conversion process with the -t parameter.
- Offline Rendering: Zero external dependencies or CDN requirements allow for full functionality without an internet connection.
- Multi-format Support: Handles complex markdown elements including code blocks, horizontal rules, and nested lists.
SKILL.md
Loading
Related Openclaw Skills
Yggdrasil Connectivity
Enable globally-routable IPv6 addresses for P2P agent communication using Yggdrasil.
MagicBox Node.js Development Standard
A comprehensive development standard and best practices guide for building scalable Node.js and TypeScript applications.
Activity Logger
A lightweight skill for capturing AI agent conversations into structured daily Markdown files.
ClawHub Auto Update
Automatically manages versioning and updates for all your installed ClawHub skills to ensure your AI agents stay up to date.
WeChat Image Generator
A high-efficiency tool for creating WeChat-optimized images like covers and charts without relying on expensive image generation tokens.
Wallhaven Downloader
A powerful batch downloader for Wallhaven.cc that automates image retrieval using flexible API parameters or search URLs.
METADATA
Featured*
